UNPKG

next-safe-action

Version:

Type safe and validated Server Actions in your Next.js project.

1 lines 3.56 kB
{"version":3,"file":"stateful-hooks.mjs","names":[],"sources":["../src/stateful-hooks.ts"],"sourcesContent":["\"use client\";\n\nimport * as React from \"react\";\nimport { getActionShorthandStatusObject, getActionStatus, useActionCallbacks } from \"./hooks-utils\";\nimport type { HookCallbacks, HookSafeStateActionFn, UseStateActionHookReturn } from \"./hooks.types\";\nimport type { InferInputOrDefault, StandardSchemaV1 } from \"./standard-schema\";\n\n/**\n * Use the stateful action from a Client Component via hook. Used for actions defined with [`stateAction`](https://next-safe-action.dev/docs/define-actions/instance-methods#action--stateaction).\n * @param safeActionFn The action function\n * @param utils Optional `initResult`, `permalink` and callbacks\n * @deprecated Directly use `useActionState` hook from `react` instead.\n *\n * {@link https://next-safe-action.dev/docs/execute-actions/hooks/usestateaction See docs for more information}\n */\nexport const useStateAction = <ServerError, S extends StandardSchemaV1 | undefined, CVE, Data>(\n\tsafeActionFn: HookSafeStateActionFn<ServerError, S, CVE, Data>,\n\tutils?: {\n\t\tinitResult?: Awaited<ReturnType<typeof safeActionFn>>;\n\t\tpermalink?: string;\n\t} & HookCallbacks<ServerError, S, CVE, Data>\n): UseStateActionHookReturn<ServerError, S, CVE, Data> => {\n\tconst [result, dispatcher, isExecuting] = React.useActionState(\n\t\tsafeActionFn,\n\t\tutils?.initResult ?? {},\n\t\tutils?.permalink\n\t);\n\tconst [isIdle, setIsIdle] = React.useState(true);\n\tconst [isTransitioning, startTransition] = React.useTransition();\n\tconst [clientInput, setClientInput] = React.useState<InferInputOrDefault<S, void>>();\n\tconst status = getActionStatus<ServerError, S, CVE, Data>({\n\t\tisExecuting,\n\t\tisTransitioning,\n\t\tresult: result ?? {},\n\t\tisIdle,\n\t\t// HACK: This is a workaround to avoid the status being \"hasNavigated\" when the action is executed.\n\t\thasNavigated: false,\n\t\thasThrownError: false,\n\t});\n\n\tconst execute = React.useCallback(\n\t\t(input: InferInputOrDefault<S, void>) => {\n\t\t\tsetTimeout(() => {\n\t\t\t\tsetIsIdle(false);\n\t\t\t\tsetClientInput(input);\n\t\t\t}, 0);\n\n\t\t\tstartTransition(() => {\n\t\t\t\tdispatcher(input as InferInputOrDefault<S, undefined>);\n\t\t\t});\n\t\t},\n\t\t[dispatcher]\n\t);\n\n\tuseActionCallbacks({\n\t\tresult: result ?? {},\n\t\tinput: clientInput as InferInputOrDefault<S, undefined>,\n\t\tstatus,\n\t\tcb: {\n\t\t\tonExecute: utils?.onExecute,\n\t\t\tonSuccess: utils?.onSuccess,\n\t\t\tonError: utils?.onError,\n\t\t\tonSettled: utils?.onSettled,\n\t\t},\n\t\tnavigationError: null,\n\t\tthrownError: null,\n\t});\n\n\treturn {\n\t\texecute,\n\t\tinput: clientInput as InferInputOrDefault<S, undefined>,\n\t\tresult,\n\t\tstatus,\n\t\t...getActionShorthandStatusObject(status),\n\t};\n};\n"],"mappings":";;;;;;;;;;;;;;;AAeA,MAAa,kBACZ,cACA,UAIyD;CACzD,MAAM,CAAC,QAAQ,YAAY,eAAe,MAAM,eAC/C,cACA,OAAO,cAAc,EAAE,EACvB,OAAO,UACP;CACD,MAAM,CAAC,QAAQ,aAAa,MAAM,SAAS,KAAK;CAChD,MAAM,CAAC,iBAAiB,mBAAmB,MAAM,eAAe;CAChE,MAAM,CAAC,aAAa,kBAAkB,MAAM,UAAwC;CACpF,MAAM,SAAS,gBAA2C;EACzD;EACA;EACA,QAAQ,UAAU,EAAE;EACpB;EAEA,cAAc;EACd,gBAAgB;EAChB,CAAC;CAEF,MAAM,UAAU,MAAM,aACpB,UAAwC;AACxC,mBAAiB;AAChB,aAAU,MAAM;AAChB,kBAAe,MAAM;KACnB,EAAE;AAEL,wBAAsB;AACrB,cAAW,MAA2C;IACrD;IAEH,CAAC,WAAW,CACZ;AAED,oBAAmB;EAClB,QAAQ,UAAU,EAAE;EACpB,OAAO;EACP;EACA,IAAI;GACH,WAAW,OAAO;GAClB,WAAW,OAAO;GAClB,SAAS,OAAO;GAChB,WAAW,OAAO;GAClB;EACD,iBAAiB;EACjB,aAAa;EACb,CAAC;AAEF,QAAO;EACN;EACA,OAAO;EACP;EACA;EACA,GAAG,+BAA+B,OAAO;EACzC"}