Function useServerAction

packages/react/src/hooks/server-action.ts:104–180

(
  action: ActionableClient<TInput, TOutput, TError>,
  options: UseServerActionOptions<TInput, TOutput, UnactionableError<TError>> = {},
)

 * @see {@link https://orpc.dev/docs/server-action#useserveraction-hook Server Action Hook Docs}
 */
export function useServerAction<TInput, TOutput, TError extends ORPCErrorJSON<any, any>>(
  action: ActionableClient<TInput, TOutput, TError>,
  options: UseServerActionOptions<TInput, TOutput, UnactionableError<TError>> = {},
): UseServerActionResult<TInput, TOutput, UnactionableError<TError>> {
  const [state, setState] = useState<Omit<
    | UseServerActionIdleResult<TInput, TOutput, UnactionableError<TError>>
    | UseServerActionSuccessResult<TInput, TOutput, UnactionableError<TError>>
    | UseServerActionErrorResult<TInput, TOutput, UnactionableError<TError>>,
    keyof UseServerActionResultBase<TInput, TOutput, UnactionableError<TError>> | 'executedAt' | 'input'
  >>(INITIAL_STATE)

  const executedAtRef = useRef<Date | undefined>(undefined)
  const [input, setInput] = useState<TInput | undefined>(undefined)
  const [isPending, startTransition] = useTransition()

  const reset = useCallback(() => {
    executedAtRef.current = undefined
    setInput(undefined)
    setState({ ...INITIAL_STATE })
  }, [])

  const execute = useCallback(async (input: TInput, executeOptions: UseServerActionExecuteOptions<TInput, TOutput, UnactionableError<TError>> = {}) => {
    const executedAt = new Date()
    executedAtRef.current = executedAt

    setInput(input)

    return new Promise((resolve) => {
      startTransition(async () => {
        const result = await safe(intercept(
          [...toArray(options.interceptors), ...toArray(executeOptions.interceptors)],
          { input: input as TInput },
          async ({ input }) => action(input).then(([error, data]) => {
            if (error) {
              throw createORPCErrorFromJson(error)
            }

            return data as TOutput
          }),
        ))

        /**
         * If multiple execute calls are made in parallel, only the last one will be effective.
         */
        if (executedAtRef.current === executedAt) {
          setState({
            data: result.data,
            error: result.error as any,
            isIdle: false,
            isPending: false,
            isSuccess: !result.error,
            isError: !!result.error,
            status: !result.error ? 'success' : 'error',
          })
        }

        resolve(result)
      })