diff --git a/app/components/cart-listitem.tsx b/app/components/cart-listitem.tsx index ef2963e..e4b8964 100644 --- a/app/components/cart-listitem.tsx +++ b/app/components/cart-listitem.tsx @@ -1,5 +1,5 @@ import type { ReactNode } from "react"; -import { useFetcher } from "remix"; +import { useFetcher, useLocation } from "remix"; import cn from "classnames"; import { PickTranslations } from "~/translations.server"; @@ -27,6 +27,7 @@ export function CartListItem({ "Add item" | "Remove from cart" | "Subtract item" | "Quantity: $1" >; }) { + let location = useLocation(); let { Form } = useFetcher(); return ( @@ -62,8 +63,14 @@ export function CartListItem({

{formattedPrice}

-
+ + + + ) : null} - + + { return actionHeaders; @@ -17,8 +18,8 @@ export let action: ActionFunction = async ({ request, params }) => { ]); let formData = new URLSearchParams(body); + let redirectTo = validateRedirect(formData.get("redirect"), "/cart"); let action = formData.get("_action"); - console.log(Array.from(formData)); try { let cart = await session.getCart(); @@ -45,7 +46,7 @@ export let action: ActionFunction = async ({ request, params }) => { } await session.setCart(cart); - return json(null, { + return redirect(redirectTo, { headers: { "Set-Cookie": await session.commitSession(), }, @@ -54,7 +55,7 @@ export let action: ActionFunction = async ({ request, params }) => { console.error(error); } - return null; + return redirect(redirectTo); }; export type LoaderData = { diff --git a/app/containers/pdp/pdp.server.ts b/app/containers/pdp/pdp.server.ts index 243e5f2..3f22ae2 100644 --- a/app/containers/pdp/pdp.server.ts +++ b/app/containers/pdp/pdp.server.ts @@ -1,4 +1,4 @@ -import { json } from "remix"; +import { json, redirect } from "remix"; import type { ActionFunction, HeadersFunction, LoaderFunction } from "remix"; import commerce from "~/commerce.server"; @@ -6,6 +6,7 @@ import { addToCart, getSession } from "~/session.server"; import { getTranslations } from "~/translations.server"; import type { PickTranslations } from "~/translations.server"; import type { FullProduct } from "~/models/ecommerce-provider.server"; +import { validateRedirect } from "~/utils/redirect.server"; export let headers: HeadersFunction = ({ actionHeaders }) => { return actionHeaders; @@ -17,15 +18,19 @@ export let action: ActionFunction = async ({ request, params }) => { getSession(request, params), ]); let formData = new URLSearchParams(body); + let redirectTo = validateRedirect( + formData.get("redirect"), + `/product/${params.slug}` + ); let variantId = formData.get("variantId"); if (!variantId) { - return null; + return redirect(redirectTo); } let cart = await session.getCart(); cart = addToCart(cart, variantId, 1); await session.setCart(cart); - return json(null, { + return redirect(redirectTo, { headers: { "Set-Cookie": await session.commitSession(), }, diff --git a/app/utils/redirect.server.ts b/app/utils/redirect.server.ts new file mode 100644 index 0000000..8a83e31 --- /dev/null +++ b/app/utils/redirect.server.ts @@ -0,0 +1,10 @@ +export function validateRedirect( + redirect: string | null | undefined, + defaultRediret: string +) { + if (redirect?.startsWith("/") && redirect[1] !== "/") { + return redirect; + } + + return defaultRediret; +}