title: Invalid hook call React
body: <p><a href="https://reactjs.org/docs/hooks-custom.html" rel="nofollow noreferrer">https://reactjs.org/docs/hooks-custom.html</a>
  <em>Building your own Hooks lets you extract component logic into reusable functions.</em>
  Thats what I want to do: extract my component logic into reusable functions for other components.</p>
  <p>My functional component:</p>
  <pre><code>//React
  import React from 'react';
  import { FlatList, View, Text, StyleSheet } from 'react-native';
  //Local
  import UserPreview from './UserPreview';
  import defaultContainer from '../../shared/styles/defaultContainer';
  import useFetchUsers from './../../../handler/useFetchUsers';
  
  export default function UserList(props) {
      const { users } = props;
      const dispatch = useDispatch();
      //State
      const [isLoading, setIsLoading] = React.useState(false);
      const [error, setError] = React.useState(null);
  
      return (
          &lt;View style={defaultContainer}&gt;
              &lt;FlatList
                  data={users}
                  keyExtractor={(item) =&gt; item.id}
                  renderItem={({ item }) =&gt; &lt;UserPreview user={item} /&gt;}
                  ListEmptyComponent={() =&gt; &lt;Text style={styles.listEmpty}&gt;Keine Benutzer gefunden!&lt;/Text&gt;}
                  ItemSeparatorComponent={() =&gt; &lt;View style={styles.listSeperator} /&gt;}
                  onRefresh={useFetchUsers}
                  refreshing={isLoading}
                  contentContainerStyle={styles.container}
              /&gt;
          &lt;/View&gt;
      );
  }
  </code></pre>
  <p>my reusable function:</p>
  <pre><code>import React from 'react';
  import * as userActions from '../store/actions/user';
  import { useDispatch } from 'react-redux';
  
  export default async function useFetchUsers() {
      const [error, setError] = React.useState(null);
      const dispatch = useDispatch();
      const [isLoading, setIsLoading] = React.useState(false);
  
      console.log('StartupScreen: User laden');
      setIsLoading(true);
      setError(null);
      try {
          await dispatch(userActions.fetchUsers());
          console.log('StartupScreen: User erfolgreich geladen');
      } catch (err) {
          setError(err.message);
      }
      setIsLoading(false);
  }
  </code></pre>
  <p>How should I use my function in the onRefresh prop in my Userlist?
  I'm getting this error: Invalid hook call
  <a href="https://i.stack.imgur.com/hAHLh.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/hAHLh.png" alt="enter image description here" /></a></p>