diff --git a/apps/app/components/onboarding/invite-members.tsx b/apps/app/components/onboarding/invite-members.tsx
index 0114b2dcd..913607801 100644
--- a/apps/app/components/onboarding/invite-members.tsx
+++ b/apps/app/components/onboarding/invite-members.tsx
@@ -7,7 +7,7 @@ import { ICurrentUserResponse, IUser } from "types";
 import { MultiInput, PrimaryButton, SecondaryButton } from "components/ui";
 
 type Props = {
-  setStep: React.Dispatch<React.SetStateAction<number>>;
+  setStep: React.Dispatch<React.SetStateAction<number | null>>;
   workspace: any;
   user: ICurrentUserResponse | undefined;
 };
diff --git a/apps/app/components/onboarding/user-details.tsx b/apps/app/components/onboarding/user-details.tsx
index 63df0d968..1e96bb143 100644
--- a/apps/app/components/onboarding/user-details.tsx
+++ b/apps/app/components/onboarding/user-details.tsx
@@ -21,7 +21,7 @@ const defaultValues: Partial<IUser> = {
 
 type Props = {
   user?: IUser;
-  setStep: React.Dispatch<React.SetStateAction<number>>;
+  setStep: React.Dispatch<React.SetStateAction<number | null>>;
   setUserRole: React.Dispatch<React.SetStateAction<string | null>>;
 };
 
diff --git a/apps/app/components/onboarding/workspace.tsx b/apps/app/components/onboarding/workspace.tsx
index 783f5f5e5..0beef1419 100644
--- a/apps/app/components/onboarding/workspace.tsx
+++ b/apps/app/components/onboarding/workspace.tsx
@@ -17,7 +17,7 @@ import { PrimaryButton } from "components/ui";
 import { getFirstCharacters, truncateText } from "helpers/string.helper";
 
 type Props = {
-  setStep: React.Dispatch<React.SetStateAction<number>>;
+  setStep: React.Dispatch<React.SetStateAction<number | null>>;
   setWorkspace: React.Dispatch<React.SetStateAction<any>>;
   user: ICurrentUserResponse | undefined;
 };
diff --git a/apps/app/components/workspace/create-workspace-form.tsx b/apps/app/components/workspace/create-workspace-form.tsx
index fdc078cf0..507d88ea7 100644
--- a/apps/app/components/workspace/create-workspace-form.tsx
+++ b/apps/app/components/workspace/create-workspace-form.tsx
@@ -6,6 +6,7 @@ import { mutate } from "swr";
 import { Controller, useForm } from "react-hook-form";
 // services
 import workspaceService from "services/workspace.service";
+import userService from "services/user.service";
 // hooks
 import useToast from "hooks/use-toast";
 // ui
@@ -77,7 +78,7 @@ export const CreateWorkspaceForm: React.FC<Props> = ({
                 message: "Workspace created successfully.",
               });
               mutate<IWorkspace[]>(USER_WORKSPACES, (prevData) => [res, ...(prevData ?? [])]);
-              onSubmit(res);
+              updateLastWorkspaceIdUnderUSer(res);
             })
             .catch((err) => {
               console.error(err);
@@ -93,6 +94,18 @@ export const CreateWorkspaceForm: React.FC<Props> = ({
       });
   };
 
+  // update last_workspace_id
+  const updateLastWorkspaceIdUnderUSer = (workspace: any) => {
+    userService
+      .updateUser({ last_workspace_id: workspace.id })
+      .then((res) => {
+        onSubmit(workspace);
+      })
+      .catch((err) => {
+        console.log(err);
+      });
+  };
+
   useEffect(
     () => () => {
       // when the component unmounts set the default values to whatever user typed in
diff --git a/apps/app/pages/onboarding.tsx b/apps/app/pages/onboarding.tsx
index 59463c248..cc6b742df 100644
--- a/apps/app/pages/onboarding.tsx
+++ b/apps/app/pages/onboarding.tsx
@@ -1,4 +1,4 @@
-import { useState } from "react";
+import { useEffect, useState } from "react";
 // next imports
 import Router from "next/router";
 // services
@@ -24,7 +24,7 @@ import { ONBOARDING_CARDS } from "constants/workspace";
 import type { NextPage } from "next";
 
 const Onboarding: NextPage = () => {
-  const [step, setStep] = useState(1);
+  const [step, setStep] = useState<null | number>(null);
   const [userRole, setUserRole] = useState<string | null>(null);
   const [isLoading, setIsLoading] = useState(false);
 
@@ -32,113 +32,102 @@ const Onboarding: NextPage = () => {
 
   const { user, isLoading: userLoading, mutateUser } = useUserAuth("onboarding");
 
+  useEffect(() => {
+    if (user && step === null) {
+      let currentStep: number = 1;
+      if (user?.role) currentStep = 2;
+      if (user?.last_workspace_id) currentStep = 4;
+      setStep(() => currentStep);
+    }
+  }, [step, user]);
+
   return (
     <DefaultLayout>
-      {userLoading ? (
+      {userLoading || isLoading || step === null ? (
         <div className="grid h-screen place-items-center">
           <Spinner />
         </div>
       ) : (
-        <>
-          {isLoading ? (
-            <div className="grid h-screen place-items-center">
-              <Spinner />
+        <div className="relative grid h-full place-items-center p-5">
+          {step <= 3 ? (
+            <div className="h-full flex flex-col justify-center w-full py-4">
+              <div className="mb-7 flex items-center justify-center text-center">
+                <OnboardingLogo className="h-12 w-48 fill-current text-brand-base" />
+              </div>
+              {step === 1 ? (
+                <UserDetails user={user} setStep={setStep} setUserRole={setUserRole} />
+              ) : step === 2 ? (
+                <Workspace setStep={setStep} setWorkspace={setWorkspace} user={user} />
+              ) : (
+                step === 3 && <InviteMembers setStep={setStep} workspace={workspace} user={user} />
+              )}
             </div>
           ) : (
-            <div className="relative grid h-full place-items-center p-5">
-              {step <= 3 ? (
-                <div className="h-full flex flex-col justify-center w-full py-4">
-                  <div className="mb-7 flex items-center justify-center text-center">
-                    <OnboardingLogo className="h-12 w-48 fill-current text-brand-base" />
-                  </div>
-                  {step === 1 ? (
-                    <UserDetails user={user} setStep={setStep} setUserRole={setUserRole} />
-                  ) : step === 2 ? (
-                    <Workspace setStep={setStep} setWorkspace={setWorkspace} user={user} />
-                  ) : (
-                    step === 3 && (
-                      <InviteMembers setStep={setStep} workspace={workspace} user={user} />
-                    )
-                  )}
-                </div>
-              ) : (
-                <div className="flex w-full max-w-2xl flex-col gap-12">
-                  <div className="flex flex-col items-center justify-center gap-7 rounded-[10px] bg-brand-base pb-7 text-center shadow-md">
-                    {step === 4 ? (
-                      <OnboardingCard data={ONBOARDING_CARDS.welcome} />
-                    ) : step === 5 ? (
-                      <OnboardingCard data={ONBOARDING_CARDS.issue} gradient />
-                    ) : step === 6 ? (
-                      <OnboardingCard data={ONBOARDING_CARDS.cycle} gradient />
-                    ) : step === 7 ? (
-                      <OnboardingCard data={ONBOARDING_CARDS.module} gradient />
-                    ) : (
-                      step === 8 && <OnboardingCard data={ONBOARDING_CARDS.commandMenu} />
-                    )}
-                    <div className="mx-auto flex h-1/4 items-end lg:w-1/2">
-                      <PrimaryButton
-                        type="button"
-                        className="flex w-full items-center justify-center text-center "
-                        size="md"
-                        onClick={() => {
-                          if (step === 8) {
-                            setIsLoading(true);
-                            userService
-                              .updateUserOnBoard({ userRole }, user)
-                              .then(async () => {
-                                mutateUser();
-                                const userWorkspaces = await workspaceService.userWorkspaces();
+            <div className="flex w-full max-w-2xl flex-col gap-12">
+              <div className="flex flex-col items-center justify-center gap-7 rounded-[10px] bg-brand-base pb-7 text-center shadow-md">
+                {step === 4 ? (
+                  <OnboardingCard data={ONBOARDING_CARDS.welcome} />
+                ) : step === 5 ? (
+                  <OnboardingCard data={ONBOARDING_CARDS.issue} gradient />
+                ) : step === 6 ? (
+                  <OnboardingCard data={ONBOARDING_CARDS.cycle} gradient />
+                ) : step === 7 ? (
+                  <OnboardingCard data={ONBOARDING_CARDS.module} gradient />
+                ) : (
+                  step === 8 && <OnboardingCard data={ONBOARDING_CARDS.commandMenu} />
+                )}
+                <div className="mx-auto flex h-1/4 items-end lg:w-1/2">
+                  <PrimaryButton
+                    type="button"
+                    className="flex w-full items-center justify-center text-center "
+                    size="md"
+                    onClick={() => {
+                      if (step === 8) {
+                        setIsLoading(true);
+                        userService
+                          .updateUserOnBoard({ userRole }, user)
+                          .then(async () => {
+                            mutateUser();
+                            const userWorkspaces = await workspaceService.userWorkspaces();
 
-                                const lastActiveWorkspace =
-                                  userWorkspaces.find(
-                                    (workspace) => workspace.id === user?.last_workspace_id
-                                  ) ?? userWorkspaces[0];
+                            const lastActiveWorkspace =
+                              userWorkspaces.find(
+                                (workspace) => workspace.id === user?.last_workspace_id
+                              ) ?? userWorkspaces[0];
 
-                                if (lastActiveWorkspace) {
-                                  userService
-                                    .updateUser({
-                                      last_workspace_id: lastActiveWorkspace.id,
-                                    })
-                                    .then((res) => {
-                                      mutateUser();
-                                    })
-                                    .catch((err) => {
-                                      console.log(err);
-                                    });
-                                  Router.push(`/${lastActiveWorkspace.slug}`);
-                                  return;
-                                } else {
-                                  const invitations =
-                                    await workspaceService.userWorkspaceInvitations();
-                                  if (invitations.length > 0) {
-                                    Router.push(`/invitations`);
-                                    return;
-                                  } else {
-                                    Router.push(`/create-workspace`);
-                                    return;
-                                  }
-                                }
-                              })
-                              .catch((err) => {
-                                setIsLoading(false);
-                                console.log(err);
-                              });
-                          } else setStep((prevData) => prevData + 1);
-                        }}
-                      >
-                        {step === 4 || step === 8 ? "Get Started" : "Next"}
-                      </PrimaryButton>
-                    </div>
-                  </div>
+                            if (lastActiveWorkspace) {
+                              mutateUser();
+                              Router.push(`/${lastActiveWorkspace.slug}`);
+                              return;
+                            } else {
+                              const invitations = await workspaceService.userWorkspaceInvitations();
+                              if (invitations.length > 0) {
+                                Router.push(`/invitations`);
+                                return;
+                              } else {
+                                Router.push(`/create-workspace`);
+                                return;
+                              }
+                            }
+                          })
+                          .catch((err) => {
+                            setIsLoading(false);
+                            console.log(err);
+                          });
+                      } else setStep((prevData) => (prevData != null ? prevData + 1 : prevData));
+                    }}
+                  >
+                    {step === 4 || step === 8 ? "Get Started" : "Next"}
+                  </PrimaryButton>
                 </div>
-              )}
-              <div className="absolute flex flex-col gap-1 justify-center items-start left-5 top-5">
-                <span className="text-xs text-brand-secondary">Logged in:</span>
-                <span className="text-sm text-brand-base">{user?.email}</span>
               </div>
             </div>
           )}
-        </>
+          <div className="absolute flex flex-col gap-1 justify-center items-start left-5 top-5">
+            <span className="text-xs text-brand-secondary">Logged in:</span>
+            <span className="text-sm text-brand-base">{user?.email}</span>
+          </div>
+        </div>
       )}
     </DefaultLayout>
   );