A naive, but efficient starter to generate crud hooks for React Query

createCrudHooks.js

export default function createCrudHooks({
  baseKey,
  indexFn,
  singleFn,
  createFn,
  updateFn,
  deleteFn,
}) {
  const useIndex = (config) => useQuery([baseKey], indexFn, config)
  const useSingle = (id, config) =>
    useQuery([baseKey, id], () => singleFn(id), config)
  const useCreate = (config = {}) =>
    useMutation(createFn, {
      ...config,
      onSuccess: (...args) => {
        queryCache.invalidateQueries([baseKey])
        if (config.onSuccess) config.onSuccess(...args)
      },
    })
  const useUpdate = (config = {}) =>
    useMutation(updateFn, {
      ...config,
      onSuccess: (...args) => {
        queryCache.invalidateQueries([baseKey])
        if (config.onSuccess) config.onSuccess(...args)
      },
    })
  const useDelete = (config = {}) =>
    useMutation(deleteFn, {
      ...config,
      onSuccess: (...args) => {
        queryCache.invalidateQueries([baseKey])
        if (config.onSuccess) config.onSuccess(...args)
      },
    })
  return [useIndex, useSingle, useCreate, useUpdate, useDelete]
}

example.js

import createCrudHooks from './createCrudHooks'

const [
  useTodos,
  useTodo,
  useCreateTodo,
  useUpdateTodo,
  useDeleteTodo,
] = createCrudHooks({
  baseKey: 'todos',
  indexFn: () => axios.get('/todos'),
  singleFn: (id) => axios.get(`/todos/${id}`),
  createFn: (payload) => axios.post(`/todos`, payload),
  updateFn: (payload) => axios.patch(`/todos/${payload.id}`, payload),
  deleteFn: (id) => axios.delet(`/todos/${id}`),
})