Various fixes (#11448)

# Scrollbar fix

Fixes https://github.com/twentyhq/twenty/issues/11403

<img width="1512" alt="image"
src="https://github.com/user-attachments/assets/b13fe0f2-8c61-4ea8-9ea1-e61e571a90da"
/>

---------

Co-authored-by: Félix Malfait <felix.malfait@gmail.com>

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

@@ -10,7 +10,6 @@ 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 { TextInputV2 } from '@/ui/input/components/TextInputV2';
-import { isDefaultLayoutAuthModalVisibleState } from '@/ui/layout/states/isDefaultLayoutAuthModalVisibleState';
 import { useTheme } from '@emotion/react';
 import styled from '@emotion/styled';
 import { zodResolver } from '@hookform/resolvers/zod';
@@ -21,7 +20,9 @@ import { useState } from 'react';
 import { Controller, useForm } from 'react-hook-form';
 import Skeleton, { SkeletonTheme } from 'react-loading-skeleton';
 import { useParams } from 'react-router-dom';
-import { useRecoilValue, useSetRecoilState } from 'recoil';
+import { useRecoilValue } from 'recoil';
+import { MainButton } from 'twenty-ui/input';
+import { AnimatedEaseIn } from 'twenty-ui/utilities';
 import { z } from 'zod';
 import {
   useUpdatePasswordViaResetTokenMutation,
@@ -29,8 +30,6 @@ import {
 } from '~/generated/graphql';
 import { useNavigateApp } from '~/hooks/useNavigateApp';
 import { logError } from '~/utils/logError';
-import { AnimatedEaseIn } from 'twenty-ui/utilities';
-import { MainButton } from 'twenty-ui/input';
 
 const validationSchema = z
   .object({
@@ -89,9 +88,6 @@ export const PasswordReset = () => {
 
   const isLoggedIn = useIsLogged();
 
-  const setIsDefaultLayoutAuthModalVisibleState = useSetRecoilState(
-    isDefaultLayoutAuthModalVisibleState,
-  );
   const { control, handleSubmit } = useForm<Form>({
     mode: 'onChange',
     defaultValues: {
@@ -105,7 +101,7 @@ export const PasswordReset = () => {
     variables: {
       token: passwordResetToken ?? '',
     },
-    skip: !passwordResetToken,
+    skip: !passwordResetToken || isTokenValid,
     onError: (error) => {
       enqueueSnackBar(error?.message ?? 'Token Invalid', {
         variant: SnackBarVariant.Error,
@@ -114,7 +110,6 @@ export const PasswordReset = () => {
     },
     onCompleted: (data) => {
       setIsTokenValid(true);
-      setIsDefaultLayoutAuthModalVisibleState(true);
       if (isNonEmptyString(data?.validatePasswordResetToken?.email)) {
         setEmail(data.validatePasswordResetToken.email);
       }

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

@@ -1,100 +1,12 @@
-import { workspacePublicDataState } from '@/auth/states/workspacePublicDataState';
-import { useRecoilValue } from 'recoil';
-
-import { Logo } from '@/auth/components/Logo';
-import { Title } from '@/auth/components/Title';
-import { DEFAULT_WORKSPACE_NAME } from '@/ui/navigation/navigation-drawer/constants/DefaultWorkspaceName';
-import { useMemo } from 'react';
-
-import { useWorkspaceFromInviteHash } from '@/auth/sign-in-up/hooks/useWorkspaceFromInviteHash';
 import styled from '@emotion/styled';
-import { useLingui } from '@lingui/react/macro';
-import { isNonEmptyString } from '@sniptt/guards';
 import { motion } from 'framer-motion';
-import { isDefined } from 'twenty-shared/utils';
-import { Loader } from 'twenty-ui/feedback';
-import { MainButton } from 'twenty-ui/input';
-import { PublicWorkspaceDataOutput } from '~/generated/graphql';
 
 const StyledContentContainer = styled(motion.div)`
+  height: 300px;
   margin-bottom: ${({ theme }) => theme.spacing(8)};
   margin-top: ${({ theme }) => theme.spacing(4)};
 `;
 
-const StyledForm = styled.form`
-  align-items: center;
-  display: flex;
-  flex-direction: column;
-  width: 100%;
-  margin-top: ${({ theme }) => theme.spacing(10)};
-`;
-
-const StandardContent = ({
-  workspacePublicData,
-  signInUpForm,
-  title,
-}: {
-  workspacePublicData: PublicWorkspaceDataOutput | null;
-  signInUpForm: JSX.Element | null;
-  title: string;
-}) => {
-  return (
-    <>
-      <Logo secondaryLogo={workspacePublicData?.logo} />
-      <Title animate={false}>{title}</Title>
-      {signInUpForm}
-    </>
-  );
-};
-
 export const SignInUpLoading = () => {
-  const { t } = useLingui();
-  const workspacePublicData = useRecoilValue(workspacePublicDataState);
-
-  const { workspaceInviteHash, workspace: workspaceFromInviteHash } =
-    useWorkspaceFromInviteHash();
-
-  const title = useMemo(() => {
-    if (isDefined(workspaceInviteHash)) {
-      return `Join ${workspaceFromInviteHash?.displayName ?? ''} team`;
-    }
-    const workspaceName = !isDefined(workspacePublicData?.displayName)
-      ? DEFAULT_WORKSPACE_NAME
-      : !isNonEmptyString(workspacePublicData?.displayName)
-        ? t`Your Workspace`
-        : workspacePublicData?.displayName;
-
-    return t`Welcome to ${workspaceName}`;
-  }, [
-    workspaceFromInviteHash?.displayName,
-    workspaceInviteHash,
-    workspacePublicData?.displayName,
-    t,
-  ]);
-
-  return (
-    <StandardContent
-      workspacePublicData={workspacePublicData}
-      signInUpForm={
-        <>
-          <p style={{ color: 'red', backgroundColor: 'blue' }}>
-            SignInUpLoading
-          </p>
-          <StyledContentContainer>
-            <StyledForm>
-              <MainButton
-                disabled={true}
-                title={t`Continue`}
-                type="submit"
-                variant={'primary'}
-                Icon={() => <Loader />}
-                fullWidth
-              />
-            </StyledForm>
-          </StyledContentContainer>
-        </>
-      }
-      title={title}
-    />
-  );
+  return <StyledContentContainer />;
 };