feat(console): my auth url

proofzero · Aug 23, 2023 · f78c0a7 · f78c0a7
1 parent c3f0924
commit f78c0a7
Show file tree

Hide file tree

Showing 3 changed files with 71 additions and 5 deletions.
diff --git a/apps/console/app/routes/apps/$clientId.tsx b/apps/console/app/routes/apps/$clientId.tsx
@@ -28,9 +28,11 @@ import { PlatformAccountURNHeader } from '@proofzero/types/headers'
 import { getToastsAndFlashSession } from '~/utils/toast.server'
 import { useEffect } from 'react'
 import { ToastWithLink } from '@proofzero/design-system/src/atoms/toast/ToastWithLink'
+import { ResponseType } from '@proofzero/types/authorization'
 
 type LoaderData = {
   appDetails: appDetailsProps
+  authorizationURL: string
   rotationResult?: RotatedSecrets
   appContactAddress?: AccountURN
   appContactEmail?: string
@@ -59,14 +61,33 @@ export const loader: LoaderFunction = getRollupReqFunctionErrorWrapper(
         ...traceHeader,
       })
 
-      const appDetails = await coreClient.starbase.getAppDetails.query({
+      const appDetails = (await coreClient.starbase.getAppDetails.query({
         clientId: clientId as string,
-      })
+      })) as appDetailsProps
 
       const paymaster = await coreClient.starbase.getPaymaster.query({
         clientId: clientId as string,
       })
 
+      const authorizationURLBase =
+        appDetails.customDomain?.status === 'active'
+          ? `https://${appDetails.customDomain?.hostname}`
+          : context.env.PASSPORT_URL
+
+      const authorizationScope = appDetails.app?.scopes
+        ? Array.from(appDetails.app.scopes)
+        : ['openid', 'profile']
+
+      const authorizationSearch = new URLSearchParams({
+        client_id: appDetails.clientId as string,
+        scope: authorizationScope.join(' '),
+        redirect_uri: appDetails.app?.redirectURI as string,
+        response_type: ResponseType.Code,
+        state: 'a-random-string',
+      })
+      const authorizationURL = new URL('/authorize', authorizationURLBase)
+      authorizationURL.search = authorizationSearch.toString()
+
       let rotationResult
       //If there's no timestamps, then the secrets have never been set, signifying the app
       //has just been created; we rotate both secrets and set the timestamps
@@ -113,7 +134,8 @@ export const loader: LoaderFunction = getRollupReqFunctionErrorWrapper(
 
       return json<LoaderData>(
         {
-          appDetails: appDetails as appDetailsProps,
+          appDetails,
+          authorizationURL: authorizationURL.toString(),
           rotationResult,
           appContactAddress,
           appContactEmail,
@@ -155,6 +177,7 @@ export default function AppDetailIndexPage() {
   } = useOutletContext<OutletContextData>()
   const {
     appDetails,
+    authorizationURL,
     rotationResult,
     appContactAddress,
     appContactEmail,
@@ -226,6 +249,7 @@ export default function AppDetailIndexPage() {
                   apps,
                   notificationHandler: notify,
                   appDetails,
+                  authorizationURL,
                   avatarUrl,
                   rotationResult,
                   PASSPORT_URL,

diff --git a/apps/console/app/routes/apps/$clientId/auth.tsx b/apps/console/app/routes/apps/$clientId/auth.tsx
@@ -236,12 +236,18 @@ export default function AppDetailIndexPage() {
   const outletContextData = useOutletContext<{
     notificationHandler: notificationHandlerType
     appDetails: appDetailsProps
+    authorizationURL: string
     rotationResult: any
     paymaster: PaymasterType
     appContactAddress?: AccountURN
   }>()
-  const { appContactAddress, paymaster, notificationHandler, appDetails } =
-    outletContextData
+  const {
+    appContactAddress,
+    paymaster,
+    notificationHandler,
+    appDetails,
+    authorizationURL,
+  } = outletContextData
   const { scopeMeta }: { scopeMeta: ScopeMeta } = useLoaderData()
 
   const ref = useRef(null)
@@ -567,6 +573,24 @@ export default function AppDetailIndexPage() {
                     )}
                   </div>
                 </div>
+
+                <hr />
+
+                <div className="w-[500px]">
+                  <ReadOnlyInput
+                    id="oAuthAppAuthURL"
+                    label="My Auth URL"
+                    value={authorizationURL}
+                    copyable={true}
+                    onCopy={() =>
+                      toast(
+                        ToastType.Success,
+                        { message: 'Auth URL copied to clipboard!' },
+                        { duration: 2000 }
+                      )
+                    }
+                  />
+                </div>
               </div>
             </Panel>
 

diff --git a/apps/console/app/routes/apps/$clientId/index.tsx b/apps/console/app/routes/apps/$clientId/index.tsx
@@ -123,6 +123,7 @@ export default function AppDetailIndexPage() {
   const actionData = useActionData()
   const outletContext = useOutletContext<{
     appDetails: appDetailsProps
+    authorizationURL: string
     rotationResult: RotatedSecrets
   }>()
   const { edgesResult } = useLoaderData()
@@ -134,6 +135,7 @@ export default function AppDetailIndexPage() {
     useState(false)
 
   const { appDetails: app } = outletContext
+  const { authorizationURL } = outletContext
 
   const { rotatedClientSecret, rotatedApiKey } =
     outletContext?.rotationResult ||
@@ -285,6 +287,22 @@ export default function AppDetailIndexPage() {
                   )
                 }
               />
+
+              <hr />
+
+              <ReadOnlyInput
+                id="oAuthAppAuthURL"
+                label="My Auth URL"
+                value={authorizationURL}
+                copyable={true}
+                onCopy={() =>
+                  toast(
+                    ToastType.Success,
+                    { message: 'Auth URL copied to clipboard!' },
+                    { duration: 2000 }
+                  )
+                }
+              />
             </div>
           </Panel>