hook.ts

/* eslint-disable */

import {
  ActionCreator,
  ActionCreatorsMapObject,
  AsyncThunk,
  bindActionCreators
} from '@reduxjs/toolkit'
import { useMemo } from 'react'
import { useDispatch } from 'react-redux'

import { AppDispatch, ThunkConfig } from './types'

export const useAppDispatch = useDispatch<AppDispatch>

type BoundActions<Actions extends ActionCreatorsMapObject> = {
  [key in keyof Actions]: Actions[key] extends AsyncThunk<
    any,
    any,
    ThunkConfig<any>
  >
    ? BoundAsyncThunk<Actions[key]>
    : Actions[key]
}

type BoundAsyncThunk<Action extends ActionCreator<any>> = (
  ...args: Parameters<Action>
) => ReturnType<ReturnType<Action>>

export const useActionCreatorsTyped = <
  Actions extends ActionCreatorsMapObject = ActionCreatorsMapObject
>(
  actions: Actions
): BoundActions<Actions> => {
  const dispatch = useAppDispatch()

  const memoizedActions = useMemo(
    () => bindActionCreators(actions, dispatch),
    [actions, dispatch]
  )

  return memoizedActions
}