Fetcher + SWR + Spinner + Error View

interface SWRProps {
  api: keyInterface;
  children?: Function | null;
  options?: any;
  showRetry?: boolean;
}

export const Fetcher: React.FC<SWRProps> = ({
  api,
  children,
  options,
  showRetry = true,
}) => {
  const { data, error, mutate } = useSWR(api, options);

  if (api !== null && !data) return <Spinner />;
  if (error)
    return (
      <ErrorView
        onRetry={() => mutate(api)}
        showRetry={showRetry}
        title={error!.message}
      />
    );
  return children ? (children as Function)(data) : null;
};

E.g.

<Fetcher api={'/api/user'}>
  {(user) => (
    <Component user={user} />
  )}
</Fetcher>

const useUser = (userID: number) => useSWR('/api/user/${userID}', { revalidateOnMount: false })