diff --git a/samples/routing/react-router-dom-v5-hash/src/components/Routes.tsx b/samples/routing/react-router-dom-v5-hash/src/components/Routes.tsx index 9ae5d2f2..782764d9 100644 --- a/samples/routing/react-router-dom-v5-hash/src/components/Routes.tsx +++ b/samples/routing/react-router-dom-v5-hash/src/components/Routes.tsx @@ -20,7 +20,7 @@ import NotFound from '../pages/NotFound'; import Home from '../pages/Home'; import Protected from '../pages/Protected'; -const useHashPathForLoginCalback = config.oidc.responseMode === 'fragment'; +const useHashPathForLoginCalback = config.oidc.responseMode === 'fragment' || !config.oidc.pkce; const NotFoundWithLoginCallback = (props: any) => ( @@ -37,7 +37,7 @@ const HomeWithLoginCallback = (props: any) => { }; // NOTE: -// * If using `responseMode: 'fragment'` in OktaAuth config, +// * If using `responseMode: 'fragment'` (or `pkce: false`) in OktaAuth config, // *must* be mounted on '*' with a fallback to 404 component // * If using 'query' response mode, // *must* be mounted on '/' with a fallback to home component diff --git a/samples/routing/react-router-dom-v6-data/src/pages/Profile.tsx b/samples/routing/react-router-dom-v6-data/src/pages/Profile.tsx index 8838f063..8d684fc3 100644 --- a/samples/routing/react-router-dom-v6-data/src/pages/Profile.tsx +++ b/samples/routing/react-router-dom-v6-data/src/pages/Profile.tsx @@ -27,7 +27,7 @@ export const profileLoader: LoaderFunction = () => { // Do NOT return `waitForAuthenticated` promise in `loader` function. // react-router 6 blocks rendering of all route elements until matching loaders are resolved. // This means that component would not be rendered and OktaAuth would not start. - // Without rendering component `waitForAuthenticated` would NOT be resolved! + // Without rendering of component `waitForAuthenticated` would NOT be resolved! return ({ userClaims: waitForAuthenticated(oktaAuth).then(() => oktaAuth.getUser()) }); diff --git a/samples/routing/react-router-dom-v6-hash/index.html b/samples/routing/react-router-dom-v6-hash/index.html index 80be050d..718703dd 100644 --- a/samples/routing/react-router-dom-v6-hash/index.html +++ b/samples/routing/react-router-dom-v6-hash/index.html @@ -4,7 +4,7 @@ - React Router v6 createBrowserRouter Sample + React Router v6 HashRouter Sample
diff --git a/samples/routing/react-router-dom-v6-hash/src/components/Routes.tsx b/samples/routing/react-router-dom-v6-hash/src/components/Routes.tsx index 47a9c1c8..d76f0397 100644 --- a/samples/routing/react-router-dom-v6-hash/src/components/Routes.tsx +++ b/samples/routing/react-router-dom-v6-hash/src/components/Routes.tsx @@ -19,7 +19,7 @@ import Home from '../pages/Home'; import Protected from '../pages/Protected'; import NotFound from '../pages/NotFound'; -const useHashPathForLoginCalback = config.oidc.responseMode === 'fragment'; +const useHashPathForLoginCalback = config.oidc.responseMode === 'fragment' || !config.oidc.pkce; const NotFoundWithLoginCallback = () => ( @@ -36,12 +36,12 @@ const HomeWithLoginCallback = () => { }; // NOTE: -// * If using `responseMode: 'fragment'` in OktaAuth config, +// * If using `responseMode: 'fragment'` (or `pkce: false`) in OktaAuth config, // *must* be mounted on '*' with a fallback to 404 component -// Because signin redirect URL is like +// Because in this case a signin redirect URL is like // 'https:///#id_token=...&access_token=...&token_type=Bearer&expires_in=3600&scope=...&state=...' // and HashRouter in react-router 6 is unable to find any route matching such location -// except for root splat route () +// except for "catch-all" route () // * If using 'query' response mode, // *must* be mounted on '/' with a fallback to home component // Signin redirect URL in this case is 'https:///?code=...&state=...'