interface AsyncState<T> {
                                      data: T | null;
                                      loading: boolean;
                                       error: string | null;
                                  }

    export const useAsyncData = <T>(
    fetchFn: () => Promise<T>
    ): AsyncState<T> => {
    const [state, setState] = useState<AsyncState<T>>({
    data: null,
    loading: true,
    error: null,
    });

   useEffect(() => {
    fetchFn()
      .then(data => setState({ 
        data, 
        loading: false, 
        error: null 
      }))
      .catch(error => setState({ 
        data: null, 
        loading: false, 
        error: error.message 
      }));
    }, []);

    return state;
   };