credit purchase maintains state through search queries

noahgsolomon · Oct 30, 2024 · 35dace4 · 35dace4
1 parent d844af7
commit 35dace4
Show file tree

Hide file tree

Showing 3 changed files with 75 additions and 9 deletions.
diff --git a/src/app/buy-credits-dialog.tsx b/src/app/buy-credits-dialog.tsx
@@ -47,18 +47,39 @@ import {
   CardHeader,
 } from "@/components/ui/card";
 
-export default function BuyCreditsDialog() {
+export default function BuyCreditsDialog({
+  searchParams,
+  searchQueryString,
+}: {
+  searchParams?: {
+    agent1Id?: string;
+    agent2Id?: string;
+    agent1Name?: string;
+    agent2Name?: string;
+    title?: string;
+    credits?: string;
+    music?: string;
+    background?: string;
+    assetType?: string;
+    duration?: string;
+    fps?: string;
+  };
+  searchQueryString?: string;
+}) {
+  const obj = searchQueryString
+    ? { searchQueryString }
+    : searchParams
+    ? { searchParams: searchParams }
+    : undefined;
+
   const { mutate: createStripeSession } =
     trpc.user.createCreditPackSession.useMutation({
       onSuccess: ({ url }) => {
         if (url) window.location.href = url;
       },
     });
 
-  const [showCredits, setShowCredits] = useState(false);
   const [creditPacks, setCreditPacks] = useState(1);
-  const cost = creditPacks * 5;
-  const totalCredits = creditPacks * 25;
 
   return (
     <Dialog>
@@ -108,7 +129,7 @@ export default function BuyCreditsDialog() {
             <p className="text-lg font-bold">Total: ${creditPacks * 5}</p>
             <Button
               variant="default"
-              onClick={() => createStripeSession({ creditPacks })}
+              onClick={() => createStripeSession({ creditPacks, ...obj })}
               className="mt-2 flex w-full flex-row items-center justify-center gap-2"
             >
               Purchase Credits <Zap className="h-4" />

diff --git a/src/app/generationtype.tsx b/src/app/generationtype.tsx
@@ -211,7 +211,7 @@ export default function GenerationType() {
                       GO PRO <Crown className="size-4" />
                     </Button>
                   </ProButton>
-                  <BuyCreditsDialog />
+                  <BuyCreditsDialog searchQueryString={searchQueryString} />
                 </div>
               </div>
             </div>

diff --git a/src/server/api/routers/users.ts b/src/server/api/routers/users.ts
@@ -279,8 +279,53 @@ export const userRouter = createTRPCRouter({
     ),
 
   createCreditPackSession: protectedProcedure
-    .input(z.object({ creditPacks: z.number().min(1).max(10) }))
+    .input(
+      z.object({
+        creditPacks: z.number().min(1).max(10),
+        searchParams: z
+          .object({
+            agent1Id: z.string().optional(),
+            agent2Id: z.string().optional(),
+            agent1Name: z.string().optional(),
+            agent2Name: z.string().optional(),
+            title: z.string().optional(),
+            credits: z.string().optional(),
+            music: z.string().optional(),
+            background: z.string().optional(),
+            assetType: z.string().optional(),
+            duration: z.string().optional(),
+            fps: z.string().optional(),
+          })
+          .optional(),
+        searchQueryString: z.string().optional(),
+      }),
+    )
     .mutation(async ({ ctx, input }) => {
+      const searchParams = input?.searchParams ?? {};
+      const searchQueryString = input?.searchQueryString
+        ? input?.searchQueryString
+        : `?agent1Id=${encodeURIComponent(
+            searchParams.agent1Id || "",
+          )}&agent2Id=${encodeURIComponent(
+            searchParams.agent2Id || "",
+          )}&agent1Name=${encodeURIComponent(
+            searchParams.agent1Name || "",
+          )}&agent2Name=${encodeURIComponent(
+            searchParams.agent2Name || "",
+          )}&title=${encodeURIComponent(
+            searchParams.title || "",
+          )}&credits=${encodeURIComponent(
+            searchParams.credits || "",
+          )}&music=${encodeURIComponent(
+            searchParams.music || "",
+          )}&background=${encodeURIComponent(
+            searchParams.background || "",
+          )}&assetType=${encodeURIComponent(
+            searchParams.assetType || "",
+          )}&duration=${encodeURIComponent(
+            searchParams.duration || "",
+          )}&fps=${encodeURIComponent(searchParams.fps || "")}`;
+
       const dbUser = await ctx.db.query.brainrotusers.findFirst({
         where: eq(brainrotusers.id, ctx.user_id),
       });
@@ -290,8 +335,8 @@ export const userRouter = createTRPCRouter({
       }
 
       const session = await stripe.checkout.sessions.create({
-        success_url: absoluteUrl("/"),
-        cancel_url: absoluteUrl("/"),
+        success_url: absoluteUrl(`/${searchQueryString}`),
+        cancel_url: absoluteUrl(`/${searchQueryString}`),
         payment_method_types: ["card"],
         mode: "payment",
         billing_address_collection: "auto",