feat: remember original URL and redirect after login (#18308)
## Summary - Implement a return-to-path mechanism that preserves the user's intended destination across authentication flows (login, magic link, cross-domain redirects) - Uses layered persistence: Jotai atom (in-memory), sessionStorage with TTL (tab-switch resilience), URL query parameter (cross-domain propagation) - Includes path validation to prevent open redirects, automatic cleanup after successful login, and comprehensive test coverage - Replaces the unused `previousUrlState` with a robust `returnToPathState` system ## Test plan - [ ] Visit a deep link (e.g. `/objects/tasks`) while logged out — should redirect to login, then back to `/objects/tasks` after logging in - [ ] Visit an OAuth authorize link while logged out — should redirect to login, then to the authorize page - [ ] Test magic link flow: click sign-in link that opens new tab — should still redirect to original destination - [ ] Test cross-domain: visit `app.twenty.com/objects/tasks` — should preserve path through workspace domain redirect - [ ] Verify auth/onboarding paths are excluded from being saved as return paths - [ ] Verify return-to-path is cleared after successful navigation - [ ] All 215 existing `usePageChangeEffectNavigateLocation` tests pass Made with [Cursor](https://cursor.com)
This commit is contained in:
+32
-6
@@ -52,9 +52,11 @@ jest.mocked(useDefaultHomePagePath).mockReturnValue({
|
||||
});
|
||||
|
||||
jest.mock('@/domain-manager/hooks/useIsCurrentLocationOnAWorkspace');
|
||||
jest.mocked(useIsCurrentLocationOnAWorkspace).mockReturnValue({
|
||||
isOnAWorkspace: true,
|
||||
});
|
||||
const setupMockIsOnAWorkspace = (isOnAWorkspace: boolean) => {
|
||||
jest.mocked(useIsCurrentLocationOnAWorkspace).mockReturnValue({
|
||||
isOnAWorkspace,
|
||||
});
|
||||
};
|
||||
|
||||
jest.mock('react-router-dom');
|
||||
const setupMockUseParams = (objectNamePlural?: string) => {
|
||||
@@ -68,12 +70,14 @@ const setupMockState = (
|
||||
objectNamePlural?: string,
|
||||
verifyEmailRedirectPath?: string,
|
||||
calendarBookingPageId?: string | null,
|
||||
returnToPath?: string,
|
||||
) => {
|
||||
jest
|
||||
.mocked(useAtomStateValue)
|
||||
.mockReturnValueOnce(calendarBookingPageId ?? 'mock-calendar-id')
|
||||
.mockReturnValueOnce([{ namePlural: objectNamePlural ?? '' }])
|
||||
.mockReturnValueOnce(verifyEmailRedirectPath);
|
||||
.mockReturnValueOnce(verifyEmailRedirectPath)
|
||||
.mockReturnValueOnce(returnToPath ?? '');
|
||||
};
|
||||
|
||||
// prettier-ignore
|
||||
@@ -83,9 +87,11 @@ const testCases: {
|
||||
isWorkspaceSuspended: boolean;
|
||||
onboardingStatus: OnboardingStatus | undefined;
|
||||
res: string | undefined;
|
||||
isOnAWorkspace?: boolean;
|
||||
objectNamePluralFromParams?: string;
|
||||
objectNamePluralFromMetadata?: string;
|
||||
verifyEmailRedirectPath?: string;
|
||||
returnToPath?: string;
|
||||
}[] = [
|
||||
{ loc: AppPath.Verify, isLoggedIn: true, isWorkspaceSuspended: false, onboardingStatus: OnboardingStatus.PLAN_REQUIRED, res: AppPath.PlanRequired },
|
||||
{ loc: AppPath.Verify, isLoggedIn: true, isWorkspaceSuspended: true, onboardingStatus: OnboardingStatus.COMPLETED, res: getSettingsPath(SettingsPath.Billing) },
|
||||
@@ -320,6 +326,15 @@ const testCases: {
|
||||
{ loc: AppPath.NotFound, isLoggedIn: true, isWorkspaceSuspended: false, onboardingStatus: OnboardingStatus.INVITE_TEAM, res: AppPath.InviteTeam },
|
||||
{ loc: AppPath.NotFound, isLoggedIn: true, isWorkspaceSuspended: false, onboardingStatus: OnboardingStatus.BOOK_ONBOARDING, res: AppPath.BookCallDecision },
|
||||
{ loc: AppPath.NotFound, isLoggedIn: true, isWorkspaceSuspended: false, onboardingStatus: OnboardingStatus.COMPLETED, res: undefined },
|
||||
|
||||
// returnToPath: should redirect to saved path instead of defaultHomePagePath
|
||||
{ loc: AppPath.Verify, isLoggedIn: true, isWorkspaceSuspended: false, onboardingStatus: OnboardingStatus.COMPLETED, returnToPath: '/authorize?clientId=abc', res: '/authorize?clientId=abc' },
|
||||
{ loc: AppPath.SignInUp, isLoggedIn: true, isWorkspaceSuspended: false, onboardingStatus: OnboardingStatus.COMPLETED, returnToPath: '/objects/tasks', res: '/objects/tasks' },
|
||||
{ loc: AppPath.Index, isLoggedIn: true, isWorkspaceSuspended: false, onboardingStatus: OnboardingStatus.COMPLETED, returnToPath: '/settings/api-keys', res: '/settings/api-keys' },
|
||||
|
||||
// isOnAWorkspace:false — on default domain, don't redirect to returnToPath or defaultHomePagePath from auth pages
|
||||
{ loc: AppPath.Verify, isLoggedIn: true, isWorkspaceSuspended: false, onboardingStatus: OnboardingStatus.COMPLETED, isOnAWorkspace: false, res: undefined },
|
||||
{ loc: AppPath.SignInUp, isLoggedIn: true, isWorkspaceSuspended: false, onboardingStatus: OnboardingStatus.COMPLETED, isOnAWorkspace: false, res: undefined },
|
||||
];
|
||||
|
||||
describe('usePageChangeEffectNavigateLocation', () => {
|
||||
@@ -330,17 +345,25 @@ describe('usePageChangeEffectNavigateLocation', () => {
|
||||
onboardingStatus,
|
||||
isWorkspaceSuspended,
|
||||
isLoggedIn,
|
||||
isOnAWorkspace,
|
||||
objectNamePluralFromParams,
|
||||
objectNamePluralFromMetadata,
|
||||
verifyEmailRedirectPath,
|
||||
returnToPath,
|
||||
res,
|
||||
}) => {
|
||||
setupMockIsMatchingLocation(loc);
|
||||
setupMockOnboardingStatus(onboardingStatus);
|
||||
setupMockIsWorkspaceActivationStatusEqualsTo(isWorkspaceSuspended);
|
||||
setupMockIsLogged(isLoggedIn);
|
||||
setupMockIsOnAWorkspace(isOnAWorkspace ?? true);
|
||||
setupMockUseParams(objectNamePluralFromParams);
|
||||
setupMockState(objectNamePluralFromMetadata, verifyEmailRedirectPath);
|
||||
setupMockState(
|
||||
objectNamePluralFromMetadata,
|
||||
verifyEmailRedirectPath,
|
||||
undefined,
|
||||
returnToPath,
|
||||
);
|
||||
|
||||
expect(usePageChangeEffectNavigateLocation()).toEqual(res);
|
||||
},
|
||||
@@ -355,7 +378,10 @@ describe('usePageChangeEffectNavigateLocation', () => {
|
||||
.length) +
|
||||
['nonExistingObjectInParam', 'existingObjectInParam:false'].length +
|
||||
['caseWithRedirectionToVerifyEmailRedirectPath', 'caseWithout']
|
||||
.length,
|
||||
.length +
|
||||
['returnToPath:verify', 'returnToPath:signInUp', 'returnToPath:index']
|
||||
.length +
|
||||
['notOnWorkspace:verify', 'notOnWorkspace:signInUp'].length,
|
||||
);
|
||||
});
|
||||
});
|
||||
|
||||
@@ -1,5 +1,8 @@
|
||||
import { verifyEmailRedirectPathState } from '@/app/states/verifyEmailRedirectPathState';
|
||||
import { ONBOARDING_PATHS } from '@/auth/constants/OnboardingPaths';
|
||||
import { ONGOING_USER_CREATION_PATHS } from '@/auth/constants/OngoingUserCreationPaths';
|
||||
import { useIsLogged } from '@/auth/hooks/useIsLogged';
|
||||
import { returnToPathState } from '@/auth/states/returnToPathState';
|
||||
import { calendarBookingPageIdState } from '@/client-config/states/calendarBookingPageIdState';
|
||||
import { useIsCurrentLocationOnAWorkspace } from '@/domain-manager/hooks/useIsCurrentLocationOnAWorkspace';
|
||||
import { useDefaultHomePagePath } from '@/navigation/hooks/useDefaultHomePagePath';
|
||||
@@ -7,6 +10,8 @@ import { objectMetadataItemsState } from '@/object-metadata/states/objectMetadat
|
||||
import { useOnboardingStatus } from '@/onboarding/hooks/useOnboardingStatus';
|
||||
import { useAtomStateValue } from '@/ui/utilities/state/jotai/hooks/useAtomStateValue';
|
||||
import { useIsWorkspaceActivationStatusEqualsTo } from '@/workspace/hooks/useIsWorkspaceActivationStatusEqualsTo';
|
||||
import { isValidReturnToPath } from '@/auth/utils/isValidReturnToPath';
|
||||
import { isNonEmptyString } from '@sniptt/guards';
|
||||
import { useLocation, useParams } from 'react-router-dom';
|
||||
import { AppPath, SettingsPath } from 'twenty-shared/types';
|
||||
import { isDefined } from 'twenty-shared/utils';
|
||||
@@ -14,6 +19,12 @@ import { WorkspaceActivationStatus } from 'twenty-shared/workspace';
|
||||
import { OnboardingStatus } from '~/generated-metadata/graphql';
|
||||
import { isMatchingLocation } from '~/utils/isMatchingLocation';
|
||||
|
||||
const readReturnToPathFromUrlSearchParams = (): string | null => {
|
||||
const value = new URLSearchParams(window.location.search).get('returnToPath');
|
||||
|
||||
return value && isValidReturnToPath(value) ? value : null;
|
||||
};
|
||||
|
||||
export const usePageChangeEffectNavigateLocation = () => {
|
||||
const isLoggedIn = useIsLogged();
|
||||
const { isOnAWorkspace } = useIsCurrentLocationOnAWorkspace();
|
||||
@@ -27,22 +38,6 @@ export const usePageChangeEffectNavigateLocation = () => {
|
||||
|
||||
const someMatchingLocationOf = (appPaths: AppPath[]): boolean =>
|
||||
appPaths.some((appPath) => isMatchingLocation(location, appPath));
|
||||
const onGoingUserCreationPaths = [
|
||||
AppPath.Invite,
|
||||
AppPath.SignInUp,
|
||||
AppPath.VerifyEmail,
|
||||
AppPath.Verify,
|
||||
];
|
||||
const onboardingPaths = [
|
||||
AppPath.CreateWorkspace,
|
||||
AppPath.CreateProfile,
|
||||
AppPath.SyncEmails,
|
||||
AppPath.InviteTeam,
|
||||
AppPath.PlanRequired,
|
||||
AppPath.PlanRequiredSuccess,
|
||||
AppPath.BookCallDecision,
|
||||
AppPath.BookCall,
|
||||
];
|
||||
|
||||
const objectNamePlural = useParams().objectNamePlural ?? '';
|
||||
const objectMetadataItems = useAtomStateValue(objectMetadataItemsState);
|
||||
@@ -53,10 +48,15 @@ export const usePageChangeEffectNavigateLocation = () => {
|
||||
verifyEmailRedirectPathState,
|
||||
);
|
||||
|
||||
const returnToPath = useAtomStateValue(returnToPathState);
|
||||
const resolvedReturnToPath = isNonEmptyString(returnToPath)
|
||||
? returnToPath
|
||||
: readReturnToPathFromUrlSearchParams();
|
||||
|
||||
if (
|
||||
(!isLoggedIn || (isLoggedIn && !isOnAWorkspace)) &&
|
||||
!someMatchingLocationOf([
|
||||
...onGoingUserCreationPaths,
|
||||
...ONGOING_USER_CREATION_PATHS,
|
||||
AppPath.ResetPassword,
|
||||
])
|
||||
) {
|
||||
@@ -135,15 +135,19 @@ export const usePageChangeEffectNavigateLocation = () => {
|
||||
|
||||
if (
|
||||
onboardingStatus === OnboardingStatus.COMPLETED &&
|
||||
someMatchingLocationOf([...onboardingPaths, ...onGoingUserCreationPaths]) &&
|
||||
someMatchingLocationOf([
|
||||
...ONBOARDING_PATHS,
|
||||
...ONGOING_USER_CREATION_PATHS,
|
||||
]) &&
|
||||
!isMatchingLocation(location, AppPath.ResetPassword) &&
|
||||
isLoggedIn
|
||||
isLoggedIn &&
|
||||
isOnAWorkspace
|
||||
) {
|
||||
return defaultHomePagePath;
|
||||
return resolvedReturnToPath ?? defaultHomePagePath;
|
||||
}
|
||||
|
||||
if (isMatchingLocation(location, AppPath.Index) && isLoggedIn) {
|
||||
return defaultHomePagePath;
|
||||
return resolvedReturnToPath ?? defaultHomePagePath;
|
||||
}
|
||||
|
||||
if (
|
||||
|
||||
Reference in New Issue
Block a user