Merge pull request #1852 from holium/fix-byop-double-request-issue

Add logging to BE & make `product_type` query param

hosting-holium-com/src/pages/account/custom-domain.tsx

@@ -3,7 +3,6 @@ import { useMemo, useState } from 'react';
 import { useToggle } from '@holium/design-system/util';
 import {
   AccountCustomDomainDialog,
-  OnboardingStorage,
   UserContextProvider,
   useUser,
 } from '@holium/shared';
@@ -71,16 +70,12 @@ const CustomDomainPresenter = () => {
   };
 
   const onClickUploadId = () => {
-    OnboardingStorage.set({
-      productType: 'byop-p',
-    });
     goToPage('/upload-id-disclaimer', {
       back_url: '/account/custom-domain',
     });
   };
 
   const onClickPurchaseId = () => {
-    OnboardingStorage.remove('productType');
     goToPage('/choose-id', {
       back_url: '/account/custom-domain',
     });

hosting-holium-com/src/pages/account/download-realm.tsx

@@ -1,6 +1,5 @@
 import {
   AccountDownloadRealmDialog,
-  OnboardingStorage,
   UserContextProvider,
   useUser,
 } from '@holium/shared';
@@ -28,16 +27,12 @@ const DownloadRealmPresenter = () => {
   };
 
   const onClickUploadId = () => {
-    OnboardingStorage.set({
-      productType: 'byop-p',
-    });
     goToPage('/upload-id-disclaimer', {
       back_url: '/account/download-realm',
     });
   };
 
   const onClickPurchaseId = () => {
-    OnboardingStorage.remove('productType');
     goToPage('/choose-id', {
       back_url: '/account/download-realm',
     });

hosting-holium-com/src/pages/account/get-realm.tsx

@@ -1,8 +1,4 @@
-import {
-  AccountGetRealmDialog,
-  OnboardingStorage,
-  UserContextProvider,
-} from '@holium/shared';
+import { AccountGetRealmDialog, UserContextProvider } from '@holium/shared';
 
 import { thirdEarthApi } from 'util/thirdEarthApi';
 
@@ -32,16 +28,12 @@ const GetRealmPresenter = () => {
   const { goToPage, logout } = useNavigation();
 
   const onClickUploadId = () => {
-    OnboardingStorage.set({
-      productType: 'byop-p',
-    });
     goToPage('/upload-id-disclaimer', {
       back_url: '/account/get-realm',
     });
   };
 
   const onClickPurchaseId = () => {
-    OnboardingStorage.remove('productType');
     goToPage('/choose-id', {
       back_url: '/account/get-realm',
     });

hosting-holium-com/src/pages/account/index.tsx

@@ -186,26 +186,19 @@ const HostingPresenter = () => {
   };
 
   const onClickUploadId = () => {
-    OnboardingStorage.set({
-      productType: 'byop-p',
-    });
     goToPage('/upload-id-disclaimer', {
       back_url: '/account',
     });
   };
 
   const onClickReuploadId = () => {
-    OnboardingStorage.set({
-      productType: 'byop-p',
-      provisionalShipId: selectedShipId?.toString(),
-    });
     goToPage('/upload-id', {
+      product_type: 'byop-p',
       back_url: '/account',
     });
   };
 
   const onClickPurchaseId = () => {
-    OnboardingStorage.remove('productType');
     goToPage('/choose-id', {
       back_url: '/account',
     });

hosting-holium-com/src/pages/account/storage.tsx

@@ -2,7 +2,6 @@ import { useEffect, useState } from 'react';
 
 import {
   AccountStorageDialog,
-  OnboardingStorage,
   UserContextProvider,
   useUser,
 } from '@holium/shared';
@@ -35,16 +34,12 @@ const S3StoragePresenter = () => {
   };
 
   const onClickUploadId = () => {
-    OnboardingStorage.set({
-      productType: 'byop-p',
-    });
     goToPage('/upload-id-disclaimer', {
       back_url: '/account/storage',
     });
   };
 
   const onClickPurchaseId = () => {
-    OnboardingStorage.remove('productType');
     goToPage(accountPageUrl['Get Hosting'], {
       back_url: '/account/storage',
     });

hosting-holium-com/src/pages/booting.tsx

@@ -1,13 +1,34 @@
 import { useCallback, useEffect, useRef, useState } from 'react';
+import type { GetServerSideProps } from 'next/types';
 
 import { useToggle } from '@holium/design-system/util';
-import { BootingDialog, OnboardingStorage } from '@holium/shared';
+import {
+  BootingDialog,
+  OnboardingStorage,
+  ThirdEarthProductType,
+} from '@holium/shared';
 
 import { Page } from '../components/Page';
 import { thirdEarthApi } from '../util/thirdEarthApi';
 import { useNavigation } from '../util/useNavigation';
 
-export default function Booting() {
+type ServerSideProps = {
+  // We use underscore to highlight that this is a query param.
+  product_type: ThirdEarthProductType;
+};
+
+export const getServerSideProps: GetServerSideProps = async ({ query }) => {
+  const product_type = (query.product_type ??
+    'planet') as ThirdEarthProductType;
+
+  return {
+    props: {
+      product_type,
+    } as ServerSideProps,
+  };
+};
+
+export default function Booting({ product_type }: ServerSideProps) {
   const { goToPage } = useNavigation();
 
   const intervalRef = useRef<NodeJS.Timer>();
@@ -18,7 +39,7 @@ export default function Booting() {
   const isBYOP = useToggle(false);
 
   const pollShipStatus = useCallback(async () => {
-    const { serverId, token, productType } = OnboardingStorage.get();
+    const { serverId, token } = OnboardingStorage.get();
 
     if (!token) return;
 
@@ -30,7 +51,7 @@ export default function Booting() {
       error.toggleOn();
     }
 
-    if (productType === 'byop-p') {
+    if (product_type === 'byop-p') {
       isBYOP.toggleOn();
       ship = Object.values(ships)
         .filter((s) => s.product_type === 'byop-p' && s.is_migration)
@@ -44,7 +65,7 @@ export default function Booting() {
     if (!ship) return;
 
     if (logs.length === 1) {
-      if (productType === 'byop-p') {
+      if (product_type === 'byop-p') {
         setLogs((logs) => [
           ...logs,
           `Your uploaded identity will be ready in 5-10 minutes.`,

hosting-holium-com/src/pages/create-account.tsx

@@ -2,28 +2,38 @@ import { useEffect, useState } from 'react';
 import { FormikValues } from 'formik';
 import type { GetServerSideProps } from 'next/types';
 
-import { CreateAccountDialog, OnboardingStorage } from '@holium/shared';
+import {
+  CreateAccountDialog,
+  OnboardingStorage,
+  ThirdEarthProductType,
+} from '@holium/shared';
 
 import { Page } from '../components/Page';
 import { thirdEarthApi } from '../util/thirdEarthApi';
 import { useNavigation } from '../util/useNavigation';
 
 type ServerSideProps = {
-  hideAlreadyHaveAccount: string;
+  // We use underscore to highlight that this is a query param.
+  product_type: ThirdEarthProductType;
+  hide_already_have_account: string;
 };
 
 export const getServerSideProps: GetServerSideProps = async ({ query }) => {
-  const hideAlreadyHaveAccount = (query.haha ?? '') as string;
+  const hide_already_have_account = (query.haha ?? '') as string;
+  const product_type = (query.product_type ??
+    'planet') as ThirdEarthProductType;
 
   return {
     props: {
-      hideAlreadyHaveAccount: hideAlreadyHaveAccount === 'true',
+      product_type,
+      hide_already_have_account: hide_already_have_account === 'true',
     },
   };
 };
 
 export default function CreateAccount({
-  hideAlreadyHaveAccount,
+  product_type,
+  hide_already_have_account,
 }: ServerSideProps) {
   const { goToPage } = useNavigation();
 
@@ -40,7 +50,9 @@ export default function CreateAccount({
     try {
       const result = await thirdEarthApi.register(email, password);
       if (result) {
-        return goToPage('/verify-email');
+        return goToPage('/verify-email', {
+          product_type,
+        });
       } else {
         return false;
       }
@@ -62,7 +74,7 @@ export default function CreateAccount({
         onBack={onBack}
         onNext={onNext}
         onAlreadyHaveAccount={
-          hideAlreadyHaveAccount ? undefined : onAlreadyHaveAccount
+          hide_already_have_account ? undefined : onAlreadyHaveAccount
         }
       />
     </Page>

hosting-holium-com/src/pages/index.tsx

@@ -28,16 +28,13 @@ export default function GetOnRealm({ email }: Props) {
   };
 
   const onUploadId = () => {
-    OnboardingStorage.set({ productType: 'byop-p' });
-
     return goToPage('/create-account', {
       haha: 'true',
+      product_type: 'byop-p',
     });
   };
 
   const onPurchaseId = async () => {
-    OnboardingStorage.remove('productType');
-
     return goToPage('/create-account', {
       haha: 'true',
     });