From de00454499941884a7fe45ec24423911511d4fba Mon Sep 17 00:00:00 2001 From: asvarcas Date: Mon, 5 Oct 2020 20:36:45 -0300 Subject: [PATCH 1/5] Fix useAuthState docs --- docs/Authentication.md | 2 +- packages/ra-core/src/auth/useAuthState.ts | 28 +++++++++++++++-------- 2 files changed, 19 insertions(+), 11 deletions(-) diff --git a/docs/Authentication.md b/docs/Authentication.md index 7ce29316636..530f72e0ac0 100644 --- a/docs/Authentication.md +++ b/docs/Authentication.md @@ -398,7 +398,7 @@ To avoid rendering a component and force waiting for the `authProvider` response - `loading`: `true` just after mount, while the `authProvider` is being called. `false` once the `authProvider` has answered. - `loaded`: the opposite of `loading`. -- `authenticated`: `undefined` while loading. then `true` or `false` depending on the `authProvider` response. +- `authenticated`: `true` while loading. then `true` or `false` depending on the `authProvider` response. You can render different content depending on the authenticated status. diff --git a/packages/ra-core/src/auth/useAuthState.ts b/packages/ra-core/src/auth/useAuthState.ts index c54fe1b7d77..1ce5d8cc8d3 100644 --- a/packages/ra-core/src/auth/useAuthState.ts +++ b/packages/ra-core/src/auth/useAuthState.ts @@ -12,20 +12,28 @@ interface State { const emptyParams = {}; /** - * Hook for getting the authentication status and restricting access to authenticated users + * To avoid rendering a component and force waiting for the authProvider response, use the useAuthState() hook + * instead of the useAuthenticated() hook. + * It returns an object with 3 properties: * - * Calls the authProvider.checkAuth() method asynchronously. - * If the authProvider returns a rejected promise, logs the user out. + * - loading: true just after mount, while the authProvider is being called. false once the authProvider has answered. + * - loaded: the opposite of loading. + * - authenticated: true while loading. then true or false depending on the authProvider response. * - * The return value updates according to the authProvider request state: + * You can render different content depending on the authenticated status. * - * - start: { authenticated: false, loading: true, loaded: false } - * - success: { authenticated: true, loading: false, loaded: true } - * - error: { authenticated: false, loading: false, loaded: true } + * import { useAuthState, Loading } from 'react-admin'; * - * Useful in custom page components that can work both for connected and - * anonymous users. For pages that can only work for connected users, - * prefer the useAuthenticated() hook. + * const MyPage = () => { + * const { loading, authenticated } = useAuthState(); + * if (loading) { + * return ; + * } + * if (authenticated) { + * return ; + * } + * return ; + * }; * * @see useAuthenticated() * From 02129a06b7bf712d1bbaac773aa6ff620e4ef4b2 Mon Sep 17 00:00:00 2001 From: asvarcas Date: Mon, 5 Oct 2020 20:39:37 -0300 Subject: [PATCH 2/5] Fix JDoc example --- packages/ra-core/src/auth/useAuthState.ts | 28 ++++++----------------- 1 file changed, 7 insertions(+), 21 deletions(-) diff --git a/packages/ra-core/src/auth/useAuthState.ts b/packages/ra-core/src/auth/useAuthState.ts index 1ce5d8cc8d3..8a252b4343a 100644 --- a/packages/ra-core/src/auth/useAuthState.ts +++ b/packages/ra-core/src/auth/useAuthState.ts @@ -22,6 +22,13 @@ const emptyParams = {}; * * You can render different content depending on the authenticated status. * + * @see useAuthenticated() + * + * @param {Object} params Any params you want to pass to the authProvider + * + * @returns The current auth check state. Destructure as { authenticated, error, loading, loaded }. + * + * @example * import { useAuthState, Loading } from 'react-admin'; * * const MyPage = () => { @@ -34,27 +41,6 @@ const emptyParams = {}; * } * return ; * }; - * - * @see useAuthenticated() - * - * @param {Object} params Any params you want to pass to the authProvider - * - * @returns The current auth check state. Destructure as { authenticated, error, loading, loaded }. - * - * @example - * import { useAuthState } from 'react-admin'; - * - * const CustomRoutes = [ - * { - * const { authenticated } = useAuthState({ myContext: 'foobar' }); - * return authenticated ? : ; - * }} />, - * ]; - * const App = () => ( - * - * ... - * - * ); */ const useAuthState = (params: any = emptyParams): State => { const [state, setState] = useSafeSetState({ From 932e94e2121b6d9571150fcc725c6cdb67fc64ad Mon Sep 17 00:00:00 2001 From: asvarcas Date: Tue, 6 Oct 2020 08:51:27 -0300 Subject: [PATCH 3/5] Aplied review --- packages/ra-core/src/auth/useAuthState.ts | 11 ++++++++--- 1 file changed, 8 insertions(+), 3 deletions(-) diff --git a/packages/ra-core/src/auth/useAuthState.ts b/packages/ra-core/src/auth/useAuthState.ts index 8a252b4343a..5d41dc9c280 100644 --- a/packages/ra-core/src/auth/useAuthState.ts +++ b/packages/ra-core/src/auth/useAuthState.ts @@ -12,14 +12,19 @@ interface State { const emptyParams = {}; /** - * To avoid rendering a component and force waiting for the authProvider response, use the useAuthState() hook - * instead of the useAuthenticated() hook. - * It returns an object with 3 properties: + * Hook for getting authentication status + * + * Calls the authProvider.checkAuth() method asynchronously. + * + * The return value updates according to the authProvider request state: * * - loading: true just after mount, while the authProvider is being called. false once the authProvider has answered. * - loaded: the opposite of loading. * - authenticated: true while loading. then true or false depending on the authProvider response. * + * To avoid rendering a component and force waiting for the authProvider response, use the useAuthState() hook + * instead of the useAuthenticated() hook. + * * You can render different content depending on the authenticated status. * * @see useAuthenticated() From e82b9af2300d848fdd7532d6b91ba2c0015036cf Mon Sep 17 00:00:00 2001 From: asvarcas Date: Tue, 6 Oct 2020 08:52:03 -0300 Subject: [PATCH 4/5] Fix Typo --- packages/ra-core/src/auth/useCheckAuth.ts | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/ra-core/src/auth/useCheckAuth.ts b/packages/ra-core/src/auth/useCheckAuth.ts index ab7ffcc98e2..8ca1717b118 100644 --- a/packages/ra-core/src/auth/useCheckAuth.ts +++ b/packages/ra-core/src/auth/useCheckAuth.ts @@ -10,7 +10,7 @@ import useNotify from '../sideEffect/useNotify'; * and throws an error. * * This is a low level hook. See those more specialized hooks - * for common authentication tasks, based on useAuthCheck. + * for common authentication tasks, based on useCheckAuth. * * @see useAuthenticated * @see useAuthState From d74b6dd5f04636d6571ea3001836b973a03644f7 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?An=C3=ADbal=20Svarcas?= Date: Tue, 6 Oct 2020 09:51:43 -0300 Subject: [PATCH 5/5] Update packages/ra-core/src/auth/useAuthState.ts Co-authored-by: Gildas Garcia <1122076+djhi@users.noreply.github.com> --- packages/ra-core/src/auth/useAuthState.ts | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/ra-core/src/auth/useAuthState.ts b/packages/ra-core/src/auth/useAuthState.ts index 5d41dc9c280..6e25e272a2e 100644 --- a/packages/ra-core/src/auth/useAuthState.ts +++ b/packages/ra-core/src/auth/useAuthState.ts @@ -12,7 +12,7 @@ interface State { const emptyParams = {}; /** - * Hook for getting authentication status + * Hook for getting the authentication status * * Calls the authProvider.checkAuth() method asynchronously. *