Merge pull request #128 from bc-chaz/appex-402

bc-chaz · web-flow · commit 46b1aa7186ec · 2022-09-23T16:30:44.000-07:00
fix(common): fixes upgrade alert race condition
diff --git a/.env-sample b/.env-sample
@@ -31,7 +31,7 @@ MYSQL_PASSWORD={mysql password}
 MYSQL_PORT={mysql port *optional*}
 
 # Partner Billing Config
-CURRENT_APP_ID={appId} # if different from CHECKOUT_APP_ID
+CURRENT_APP_ID={appId *if different from CHECKOUT_APP_ID*}
 CHECKOUT_APP_ID={Application ID}
 CHECKOUT_CLIENT={Partner Client ID}
 CHECKOUT_TOKEN={Partner Access Token}
diff --git a/lib/auth.ts b/lib/auth.ts
@@ -58,14 +58,6 @@ export function setSession(session: SessionProps) {
     db.setStoreUser(session);
 }
 
-export function setSubscription(pid: string, subId: string) {
-    db.setSubscriptionId(pid, subId);
-}
-
-export function setWelcome(storeHash: string, show: boolean) {
-    db.setStoreWelcome(storeHash, show);
-}
-
 export async function getSession({ query: { context = '' } }: NextApiRequest) {
     if (typeof context !== 'string') return;
     const { context: storeHash, plan, user } = decodePayload(context);
@@ -81,14 +73,6 @@ export async function getSession({ query: { context = '' } }: NextApiRequest) {
     return { accessToken, ...(plan && { plan }), storeHash, user };
 }
 
-export async function getSubscriptionById(pid: string) {
-    return await db.getSubscriptionId(pid);
-}
-
-export async function getSubscriptionInfo(storeHash: string) {
-    return await db.getStorePlan(storeHash);
-}
-
 // JWT functions to sign/ verify 'context' query param from /api/auth||load
 export function encodePayload({ user, owner, ...session }: SessionProps) {
     const contextString = session?.context ?? session?.sub;
@@ -117,3 +101,20 @@ export async function logoutUser({ storeHash, user }: SessionContextProps) {
     const session = { context: `store/${storeHash}`, user };
     await db.deleteUser(session);
 }
+
+// CHECKOUT functions
+export function setCheckout(pid: string, subId: string) {
+    db.setCheckoutId(pid, subId);
+}
+
+export async function getCheckoutById(pid: string) {
+    return await db.getCheckoutId(pid);
+}
+
+export function setWelcome(storeHash: string, show: boolean) {
+    db.setStoreWelcome(storeHash, show);
+}
+
+export async function getSubscriptionInfo(storeHash: string) {
+    return await db.getStorePlan(storeHash);
+}
diff --git a/lib/checkout.ts b/lib/checkout.ts
@@ -116,7 +116,7 @@ export function getCheckoutBody(productId: string, storeHash: string) {
                         type: 'STORE'
                     },
                     pricingPlan: planItems[productId].pricingPlan,
-                    redirectUrl: `https://store-${storeHash}.my${hostName}/manage/app/${appId}/${productId}`,
+                    redirectUrl: `https://store-${storeHash}.my${hostName}/manage/app/${appId}/upgrade/${productId}`,
                     description: 'application'
                     }
                 ]
diff --git a/lib/dbs/firebase.ts b/lib/dbs/firebase.ts
@@ -16,15 +16,6 @@ const db = getFirestore(app);
 
 // Firestore data management functions
 
-// Persist subscription info
-export async function setSubscriptionId(pid: string, subscriptionId: string) {
-    if (!pid || !subscriptionId) return null;
-
-    const ref = doc(db, 'subscription', pid);
-
-    await setDoc(ref, { subscriptionId });
-}
-
 // Use setUser for storing global user data (persists between installs)
 export async function setUser({ user }: SessionProps) {
     if (!user) return null;
@@ -57,28 +48,6 @@ export async function setStore(session: SessionProps) {
     await setDoc(ref, data);
 }
 
-export async function setStorePlan(session: SessionProps) {
-    const { access_token: accessToken, context, plan, sub } = session;
-    // Only set on app install or subscription verification (load)
-    if ((!accessToken && !plan?.pid) || (plan && !plan.isPaidApp)) return null;
-
-    const contextString = context ?? sub;
-    const storeHash = contextString?.split('/')[1] || '';
-    const defaultEnd = Date.now() + (trialDays * 24 * 60 * 60 * 1000);
-    const ref = doc(db, 'plan', storeHash);
-    const data = { pid: '', isPaidApp: false, showPaidWelcome: false, trialEndDate: defaultEnd, ...plan };
-
-    await setDoc(ref, data);
-}
-
-export async function setStoreWelcome(storeHash: string, show: boolean) {
-    if (!storeHash) return null;
-
-    const ref = doc(db, 'plan', storeHash);
-
-    await setDoc(ref, { showPaidWelcome: show }, { merge: true });
-}
-
 // User management for multi-user apps
 // Use setStoreUser for storing store specific variables
 export async function setStoreUser(session: SessionProps) {
@@ -114,7 +83,6 @@ export async function setStoreUser(session: SessionProps) {
     }
 }
 
-
 export async function deleteUser({ context, user, sub }: SessionProps) {
     const contextString = context ?? sub;
     const storeHash = contextString?.split('/')[1] || '';
@@ -133,6 +101,36 @@ export async function hasStoreUser(storeHash: string, userId: string) {
     return userDoc.exists();
 }
 
+export async function getStoreToken(storeHash: string) {
+    if (!storeHash) return null;
+
+    const storeDoc = await getDoc(doc(db, 'store', storeHash));
+
+    return storeDoc.exists() ? storeDoc.data()?.accessToken : null;
+}
+
+
+export async function deleteStore({ store_hash: storeHash }: SessionProps) {
+    const ref = doc(db, 'store', storeHash);
+
+    await deleteDoc(ref);
+}
+
+// CHECKOUT Functions
+export async function setStorePlan(session: SessionProps) {
+    const { access_token: accessToken, context, plan, sub } = session;
+    // Only set on app install or subscription verification (load)
+    if ((!accessToken && !plan?.pid) || (plan && !plan.isPaidApp)) return null;
+
+    const contextString = context ?? sub;
+    const storeHash = contextString?.split('/')[1] || '';
+    const defaultEnd = Date.now() + (trialDays * 24 * 60 * 60 * 1000);
+    const ref = doc(db, 'plan', storeHash);
+    const data = { pid: '', isPaidApp: false, showPaidWelcome: false, trialEndDate: defaultEnd, ...plan };
+
+    await setDoc(ref, data);
+}
+
 export async function getStorePlan(storeHash: string) {
     if (!storeHash) return null;
 
@@ -141,24 +139,26 @@ export async function getStorePlan(storeHash: string) {
     return planDoc.exists() ? planDoc.data() : null;
 }
 
-export async function getStoreToken(storeHash: string) {
+export async function setStoreWelcome(storeHash: string, show: boolean) {
     if (!storeHash) return null;
 
-    const storeDoc = await getDoc(doc(db, 'store', storeHash));
+    const ref = doc(db, 'plan', storeHash);
 
-    return storeDoc.exists() ? storeDoc.data()?.accessToken : null;
+    await setDoc(ref, { showPaidWelcome: show }, { merge: true });
 }
 
-export async function getSubscriptionId(pid: string) {
-    if (!pid) return null;
+export async function setCheckoutId(pid: string, checkoutId: string) {
+    if (!pid || !checkoutId) return null;
 
-    const subDoc = await getDoc(doc(db, 'subscription', pid));
+    const ref = doc(db, 'checkout', pid);
 
-    return subDoc.exists() ? subDoc.data()?.subscriptionId : null;
+    await setDoc(ref, { checkoutId });
 }
 
-export async function deleteStore({ store_hash: storeHash }: SessionProps) {
-    const ref = doc(db, 'store', storeHash);
+export async function getCheckoutId(pid: string) {
+    if (!pid) return null;
 
-    await deleteDoc(ref);
+    const checkoutDoc = await getDoc(doc(db, 'checkout', pid));
+
+    return checkoutDoc.exists() ? checkoutDoc.data()?.checkoutId : null;
 }
diff --git a/pages/api/checkout/[pid].ts b/pages/api/checkout/[pid].ts
@@ -1,5 +1,5 @@
 import { NextApiRequest, NextApiResponse } from 'next';
-import { getSession, setSubscription } from '../../../lib/auth';
+import { getSession, setCheckout } from '../../../lib/auth';
 import { getCheckoutBody } from '../../../lib/checkout';
 
 export default async function checkout(req: NextApiRequest, res: NextApiResponse) {
@@ -24,8 +24,8 @@ export default async function checkout(req: NextApiRequest, res: NextApiResponse
             throw new Error(errors[0]?.message);
         }
 
-        const subId = data?.checkout?.createCheckout?.checkout?.id.split('/')[3] ?? '';
-        if (subId) setSubscription(String(pid), subId);
+        const checkoutId = data?.checkout?.createCheckout?.checkout?.id.split('/')[3] ?? '';
+        if (checkoutId) setCheckout(String(pid), checkoutId);
 
         res.status(200).json(data?.checkout?.createCheckout?.checkout);
     } catch (error) {
diff --git a/pages/api/checkout/removeWelcome.ts b/pages/api/checkout/removeWelcome.ts
@@ -0,0 +1,14 @@
+import { NextApiRequest, NextApiResponse } from 'next';
+import { getSession, setWelcome } from '../../../lib/auth';
+
+export default async function removeWelcome(req: NextApiRequest, res: NextApiResponse) {
+    try {
+        const { storeHash } = await getSession(req);
+        setWelcome(storeHash, false);
+
+        res.status(200).json({});
+    } catch (error) {
+        const { message, response } = error;
+        res.status(response?.status || 500).json({ message });
+    }
+}
diff --git a/pages/api/load.ts b/pages/api/load.ts
@@ -1,5 +1,5 @@
 import { NextApiRequest, NextApiResponse } from 'next';
-import { encodePayload, getBCVerify, getSubscriptionById, setSession } from '../../lib/auth';
+import { encodePayload, getBCVerify, getCheckoutById, setSession } from '../../lib/auth';
 import { getSubscriptionBody } from '../../lib/checkout';
 
 const buildRedirectUrl = (url: string, encodedContext: string) => {
@@ -18,7 +18,7 @@ export default async function load(req: NextApiRequest, res: NextApiResponse) {
 
         // If redirected from checkout, verify checkout
         if (pid) {
-            const subId = await getSubscriptionById(pid);
+            const subId = await getCheckoutById(pid);
             if (subId !== null) {
                 const subscriptionBody = getSubscriptionBody(String(subId));
                 const response = await fetch(`${process.env.CHECKOUT_URL}`, {
diff --git a/pages/api/subscription/index.ts b/pages/api/subscription/index.ts
@@ -1,18 +1,11 @@
 import { NextApiRequest, NextApiResponse } from 'next';
-import { getSession, getSubscriptionInfo, setWelcome } from '../../../lib/auth';
+import { getSession, getSubscriptionInfo } from '../../../lib/auth';
 
 export default async function subscription(req: NextApiRequest, res: NextApiResponse) {
     try {
         const { plan, storeHash } = await getSession(req);
         const data = plan ?? await getSubscriptionInfo(storeHash);
 
-        if (data?.showPaidWelcome) {
-            // TODO: setWelcome after alert has shown
-            setTimeout(() => {
-                setWelcome(storeHash, false);
-            }, 1000);
-        }
-
         res.status(200).json(data);
     } catch (error) {
         const { message, response } = error;
diff --git a/pages/index.tsx b/pages/index.tsx
@@ -3,17 +3,19 @@ import { useCallback, useEffect } from 'react';
 import styled from 'styled-components';
 import ErrorMessage from '../components/error';
 import Loading from '../components/loading';
+import { useSession } from '../context/session';
 import { plans } from '../lib/checkout';
 import { useAlerts, useProducts, useSubscription } from '../lib/hooks';
 
 const Index = () => {
     const alertsManager = useAlerts();
     const { error, isLoading, summary } = useProducts();
+    const encodedContext = useSession()?.context;
     const { subscription } = useSubscription();
-    const { pid: appPID, showPaidWelcome } = subscription ?? {};
+    const { pid: planId, showPaidWelcome } = subscription ?? {};
 
-    const getUpgradeAlert = useCallback(() => {
-        const planName = plans.find(plan => plan.pid === appPID)?.name;
+    const handleUpgradeMsg = useCallback(async () => {
+        const planName = plans.find(plan => plan.pid === planId)?.name;
         if (!planName) return;
 
         alertsManager.add({
@@ -30,11 +32,14 @@ const Index = () => {
             type: 'success',
             autoDismiss: true,
         });
-    }, [alertsManager, appPID]);
+
+        // Remove alert once shown
+        await fetch(`/api/checkout/removeWelcome?context=${encodedContext}`);
+    }, [alertsManager, encodedContext, planId]);
 
     useEffect(() => {
-        if (showPaidWelcome) getUpgradeAlert();
-    }, [showPaidWelcome, getUpgradeAlert]);
+        if (showPaidWelcome) handleUpgradeMsg();
+    }, [showPaidWelcome, handleUpgradeMsg]);
 
     if (isLoading) return <Loading />;
     if (error) return <ErrorMessage error={error} />;
diff --git a/types/db.ts b/types/db.ts
@@ -23,7 +23,7 @@ export interface Db {
     deleteUser(session: SessionProps): Promise<void>;
     setStorePlan?(session: SessionProps): Promise<void>;
     setStoreWelcome?(storeHash: string, show: boolean): Promise<void>;
-    setSubscriptionId?(pid: string, subscriptionId: string): Promise<void>;
+    setCheckoutId?(pid: string, subscriptionId: string): Promise<void>;
     getStorePlan?(storeHash: string): Promise<DocumentData>;
-    getSubscriptionId?(pid: string): Promise<void> | null;
+    getCheckoutId?(pid: string): Promise<void> | null;
 }

Original file line number	Diff line number	Diff line change
`@@ -116,7 +116,7 @@ export function getCheckoutBody(productId: string, storeHash: string) {`
`116`	`116`	`type: 'STORE'`
`117`	`117`	`},`
`118`	`118`	`pricingPlan: planItems[productId].pricingPlan,`
`119`		- redirectUrl: `https://store-${storeHash}.my${hostName}/manage/app/${appId}/${productId}`,
	`119`	+ redirectUrl: `https://store-${storeHash}.my${hostName}/manage/app/${appId}/upgrade/${productId}`,
`120`	`120`	`description: 'application'`
`121`	`121`	`}`
`122`	`122`	`]`