Skip to content

Commit 17935ad

Browse files
TheEdoRanTheEdoRan
authoredMay 8, 2024··
feat(hooks): return input from hooks (#118)
Code in this PR adds `input` property in the object returned by the three hooks. re #116
·
v8.0.0-beta.11v7.0.0-next.38
1 parent a7cb006 commit 17935ad

File tree

4 files changed

+16
-11
lines changed

4 files changed

+16
-11
lines changed
 

‎packages/next-safe-action/src/hooks.ts

+11-9
Original file line numberDiff line numberDiff line change
@@ -119,7 +119,7 @@ export const useAction = <
119119
) => {
120120
const [, startTransition] = React.useTransition();
121121
const [result, setResult] = React.useState<HookResult<ServerError, S, BAS, FVE, FBAVE, Data>>(EMPTY_HOOK_RESULT);
122-
const [input, setInput] = React.useState<S extends Schema ? InferIn<S> : void>();
122+
const [clientInput, setClientInput] = React.useState<S extends Schema ? InferIn<S> : void>();
123123
const [isExecuting, setIsExecuting] = React.useState(false);
124124
const [isIdle, setIsIdle] = React.useState(true);
125125

@@ -128,7 +128,7 @@ export const useAction = <
128128
const execute = React.useCallback(
129129
(input: S extends Schema ? InferIn<S> : void) => {
130130
setIsIdle(false);
131-
setInput(input);
131+
setClientInput(input);
132132
setIsExecuting(true);
133133

134134
return startTransition(() => {
@@ -151,18 +151,20 @@ export const useAction = <
151151

152152
const reset = () => {
153153
setIsIdle(true);
154+
setClientInput(undefined);
154155
setResult(EMPTY_HOOK_RESULT);
155156
};
156157

157158
useActionCallbacks({
158159
result,
159-
input: input as S extends Schema ? InferIn<S> : undefined,
160+
input: clientInput as S extends Schema ? InferIn<S> : undefined,
160161
status,
161162
cb: utils,
162163
});
163164

164165
return {
165166
execute,
167+
input: clientInput,
166168
result,
167169
reset,
168170
status,
@@ -192,10 +194,9 @@ export const useOptimisticAction = <
192194
) => {
193195
const [, startTransition] = React.useTransition();
194196
const [result, setResult] = React.useState<HookResult<ServerError, S, BAS, FVE, FBAVE, Data>>(EMPTY_HOOK_RESULT);
195-
const [input, setInput] = React.useState<S extends Schema ? InferIn<S> : void>();
197+
const [clientInput, setClientInput] = React.useState<S extends Schema ? InferIn<S> : void>();
196198
const [isExecuting, setIsExecuting] = React.useState(false);
197199
const [isIdle, setIsIdle] = React.useState(true);
198-
199200
const [optimisticData, setOptimisticData] = React.useOptimistic<Data, S extends Schema ? InferIn<S> : undefined>(
200201
utils.currentData,
201202
utils.updateFn
@@ -206,7 +207,7 @@ export const useOptimisticAction = <
206207
const execute = React.useCallback(
207208
(input: S extends Schema ? InferIn<S> : void) => {
208209
setIsIdle(false);
209-
setInput(input);
210+
setClientInput(input);
210211
setIsExecuting(true);
211212

212213
return startTransition(() => {
@@ -230,12 +231,13 @@ export const useOptimisticAction = <
230231

231232
const reset = () => {
232233
setIsIdle(true);
234+
setClientInput(undefined);
233235
setResult(EMPTY_HOOK_RESULT);
234236
};
235237

236238
useActionCallbacks({
237239
result,
238-
input: input as S extends Schema ? InferIn<S> : undefined,
240+
input: clientInput as S extends Schema ? InferIn<S> : undefined,
239241
status,
240242
cb: {
241243
onExecute: utils.onExecute,
@@ -247,6 +249,7 @@ export const useOptimisticAction = <
247249

248250
return {
249251
execute,
252+
input: clientInput,
250253
result,
251254
optimisticData,
252255
reset,
@@ -281,9 +284,7 @@ export const useStateAction = <
281284
utils?.permalink
282285
);
283286
const [isIdle, setIsIdle] = React.useState(true);
284-
285287
const [clientInput, setClientInput] = React.useState<S extends Schema ? InferIn<S> : void>();
286-
287288
const status = getActionStatus<ServerError, S, BAS, FVE, FBAVE, Data>({ isExecuting, result, isIdle });
288289

289290
const execute = React.useCallback(
@@ -311,6 +312,7 @@ export const useStateAction = <
311312

312313
return {
313314
execute,
315+
input: clientInput,
314316
result,
315317
status,
316318
};

‎website/docs/execution/hooks/useaction.md

+2-1
Original file line numberDiff line numberDiff line change
@@ -75,8 +75,9 @@ As you can see, here we display a greet message after the action is performed, i
7575
| Name | Type | Purpose |
7676
| --------- | -------------------------------------------- | ------------------------------------------------------------------------------------------------- |
7777
| `execute` | `(input: InferIn<S>) => void` | An action caller with no return. The input is the same as the safe action you passed to the hook. |
78+
| `input` | `InferIn<S> \| undefined` | The input passed to the `execute` function. |
7879
| `result` | [`HookResult`](/docs/types#hookresult) | When the action gets called via `execute`, this is the result object. |
7980
| `status` | [`HookActionStatus`](/docs/types#hookresult) | The action current status. |
80-
| `reset` | `() => void` | You can programmatically reset the `result` object with this function. |
81+
| `reset` | `() => void` | Programmatically reset `input` and `result` object with this function. |
8182

8283
Explore a working example [here](<https://github.com/TheEdoRan/next-safe-action/tree/main/apps/playground/src/app/(examples)/hook>).

‎website/docs/execution/hooks/useoptimisticaction.md

+2-1
Original file line numberDiff line numberDiff line change
@@ -125,9 +125,10 @@ export default function AddLikes({ likesCount }: Props) {
125125
| Name | Type | Purpose |
126126
| ---------------- | ----------------------------------------------------------------------- | ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
127127
| `execute` | `(input: InferIn<S>) => void` | An action caller with no return. The input is the same as the safe action you passed to the hook. |
128+
| `input` | `InferIn<S> \| undefined` | The input passed to the `execute` function. |
128129
| `result` | [`HookResult`](/docs/types#hookresult) | When the action gets called via `execute`, this is the result object. |
129130
| `status` | [`HookActionStatus`](/docs/types#hookresult) | The action current status. |
130-
| `reset` | `() => void` | You can programmatically reset the `result` object with this function. |
131+
| `reset` | `() => void` | Programmatically reset `input` and `result` object with this function. |
131132
| `optimisticData` | `Data` (return type of the `safeActionFn` you passed as first argument) | This is the data that gets updated immediately after `execute` is called, with the behavior you defined in the `reducer` function hook argument. The initial state is what you provided to the hook via `initialOptimisticData` argument. |
132133

133134
Explore a working example [here](<https://github.com/TheEdoRan/next-safe-action/tree/main/apps/playground/src/app/(examples)/optimistic-hook>).

‎website/docs/execution/hooks/usestateaction.md

+1
Original file line numberDiff line numberDiff line change
@@ -95,6 +95,7 @@ You can pass an optional initial result to `useStateAction`, with the `initResul
9595
| Name | Type | Purpose |
9696
| ---------------- | ----------------------------------------------------------------------- | ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
9797
| `execute` | `(input: InferIn<S>) => void` | An action caller with no return. The input is the same as the safe action you passed to the hook. |
98+
| `input` | `InferIn<S> \| undefined` | The input passed to the `execute` function. |
9899
| `result` | [`HookResult`](/docs/types#hookresult) | When the action gets called via `execute`, this is the result object. |
99100
| `status` | [`HookActionStatus`](/docs/types#hookresult) | The action current status. |
100101

0 commit comments

Comments
 (0)
Please sign in to comment.