useFetchAll.ts

import { Collection, IModelConstructor, View } from 'datx';
import { IJsonapiModel, IJsonapiView, IRequestOptions, jsonapi } from 'datx-jsonapi';
import { useEffect, useMemo, useState } from 'react';

const JsonapiView = jsonapi(View);

export const useFetchAll = <T extends IJsonapiModel>(
  collection: Collection,
  model: IModelConstructor<T>,
  options?: IRequestOptions,
): {
  view?: View<T> & IJsonapiView;
  error?: any;
  isLoading: boolean;
  startedAt?: Date;
  finishedAt?: Date;
} => {
  const [state, setState] = useState<{
    error?: any;
    view?: View<T> & IJsonapiView;
    startedAt?: Date;
    finishedAt?: Date;
  }>({});

  if (!state.view) {
    const view = new JsonapiView(model, collection) as View<T> & IJsonapiView;
    setState((oldState) => ({ ...oldState, view }));
  }

  const load = () => {
    if (state.view && !state.startedAt) {
      setState((oldState) => ({ ...oldState, startedAt: new Date() }));
      state.view.fetchAll(options).then((response) => {
        setState((oldState) => ({
          ...oldState,
          error: response.error,
          finishedAt: new Date(),
        }));
      });
    }
  };

  useEffect(load, []);

  return useMemo(() => ({
    ...state,
    isLoading: Boolean(state.startedAt) && !Boolean(state.finishedAt),
  }), [state]);
};