From 28fc8ccd0ee684738e3f672abb5bcafdd14b3a36 Mon Sep 17 00:00:00 2001
From: Prateek Shourya <prateekshourya29@gmail.com>
Date: Wed, 12 Jun 2024 15:42:05 +0530
Subject: [PATCH] [WEB-1565] fix: onboarding steps logic. (#4779)

---
 web/app/onboarding/page.tsx | 27 +++++++++++++++------------
 1 file changed, 15 insertions(+), 12 deletions(-)

diff --git a/web/app/onboarding/page.tsx b/web/app/onboarding/page.tsx
index 88c2df438..91d8749e6 100644
--- a/web/app/onboarding/page.tsx
+++ b/web/app/onboarding/page.tsx
@@ -37,14 +37,14 @@ const OnboardingPage = observer(() => {
   const router = useRouter();
   // store hooks
   const { captureEvent } = useEventTracker();
-  const { data: user, updateCurrentUser } = useUser();
+  const { isLoading: userLoader, data: user, updateCurrentUser } = useUser();
   const { data: profile, updateUserOnBoard, updateUserProfile } = useUserProfile();
   const { workspaces, fetchWorkspaces } = useWorkspace();
 
   // computed values
   const workspacesList = Object.values(workspaces ?? {});
   // fetching workspaces list
-  useSWR(USER_WORKSPACES_LIST, () => fetchWorkspaces(), {
+  const { isLoading: workspaceListLoader } = useSWR(USER_WORKSPACES_LIST, () => fetchWorkspaces(), {
     shouldRetryOnError: false,
   });
   // fetching user workspace invitations
@@ -99,18 +99,21 @@ const OnboardingPage = observer(() => {
   };
 
   useEffect(() => {
-    // If user is already invited to a workspace, only show profile setup steps.
-    if (workspacesList && workspacesList?.length > 0) {
-      // If password is auto set then show two different steps for profile setup, else merge them.
-      if (user?.is_password_autoset) setTotalSteps(2);
-      else setTotalSteps(1);
-    } else {
-      // If password is auto set then total steps will increase to 4 due to extra step at profile setup stage.
-      if (user?.is_password_autoset) setTotalSteps(4);
-      else setTotalSteps(3);
+    // Never update the total steps if it's already set.
+    if (!totalSteps && userLoader === false && workspaceListLoader === false) {
+      // If user is already invited to a workspace, only show profile setup steps.
+      if (workspacesList && workspacesList?.length > 0) {
+        // If password is auto set then show two different steps for profile setup, else merge them.
+        if (user?.is_password_autoset) setTotalSteps(2);
+        else setTotalSteps(1);
+      } else {
+        // If password is auto set then total steps will increase to 4 due to extra step at profile setup stage.
+        if (user?.is_password_autoset) setTotalSteps(4);
+        else setTotalSteps(3);
+      }
     }
     // eslint-disable-next-line react-hooks/exhaustive-deps
-  }, []);
+  }, [userLoader, workspaceListLoader]);
 
   useEffect(() => {
     const handleStepChange = async () => {