import { Case } from '@chipp972/react-case-when';
import React from 'react';
import { useReduxAjax } from '../redux-ajax.hook';

type WrapperProps = {
  children: React.ReactNode;
};

export const getRequestSuccessComponent =
  (requestId: string): React.FC<WrapperProps> =>
  ({ children }) => {
    const { isRequestSuccessful } = useReduxAjax(requestId);
    return <Case when={isRequestSuccessful}>{children}</Case>;
  };

export const getRequestPendingComponent =
  (requestId: string): React.FC<WrapperProps> =>
  ({ children }) => {
    const { isRequestPending } = useReduxAjax(requestId);
    return <Case when={isRequestPending}>{children}</Case>;
  };

export const getRequestFailureComponent =
  (requestId: string): React.FC<WrapperProps> =>
  ({ children }) => {
    const { isRequestFailed } = useReduxAjax(requestId);
    return <Case when={isRequestFailed}>{children}</Case>;
  };