title: How to await an auth object with hooks? (MongoDB Stitch in React Native)
body: <p>I am using React Native to build an app that relies on MongoDB Stitch for authentication. More often than not, the app crashes because the <strong>client</strong> object has not yet loaded when I use it in the following line of code. The error I get is the infamous <em>TypeError: undefined is not an object</em> followed by <em>evaluating 'client.auth.user'</em>.</p>
  
  <pre><code>import React from 'react';
  import { View, Text } from 'react-native';
  import { Stitch } from 'mongodb-stitch-react-native-sdk';
  
  const APP_ID = '&lt;my app ID&gt;';
  
  const client = Stitch.hasAppClient(APP_ID)
      ? Stitch.getAppClient(APP_ID)
      : Stitch.initializeDefaultAppClient(APP_ID);
  
  const { user } = client.auth;
  
  const Home = () =&gt; {
      return (
          &lt;View style={styles.home}&gt;
              &lt;Text&gt;HOME&lt;/Text&gt;
              &lt;Text&gt;Hi {user.profile.data.email}&lt;/Text&gt;
          &lt;/View&gt;
      );
  };
  
  export default Home;
  
  const styles = {
      home: {
          flex: 1,
          backgroundColor: '#fff',
          alignItems: 'center',
          justifyContent: 'center'
      }
  };
  </code></pre>
  
  <p>The example provided with the MongoDB Stitch NPM package uses <em>componentDidMount</em> (see <a href="https://www.npmjs.com/package/mongodb-stitch-react-native-sdk#getting-started" rel="nofollow noreferrer">here</a>), but I am trying to make this work using Hooks. I have tried <em>useEffect</em>, a bunch of <em>if</em> statements, <em>async/await</em>, placing the object in state with <em>useState</em>; No luck.</p>