chore(console): Onboarding flow for teams (#2742)

* chore(console): Onboarding flow for teams * Update redirect URL in group enrollment and add targetIG to onboarding page * Refactor onboarding route and add enrollment to existing identity group * Removed unused import
proofzero · Oct 25, 2023 · 42291b5 · 42291b5
1 parent 23458fa
commit 42291b5
Show file tree

Hide file tree

Showing 5 changed files with 274 additions and 44 deletions.
diff --git a/apps/console/app/routes/groups.enroll.$groupID.$invitationCode.tsx b/apps/console/app/routes/groups.enroll.$groupID.$invitationCode.tsx
@@ -159,7 +159,7 @@ export const action: ActionFunction = getRollupReqFunctionErrorWrapper(
       identityGroupURN,
     })
 
-    return redirect(`/groups/${groupID}`)
+    return redirect(`/onboarding`)
   }
 )
 

diff --git a/apps/console/app/routes/onboarding.tsx b/apps/console/app/routes/onboarding.tsx
@@ -24,6 +24,7 @@ import { HiOutlineBookOpen, HiOutlineLogout } from 'react-icons/hi'
 import { TbUserCog } from 'react-icons/tb'
 import useConnectResult from '@proofzero/design-system/src/hooks/useConnectResult'
 import { Toaster } from '@proofzero/design-system/src/atoms/toast'
+import { IdentityGroupURN } from '@proofzero/urns/identity-group'
 
 export const loader: LoaderFunction = getRollupReqFunctionErrorWrapper(
   async ({ request, context }) => {
@@ -53,11 +54,20 @@ export const loader: LoaderFunction = getRollupReqFunctionErrorWrapper(
     })
     const connectedEmails = getEmailDropdownItems(connectedAccounts)
 
+    const igs = await coreClient.identity.listIdentityGroups.query()
+    const targetIG =
+      igs[0] &&
+      igs[0].members.length > 1 &&
+      igs[0].members[0].URN !== identityURN
+        ? igs[0]
+        : undefined
+
     return json({
       url: request.url,
       profile,
       connectedEmails,
       PASSPORT_URL: context.env.PASSPORT_URL,
+      targetIG,
     })
   }
 )
@@ -77,14 +87,22 @@ export const shouldRevalidate = ({
 }
 
 export default function Onboarding() {
-  const { connectedEmails, PASSPORT_URL, profile, url } = useLoaderData<{
-    connectedEmails: DropdownSelectListItem[]
-    PASSPORT_URL: string
-    profile: Profile
-    url: string
-  }>()
+  const { connectedEmails, PASSPORT_URL, profile, url, targetIG } =
+    useLoaderData<{
+      connectedEmails: DropdownSelectListItem[]
+      PASSPORT_URL: string
+      profile: Profile
+      url: string
+      targetIG:
+        | {
+            name: string
+            URN: IdentityGroupURN
+          }
+        | undefined
+    }>()
 
-  const currentPage = new URL(url).searchParams.get('rollup_result') ? 1 : 0
+  const currentPage =
+    new URL(url).searchParams.get('rollup_result') || targetIG ? 1 : 0
 
   useConnectResult()
 
@@ -100,7 +118,9 @@ export default function Onboarding() {
             'basis-full 2xl:basis-2/5 flex items-start justify-center py-[2.5%] h-full'
           }
         >
-          <Outlet context={{ connectedEmails, PASSPORT_URL, currentPage }} />
+          <Outlet
+            context={{ connectedEmails, PASSPORT_URL, currentPage, targetIG }}
+          />
         </div>
         <div className="basis-3/5 h-[100dvh] w-full hidden lg:flex justify-end items-center bg-gray-50 dark:bg-gray-800 overflow-hidden">
           <img