refactor(auth): simplify continueWithEmail and remove useCallback (#10068)

Refactored continueWithEmail to remove unnecessary dependencies and
simplified the useIsMatchingLocation hook by eliminating useCallback.
This reduces complexity and addresses potential infinite loop issues.
This commit is contained in:
Antoine Moreaux
2025-02-07 10:50:23 +01:00
committed by GitHub
parent aaea49d5f5
commit e081d8ab5e
2 changed files with 14 additions and 34 deletions

View File

@ -3,36 +3,26 @@ import { matchPath, useLocation } from 'react-router-dom';
import { AppBasePath } from '@/types/AppBasePath'; import { AppBasePath } from '@/types/AppBasePath';
import { isNonEmptyString } from '@sniptt/guards'; import { isNonEmptyString } from '@sniptt/guards';
import { isDefined } from 'twenty-shared'; import { isDefined } from 'twenty-shared';
import { useCallback } from 'react';
export const useIsMatchingLocation = () => { export const useIsMatchingLocation = () => {
const location = useLocation(); const location = useLocation();
// Infinite loop issue caused by `checkUserExistsQuery` in `useSignInUp`. const addTrailingSlash = (path: string) =>
// Without executing this query, there is no infinite loop. path.endsWith('/') ? path : path + '/';
// I also noticed that in `isMatchingLocation` inside `continueWithEmail`, no loop occurs.
// Both functions are called within the `useEffect` of `SignInUpWorkspaceScopeFormEffect`.
// This led me to conclude that the issue comes from `useIsMatchingLocation`.
// Using `useCallback` prevent the loop.
const isMatchingLocation = useCallback(
(path: string, basePath?: AppBasePath) => {
const addTrailingSlash = (path: string) =>
path.endsWith('/') ? path : path + '/';
const getConstructedPath = (path: string, basePath?: AppBasePath) => { const getConstructedPath = (path: string, basePath?: AppBasePath) => {
if (!isNonEmptyString(basePath)) return path; if (!isNonEmptyString(basePath)) return path;
return addTrailingSlash(basePath) + path; return addTrailingSlash(basePath) + path;
}; };
const match = matchPath( const isMatchingLocation = (path: string, basePath?: AppBasePath) => {
getConstructedPath(path, basePath), const match = matchPath(
location.pathname, getConstructedPath(path, basePath),
); location.pathname,
return isDefined(match); );
}, return isDefined(match);
[location.pathname], };
);
return { return {
isMatchingLocation, isMatchingLocation,

View File

@ -45,17 +45,7 @@ export const useSignInUp = (form: UseFormReturn<Form>) => {
const continueWithEmail = useCallback(() => { const continueWithEmail = useCallback(() => {
requestFreshCaptchaToken(); requestFreshCaptchaToken();
setSignInUpStep(SignInUpStep.Email); setSignInUpStep(SignInUpStep.Email);
setSignInUpMode( }, [requestFreshCaptchaToken, setSignInUpStep]);
isMatchingLocation(AppPath.SignInUp)
? SignInUpMode.SignIn
: SignInUpMode.SignUp,
);
}, [
isMatchingLocation,
requestFreshCaptchaToken,
setSignInUpMode,
setSignInUpStep,
]);
const continueWithCredentials = useCallback(async () => { const continueWithCredentials = useCallback(async () => {
const token = await readCaptchaToken(); const token = await readCaptchaToken();