Skip to content

Commit 493ddc1

Browse files
desiprisgdesiprisg
authored
fix(clerk-js): Replace the basePath for flowStartPath to work in path routing
* fix(clerk-js): Replace the basePath for flowStartPath to work in path routing fix(clerk-js): Revert changes to invite and confirmation pages * refactor(clerk-js): Simplify flowStartPath logic
1 parent b1f5c80 commit 493ddc1

5 files changed

Lines changed: 17 additions & 10 deletions

File tree

‎packages/clerk-js/src/ui/components/OrganizationProfile/OrganizationProfileRoutes.tsx‎

Lines changed: 8 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -18,7 +18,10 @@ export const OrganizationProfileRoutes = (props: PropsOfComponent<typeof Profile
1818
>
1919
<ProfileSettingsPage />
2020
</Route>
21-
<Route path='leave'>
21+
<Route
22+
path='leave'
23+
flowStart
24+
>
2225
<LeaveOrganizationPage />
2326
</Route>
2427
<Route index>
@@ -28,7 +31,10 @@ export const OrganizationProfileRoutes = (props: PropsOfComponent<typeof Profile
2831
</Route>
2932
<Route>
3033
<Switch>
31-
<Route path='invite-members'>
34+
<Route
35+
path='invite-members'
36+
flowStart
37+
>
3238
<InviteMembersPage />
3339
</Route>
3440
<Route index>

‎packages/clerk-js/src/ui/elements/NavigateToFlowStartButton.tsx‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -7,7 +7,7 @@ type NavigateToFlowStartButtonProps = PropsOfComponent<typeof Button>;
77
export const useNavigateToFlowStart = () => {
88
const router = useRouter();
99
const navigateToFlowStart = async () => {
10-
const to = '/' + router.basePath + router.startPath;
10+
const to = '/' + router.basePath + router.flowStartPath;
1111
if (to !== router.currentPath) {
1212
return router.navigate(to);
1313
}

‎packages/clerk-js/src/ui/router/Route.tsx‎

Lines changed: 4 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,6 @@
1-
import { pathFromFullPath } from '@clerk/shared';
21
import React from 'react';
32

4-
import { trimTrailingSlash } from '../../utils';
3+
import { pathFromFullPath, trimTrailingSlash } from '../../utils';
54
import { newPaths } from './newPaths';
65
import { match } from './pathToRegexp';
76
import { RouteContext, useRouter } from './RouteContext';
@@ -88,7 +87,9 @@ export function Route(props: RouteProps): JSX.Element | null {
8887
}
8988

9089
const flowStartPath = props.flowStart
91-
? pathFromFullPath(fullPath).replace(props.path || '', '') || router.flowStartPath
90+
? //set it as the old full path (the previous step),
91+
//replacing the base path for navigateToFlowStart() to work as expected
92+
pathFromFullPath(router.fullPath).replace('/' + router.basePath, '')
9293
: router.flowStartPath;
9394

9495
return (

‎packages/clerk-js/src/utils/url.ts‎

Lines changed: 4 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -358,3 +358,7 @@ export const mergeFragmentIntoUrl = (_url: string | URL): URL => {
358358

359359
return mergedUrl;
360360
};
361+
362+
export const pathFromFullPath = (fullPath: string) => {
363+
return fullPath.replace(/CLERK-ROUTER\/(.*?)\//, '');
364+
};

‎packages/shared/src/utils/url.ts‎

Lines changed: 0 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -25,7 +25,3 @@ export function addClerkPrefix(str: string | undefined) {
2525
const stripped = str.replace(regex, '');
2626
return `clerk.${stripped}`;
2727
}
28-
29-
export const pathFromFullPath = (fullPath: string) => {
30-
return fullPath.replace(/CLERK-ROUTER\/(.*?)\//, '');
31-
};

0 commit comments

Comments
 (0)