Function useMutation

examples/solid/start-basic-auth/src/hooks/useMutation.ts:3–41

(opts: {
  fn: (variables: TVariables) => Promise<TData>
  onSuccess?: (ctx: { data: TData }) => void | Promise<void>
})

import * as Solid from 'solid-js'

export function useMutation<TVariables, TData, TError = Error>(opts: {
  fn: (variables: TVariables) => Promise<TData>
  onSuccess?: (ctx: { data: TData }) => void | Promise<void>
}) {
  const [submittedAt, setSubmittedAt] = Solid.createSignal<number | undefined>()
  const [variables, setVariables] = Solid.createSignal<TVariables | undefined>()
  const [error, setError] = Solid.createSignal<TError | undefined>()
  const [data, setData] = Solid.createSignal<TData | undefined>()
  const [status, setStatus] = Solid.createSignal<
    'idle' | 'pending' | 'success' | 'error'
  >('idle')

  const mutate = async (variables: TVariables): Promise<TData | undefined> => {
    setStatus('pending')
    setSubmittedAt(Date.now())
    setVariables(variables as any)
    //
    try {
      const data = await opts.fn(variables)
      await opts.onSuccess?.({ data })
      setStatus('success')
      setError(undefined)
      setData(data as any)
      return data
    } catch (err: any) {
      setStatus('error')
      setError(err)
    }
  }

  return {
    status,
    variables,
    submittedAt,
    mutate,
    error,
    data,
  }
}