Added isLoading to quickstart (#10287)

auth0 · Aug 11, 2023 · a27905a · a27905a
1 parent 54f9b52
commit a27905a
Show file tree

Hide file tree

Showing 4 changed files with 13 additions and 4 deletions.
diff --git a/articles/quickstart/native/react-native-expo/files/app.md b/articles/quickstart/native/react-native-expo/files/app.md
@@ -9,7 +9,7 @@ import {Button, Text, View, StyleSheet} from 'react-native';
 import {useAuth0, Auth0Provider} from 'react-native-auth0';
 
 const Home = () => {
-  const {authorize, clearSession, user, error} = useAuth0();
+  const {authorize, clearSession, user, error, isLoading} = useAuth0();
 
   const onLogin = async () => {
     try {
@@ -27,6 +27,10 @@ const Home = () => {
     }
   };
 
+  if (isLoading) {
+    return <View style={styles.container}><Text>Loading</Text></View>;
+  }
+
   const loggedIn = user !== undefined && user !== null;
 
   return (

diff --git a/articles/quickstart/native/react-native-expo/interactive.md b/articles/quickstart/native/react-native-expo/interactive.md
@@ -176,7 +176,7 @@ Still having issues? Check out our [documentation](https://auth0.com/docs) or vi
 :::
 ::::
 
-## Show user profile information {{{ data-action=code data-code="App.js#28:29" }}}
+## Show user profile information {{{ data-action=code data-code="App.js#32:34" }}}
 
 The `useAuth0` hook exposes a `user` object that contains information about the authenticated user. You can use this to access user profile information about the authenticated user that has been decoded from the [ID token](https://auth0.com/docs/secure/tokens/id-tokens).
 

diff --git a/articles/quickstart/native/react-native/files/app.md b/articles/quickstart/native/react-native/files/app.md
@@ -11,7 +11,7 @@ import {Button, Text, View, StyleSheet} from 'react-native';
 import {useAuth0, Auth0Provider} from 'react-native-auth0';
 
 const Home = () => {
-  const {authorize, clearSession, user} = useAuth0();
+  const {authorize, clearSession, user, error, isLoading} = useAuth0();
 
   const onLogin = async () => {
     try {
@@ -29,12 +29,17 @@ const Home = () => {
     }
   };
 
+  if (isLoading) {
+    return <View style={styles.container}><Text>Loading</Text></View>;
+  }
+
   const loggedIn = user !== undefined && user !== null;
 
   return (
     <View style={styles.container}>
       {loggedIn && <Text>You are logged in as {user.name}</Text>}
       {!loggedIn && <Text>You are not logged in</Text>}
+      {error && <Text>{error.message}</Text>}
 
       <Button
         onPress={loggedIn ? onLogout : onLogin}

diff --git a/articles/quickstart/native/react-native/interactive.md b/articles/quickstart/native/react-native/interactive.md
@@ -237,7 +237,7 @@ Still having issues? Check out our [documentation](https://auth0.com/docs) or vi
 :::
 ::::
 
-## Show user profile information {{{ data-action=code data-code="app.js#28:29" }}}
+## Show user profile information {{{ data-action=code data-code="app.js#32:34" }}}
 
 The `useAuth0` hook exposes a `user` object that contains information about the authenticated user. You can use this to access decoded user profile information about the authenticated user from the [ID token](https://auth0.com/docs/secure/tokens/id-tokens).