5509 remove flash on intermediate verify step when sign in with sso (#5526)

- remove flash on /verify
- remove flash on signInUp
- remove useless redirections and hooks
- Remove DefaultHomePage component
- Move redirections to /objects/companies in PageChangeEffect
- add useShowAuthModal hooks and tests
- add usePageChangeEffectNaviteLocation hooks and tests
- fix refresh token expired produces blank screen

packages/twenty-front/src/pages/auth/PasswordReset.tsx

@@ -7,19 +7,20 @@ import styled from '@emotion/styled';
 import { zodResolver } from '@hookform/resolvers/zod';
 import { isNonEmptyString } from '@sniptt/guards';
 import { motion } from 'framer-motion';
+import { useSetRecoilState } from 'recoil';
 import { z } from 'zod';
 
 import { Logo } from '@/auth/components/Logo';
 import { Title } from '@/auth/components/Title';
 import { useAuth } from '@/auth/hooks/useAuth';
 import { useIsLogged } from '@/auth/hooks/useIsLogged';
-import { useNavigateAfterSignInUp } from '@/auth/sign-in-up/hooks/useNavigateAfterSignInUp';
 import { PASSWORD_REGEX } from '@/auth/utils/passwordRegex';
 import { AppPath } from '@/types/AppPath';
 import { SnackBarVariant } from '@/ui/feedback/snack-bar-manager/components/SnackBar';
 import { useSnackBar } from '@/ui/feedback/snack-bar-manager/hooks/useSnackBar';
 import { MainButton } from '@/ui/input/button/components/MainButton';
 import { TextInputV2 } from '@/ui/input/components/TextInputV2';
+import { isDefaultLayoutAuthModalVisibleState } from '@/ui/layout/states/isDefaultLayoutAuthModalVisibleState';
 import { AnimatedEaseIn } from '@/ui/utilities/animation/components/AnimatedEaseIn';
 import {
   useUpdatePasswordViaResetTokenMutation,
@@ -73,6 +74,7 @@ export const PasswordReset = () => {
   const navigate = useNavigate();
 
   const [email, setEmail] = useState('');
+  const [isTokenValid, setIsTokenValid] = useState(false);
 
   const theme = useTheme();
 
@@ -80,6 +82,9 @@ export const PasswordReset = () => {
 
   const isLoggedIn = useIsLogged();
 
+  const setIsDefaultLayoutAuthModalVisibleState = useSetRecoilState(
+    isDefaultLayoutAuthModalVisibleState,
+  );
   const { control, handleSubmit } = useForm<Form>({
     mode: 'onChange',
     defaultValues: {
@@ -89,7 +94,7 @@ export const PasswordReset = () => {
     resolver: zodResolver(validationSchema),
   });
 
-  const { loading: isValidatingToken } = useValidatePasswordResetTokenQuery({
+  useValidatePasswordResetTokenQuery({
     variables: {
       token: passwordResetToken ?? '',
     },
@@ -98,13 +103,11 @@ export const PasswordReset = () => {
       enqueueSnackBar(error?.message ?? 'Token Invalid', {
         variant: SnackBarVariant.Error,
       });
-      if (!isLoggedIn) {
-        navigate(AppPath.SignInUp);
-      } else {
-        navigate(AppPath.Index);
-      }
+      navigate(AppPath.Index);
     },
     onCompleted: (data) => {
+      setIsTokenValid(true);
+      setIsDefaultLayoutAuthModalVisibleState(true);
       if (isNonEmptyString(data?.validatePasswordResetToken?.email)) {
         setEmail(data.validatePasswordResetToken.email);
       }
@@ -116,8 +119,6 @@ export const PasswordReset = () => {
 
   const { signInWithCredentials } = useAuth();
 
-  const { navigateAfterSignInUp } = useNavigateAfterSignInUp();
-
   const onSubmit = async (formData: Form) => {
     try {
       const { data } = await updatePasswordViaToken({
@@ -142,12 +143,7 @@ export const PasswordReset = () => {
         return;
       }
 
-      const {
-        workspace: currentWorkspace,
-        workspaceMember: currentWorkspaceMember,
-      } = await signInWithCredentials(email || '', formData.newPassword);
-
-      navigateAfterSignInUp(currentWorkspace, currentWorkspaceMember);
+      await signInWithCredentials(email || '', formData.newPassword);
     } catch (err) {
       logError(err);
       enqueueSnackBar(
@@ -160,89 +156,90 @@ export const PasswordReset = () => {
   };
 
   return (
-    <StyledMainContainer>
-      <AnimatedEaseIn>
-        <Logo />
-      </AnimatedEaseIn>
-      <Title animate>Reset Password</Title>
-      <StyledContentContainer>
-        {isValidatingToken && (
-          <SkeletonTheme
-            baseColor={theme.background.quaternary}
-            highlightColor={theme.background.secondary}
-          >
-            <Skeleton
-              height={32}
-              count={2}
-              style={{
-                marginBottom: theme.spacing(2),
-              }}
-            />
-          </SkeletonTheme>
-        )}
-        {email && (
-          <StyledForm onSubmit={handleSubmit(onSubmit)}>
-            <StyledFullWidthMotionDiv
-              initial={{ opacity: 0, height: 0 }}
-              animate={{ opacity: 1, height: 'auto' }}
-              transition={{
-                type: 'spring',
-                stiffness: 800,
-                damping: 35,
-              }}
+    isTokenValid && (
+      <StyledMainContainer>
+        <AnimatedEaseIn>
+          <Logo />
+        </AnimatedEaseIn>
+        <Title animate>Reset Password</Title>
+        <StyledContentContainer>
+          {!email ? (
+            <SkeletonTheme
+              baseColor={theme.background.quaternary}
+              highlightColor={theme.background.secondary}
             >
-              <StyledInputContainer>
-                <TextInputV2
-                  autoFocus
-                  value={email}
-                  placeholder="Email"
-                  fullWidth
-                  disabled
-                />
-              </StyledInputContainer>
-            </StyledFullWidthMotionDiv>
-            <StyledFullWidthMotionDiv
-              initial={{ opacity: 0, height: 0 }}
-              animate={{ opacity: 1, height: 'auto' }}
-              transition={{
-                type: 'spring',
-                stiffness: 800,
-                damping: 35,
-              }}
-            >
-              <Controller
-                name="newPassword"
-                control={control}
-                render={({
-                  field: { onChange, onBlur, value },
-                  fieldState: { error },
-                }) => (
-                  <StyledInputContainer>
-                    <TextInputV2
-                      autoFocus
-                      value={value}
-                      type="password"
-                      placeholder="New Password"
-                      onBlur={onBlur}
-                      onChange={onChange}
-                      error={error?.message}
-                      fullWidth
-                    />
-                  </StyledInputContainer>
-                )}
+              <Skeleton
+                height={32}
+                count={2}
+                style={{
+                  marginBottom: theme.spacing(2),
+                }}
               />
-            </StyledFullWidthMotionDiv>
+            </SkeletonTheme>
+          ) : (
+            <StyledForm onSubmit={handleSubmit(onSubmit)}>
+              <StyledFullWidthMotionDiv
+                initial={{ opacity: 0, height: 0 }}
+                animate={{ opacity: 1, height: 'auto' }}
+                transition={{
+                  type: 'spring',
+                  stiffness: 800,
+                  damping: 35,
+                }}
+              >
+                <StyledInputContainer>
+                  <TextInputV2
+                    autoFocus
+                    value={email}
+                    placeholder="Email"
+                    fullWidth
+                    disabled
+                  />
+                </StyledInputContainer>
+              </StyledFullWidthMotionDiv>
+              <StyledFullWidthMotionDiv
+                initial={{ opacity: 0, height: 0 }}
+                animate={{ opacity: 1, height: 'auto' }}
+                transition={{
+                  type: 'spring',
+                  stiffness: 800,
+                  damping: 35,
+                }}
+              >
+                <Controller
+                  name="newPassword"
+                  control={control}
+                  render={({
+                    field: { onChange, onBlur, value },
+                    fieldState: { error },
+                  }) => (
+                    <StyledInputContainer>
+                      <TextInputV2
+                        autoFocus
+                        value={value}
+                        type="password"
+                        placeholder="New Password"
+                        onBlur={onBlur}
+                        onChange={onChange}
+                        error={error?.message}
+                        fullWidth
+                      />
+                    </StyledInputContainer>
+                  )}
+                />
+              </StyledFullWidthMotionDiv>
 
-            <MainButton
-              variant="secondary"
-              title="Change Password"
-              type="submit"
-              fullWidth
-              disabled={isUpdatingPassword}
-            />
-          </StyledForm>
-        )}
-      </StyledContentContainer>
-    </StyledMainContainer>
+              <MainButton
+                variant="secondary"
+                title="Change Password"
+                type="submit"
+                fullWidth
+                disabled={isUpdatingPassword}
+              />
+            </StyledForm>
+          )}
+        </StyledContentContainer>
+      </StyledMainContainer>
+    )
   );
 };