fix: onboarding ready condition and missing deps (#4153)

dailydotdev · Feb 6, 2025 · f8ead14 · f8ead14
1 parent 5c9f827
commit f8ead14
Show file tree

Hide file tree

Showing 2 changed files with 22 additions and 9 deletions.
diff --git a/packages/shared/src/hooks/auth/useOnboarding.tsx b/packages/shared/src/hooks/auth/useOnboarding.tsx
@@ -33,7 +33,7 @@ export const useOnboarding = (): UseOnboarding => {
 
   return {
     shouldShowAuthBanner,
-    isOnboardingReady: isActionsFetched && isAuthReady,
+    isOnboardingReady: isAuthReady && (isActionsFetched || !user),
     hasCompletedEditTags,
     hasCompletedContentTypes,
     completeStep: (action: ActionType) => completeAction(action),

diff --git a/packages/webapp/pages/onboarding.tsx b/packages/webapp/pages/onboarding.tsx
@@ -150,7 +150,6 @@ const seo: NextSeoProps = {
 };
 
 export function OnboardPage(): ReactElement {
-  const params = new URLSearchParams(window.location.search);
   const { isAvailable: canUserInstallPWA } = useInstallPWA();
   const {
     isOnboardingReady,
@@ -225,31 +224,44 @@ export function OnboardPage(): ReactElement {
   ].includes(activeScreen);
 
   useEffect(() => {
-    if (!isPageReady || isLogged.current || !isOnboardingReady) {
+    if (
+      !isPageReady ||
+      isLogged.current ||
+      !isOnboardingReady ||
+      !user?.infoConfirmed
+    ) {
       return;
     }
 
-    if (user?.infoConfirmed && !hasCompletedEditTags) {
+    isLogged.current = true;
+
+    if (!hasCompletedEditTags) {
       setActiveScreen(OnboardingStep.EditTag);
       return;
     }
 
-    if (user?.infoConfirmed && !hasCompletedContentTypes) {
+    if (!hasCompletedContentTypes) {
       setActiveScreen(OnboardingStep.ContentTypes);
       return;
     }
 
-    if (user?.infoConfirmed && activeScreen === OnboardingStep.Intro) {
+    if (activeScreen === OnboardingStep.Intro) {
+      const params = new URLSearchParams(window.location.search);
       const afterAuth = params.get(AFTER_AUTH_PARAM);
       params.delete(AFTER_AUTH_PARAM);
       router.replace(getPathnameWithQuery(afterAuth || webappUrl, params));
-      return;
     }
 
-    isLogged.current = true;
     // @NOTE see https://dailydotdev.atlassian.net/l/cp/dK9h1zoM
     // eslint-disable-next-line react-hooks/exhaustive-deps
-  }, [isPageReady, user, isOnboardingReady]);
+  }, [
+    isPageReady,
+    user,
+    isOnboardingReady,
+    hasCompletedEditTags,
+    hasCompletedContentTypes,
+    activeScreen,
+  ]);
 
   const onClickNext: OnboardingOnClickNext = (options) => {
     logEvent({
@@ -346,6 +358,7 @@ export function OnboardPage(): ReactElement {
         : LogEvent.OnboardingSkip,
     });
 
+    const params = new URLSearchParams(window.location.search);
     const afterAuth = params.get(AFTER_AUTH_PARAM);
     return router.replace({
       pathname: afterAuth || '/',