From f762c041400585a75552ec2bbaeacbb0f16670a4 Mon Sep 17 00:00:00 2001
From: MarconLP <13001502+MarconLP@users.noreply.github.com>
Date: Thu, 13 Jul 2023 14:05:28 +0200
Subject: [PATCH] adjust stripe checkout experience

---
 src/pages/videos.tsx             | 33 ++++++++++++++++++++++++++++----
 src/server/api/routers/stripe.ts |  4 +++-
 2 files changed, 32 insertions(+), 5 deletions(-)

diff --git a/src/pages/videos.tsx b/src/pages/videos.tsx
index 5cb6278..1601597 100644
--- a/src/pages/videos.tsx
+++ b/src/pages/videos.tsx
@@ -80,7 +80,7 @@ const VideoList: NextPage = () => {
   }, [closeQueryParam]);
 
   useEffect(() => {
-    if (checkoutCanceledQueryParam === "false" && closeQueryParam === "false") {
+    if (checkoutCanceledQueryParam && closeQueryParam === "false") {
       setTimeout(() => {
         void router.push("/videos").then(() => router.reload());
       }, 5000);
@@ -152,9 +152,34 @@ const VideoList: NextPage = () => {
                   )}
                 </div>
               ) : (
-                <span className="text-lg font-semibold text-zinc-700">
-                  You can now close this window
-                </span>
+                <div className="flex flex-col">
+                  {checkoutCanceledQueryParam === "true" ? (
+                    <>
+                      <span className="text-lg font-semibold text-zinc-700">
+                        Purchase cancelled
+                      </span>
+                      {closeQueryParam === "true" ? (
+                        <span className="mt-1 text-base text-zinc-500">
+                          You can now close this window
+                        </span>
+                      ) : (
+                        <span className="mt-1 text-base text-zinc-500">
+                          You will be redirected shortly
+                        </span>
+                      )}
+                    </>
+                  ) : (
+                    <>
+                      <span className="text-lg font-semibold text-zinc-700">
+                        Successfully logged in
+                      </span>
+                      <span className="mt-1 text-base text-zinc-500">
+                        You can now close this window and try to upload the
+                        video again!
+                      </span>
+                    </>
+                  )}
+                </div>
               )}
             </>
           ) : (
diff --git a/src/server/api/routers/stripe.ts b/src/server/api/routers/stripe.ts
index 475306a..a3a5e1d 100644
--- a/src/server/api/routers/stripe.ts
+++ b/src/server/api/routers/stripe.ts
@@ -50,7 +50,9 @@ export const stripeRouter = createTRPCRouter({
           success_url: input.recordModalOpen
             ? `${baseUrl}/videos?checkoutCanceled=false&close=true`
             : `${baseUrl}/videos?checkoutCanceled=false&close=false`,
-          cancel_url: `${baseUrl}/videos?checkoutCanceled=true`,
+          cancel_url: input.recordModalOpen
+            ? `${baseUrl}/videos?checkoutCanceled=true&close=true`
+            : `${baseUrl}/videos?checkoutCanceled=true&close=false`,
           subscription_data: {
             trial_settings: {
               end_behavior: {