fix register flow

aryaniyaps · Mar 5, 2024 · 5effcea · 5effcea
1 parent 1254506
commit 5effcea
Show file tree

Hide file tree

Showing 7 changed files with 38 additions and 30 deletions.
diff --git a/client/app/(authentication)/register/page.tsx b/client/app/(authentication)/register/page.tsx
@@ -9,21 +9,17 @@ export default async function RegisterPage() {
   const cookieStore = cookies();
   const flowId = cookieStore.get(REGISTER_FLOW_ID_COOKIE);
 
-  let flow;
+  let flow = null;
 
   if (flowId) {
     try {
-      console.log('GETTING FLOW DATA: ', flowId.value);
-      const { data } = await client.GET('/auth/register/flows', {
-        params: { cookie: { register_flow_id: flowId.value } },
+      const { data } = await client.GET('/auth/register/flows/{flow_id}', {
+        params: { path: { flow_id: flowId.value } },
       });
       if (data) {
-        console.log('GOT FLOW DATA');
         flow = data;
       }
     } catch (err) {
-      console.log(typeof err);
-      console.log(JSON.stringify(err, null, 4));
       // TODO: handle errs better
       // TODO: delete register flow ID cookie if it is invalid
       // cookieStore.delete(REGISTER_FLOW_ID_COOKIE);

diff --git a/client/components/register/email-verification.tsx b/client/components/register/email-verification.tsx
@@ -27,7 +27,7 @@ const registerVerificationSchema = yup
   .required();
 
 export default function RegisterEmailVerification() {
-  const { setCurrentStep, flow: flowData } = useRegisterFlow();
+  const { setCurrentStep, flow } = useRegisterFlow();
 
   const router = useRouter();
 
@@ -43,7 +43,7 @@ export default function RegisterEmailVerification() {
       // verify register flow
       const { data } = await client.POST('/auth/register/flows/verify', {
         body: { verificationCode: input.verificationCode },
-        params: { cookie: { register_flow_id: flowData!.id } },
+        params: { cookie: { register_flow_id: flow!.id } },
       });
 
       if (data) {
@@ -61,7 +61,7 @@ export default function RegisterEmailVerification() {
   const resendVerificationCode = async () => {
     await client.POST('/auth/register/flows/resend-verification', {
       params: {
-        cookie: { register_flow_id: flowData!.id },
+        cookie: { register_flow_id: flow!.id },
         header: { 'user-agent': navigator.userAgent },
       },
     });
@@ -73,7 +73,7 @@ export default function RegisterEmailVerification() {
         <div className='flex flex-col gap-unit-2'>
           <h1 className='text-md font-semibold'>Enter Verification Code</h1>
           <h3 className='text-xs font-extralight'>
-            Enter the code we sent to {flowData?.email}
+            Enter the code we sent to {flow?.email}
           </h3>
         </div>
         <Button size='sm' variant='ghost' onClick={resendVerificationCode}>
@@ -163,7 +163,7 @@ export default function RegisterEmailVerification() {
           fullWidth
           onClick={async () => {
             await client.POST('/auth/register/flows/cancel', {
-              params: { cookie: { register_flow_id: flowData!.id } },
+              params: { cookie: { register_flow_id: flow!.id } },
             });
             router.refresh();
           }}

diff --git a/client/components/register/flow-provider.tsx b/client/components/register/flow-provider.tsx
@@ -4,25 +4,31 @@ import { createContext, useContext, useState } from 'react';
 interface RegisterFlowContextType {
   setCurrentStep: (step: string | null) => void;
   currentStep: string | null;
-  flow: { email: string; currentStep: string; id: string } | undefined;
+  flow: { email: string; currentStep: string; id: string } | null;
+  setFlow: (flow: { email: string; currentStep: string; id: string }) => void;
 }
 
-// TODO: pass register flow email here
 const RegisterFlowContext = createContext<RegisterFlowContextType>({
   setCurrentStep(step) {},
   currentStep: null,
-  flow: undefined,
+  setFlow(flow) {},
+  flow: null,
 });
 
 export const useRegisterFlow = () => useContext(RegisterFlowContext);
 
 interface RegisterFlowProviderProps {
-  flow: { email: string; currentStep: string; id: string } | undefined;
+  flow: { email: string; currentStep: string; id: string } | null;
 }
 
 export const RegisterFlowProvider: React.FC<
   React.PropsWithChildren<RegisterFlowProviderProps>
 > = ({ children, flow }) => {
+  const [localFlow, setFlow] = useState<{
+    email: string;
+    currentStep: string;
+    id: string;
+  } | null>(flow ? flow : null);
   const [localCurrentStep, setCurrentStep] = useState<string | null>(
     flow ? flow.currentStep : null
   );
@@ -32,7 +38,8 @@ export const RegisterFlowProvider: React.FC<
       value={{
         setCurrentStep,
         currentStep: localCurrentStep,
-        flow,
+        flow: localFlow,
+        setFlow,
       }}
     >
       {children}

diff --git a/client/components/register/flow-start.tsx b/client/components/register/flow-start.tsx
@@ -24,7 +24,7 @@ const registerSchema = yup
   .required();
 
 export default function RegisterFlowStart() {
-  const { setCurrentStep } = useRegisterFlow();
+  const { setCurrentStep, setFlow } = useRegisterFlow();
 
   const { handleSubmit, control, formState, setError } = useForm({
     resolver: yupResolver(registerSchema),
@@ -46,6 +46,7 @@ export default function RegisterFlowStart() {
       });
 
       if (data) {
+        setFlow(data.registerFlow);
         setCurrentStep(data.registerFlow.currentStep);
       }
     } catch (err) {

diff --git a/client/generated/api/v1.d.ts b/client/generated/api/v1.d.ts
@@ -45,7 +45,7 @@ export interface paths {
      */
     get: operations["OpenAPITag.USERS-get_user"];
   };
-  "/auth/register/flows": {
+  "/auth/register/flows/{flow_id}": {
     /**
      * Get a register flow.
      * @description Get a register flow.
@@ -849,8 +849,8 @@ export interface operations {
    */
   "OpenAPITag.AUTHENTICATION-get_register_flow": {
     parameters: {
-      cookie: {
-        register_flow_id: string;
+      path: {
+        flow_id: string;
       };
     };
     responses: {

diff --git a/schema/openapi.json b/schema/openapi.json
diff --git a/server/app/routes/auth.py b/server/app/routes/auth.py
@@ -3,7 +3,7 @@
 from uuid import UUID
 
 import user_agents
-from fastapi import APIRouter, Cookie, Depends, Header, Response
+from fastapi import APIRouter, Cookie, Depends, Header, Path, Response
 from webauthn.helpers import (
     parse_authentication_credential_json,
     parse_registration_credential_json,
@@ -52,7 +52,7 @@
 
 
 @auth_router.get(
-    "/register/flows",
+    "/register/flows/{flow_id}",
     response_model=RegisterFlowSchema,
     responses={
         HTTPStatus.NOT_FOUND: {
@@ -63,9 +63,9 @@
     summary="Get a register flow.",
 )
 async def get_register_flow(
-    register_flow_id: Annotated[
-        str,
-        Cookie(
+    flow_id: Annotated[
+        UUID,
+        Path(
             title="The ID of the register flow.",
         ),
     ],
@@ -77,9 +77,7 @@ async def get_register_flow(
     ],
 ) -> RegisterFlow:
     """Get a register flow."""
-    return await auth_service.get_register_flow(
-        flow_id=UUID(register_flow_id),
-    )
+    return await auth_service.get_register_flow(flow_id=flow_id)
 
 
 @auth_router.post(
@@ -311,6 +309,12 @@ async def finish_webauthn_register_flow(
         credential=parse_registration_credential_json(data.credential),
     )
 
+    # remove register flow ID from cookie
+    response.delete_cookie(
+        key=REGISTER_FLOW_ID_COOKIE,
+        secure=settings.is_production(),
+    )
+
     # set authentication token in a cookie
     response.set_cookie(
         key=AUTHENTICATION_TOKEN_COOKIE,