feat: support abort signal for MobxMutations (#13)

Author: js2me

src/mobx-mutation.test.ts

@@ -160,4 +160,43 @@ describe('MobxMutation', () => {
       await mobxMutation.mutate();
     }).rejects.toThrowError('BAD');
   });
+
+  it('should be able to do abort using second argument in mutationFn', async () => {
+    vi.useFakeTimers();
+
+    const fakeFetch = (data: any = 'OK', signal?: AbortSignal) => {
+      return new Promise((resolve, reject) => {
+        setTimeout(() => {
+          // eslint-disable-next-line @typescript-eslint/no-use-before-define
+          mobxMutation.destroy();
+        }, 200);
+        const timer = setTimeout(() => resolve(data), 1000);
+        signal?.addEventListener('abort', () => {
+          clearTimeout(timer);
+          reject(signal.reason);
+        });
+        vi.runAllTimers();
+      });
+    };
+
+    const mobxMutation = new MobxMutationMock({
+      mutationKey: ['test'],
+      mutationFn: async (_, { signal }) => {
+        await fakeFetch('OK', signal);
+      },
+    });
+    try {
+      await mobxMutation.mutate();
+      await vi.runAllTimersAsync();
+      expect(false).toBe('abort should happen');
+    } catch (error) {
+      if (error instanceof DOMException) {
+        expect(error.message).toBe('The operation was aborted.');
+      } else {
+        expect(false).toBe('error should be DOMException');
+      }
+    }
+
+    vi.useRealTimers();
+  });
 });

src/mobx-mutation.ts

@@ -43,6 +43,7 @@ export class MobxMutation<
       queryClient,
       invalidateQueries,
       invalidateByKey: providedInvalidateByKey,
+      mutationFn,
       ...restOptions
     } = config;
     this.abortController = new LinkedAbortController(config.abortSignal);
@@ -71,7 +72,11 @@ export class MobxMutation<
       TContext
       // eslint-disable-next-line @typescript-eslint/ban-ts-comment
       // @ts-expect-error
-    >(queryClient, this.mutationOptions);
+    >(queryClient, {
+      ...this.mutationOptions,
+      mutationFn: (variables) =>
+        mutationFn?.(variables, { signal: this.abortController.signal }),
+    });
 
     this.updateResult(this.mutationObserver.getCurrentResult());
 

src/mobx-mutation.types.ts

@@ -36,16 +36,22 @@ export interface MobxMutationInvalidateQueriesOptions
   queryKeys?: InvalidateQueryFilters['queryKey'][];
 }
 
+export type MobxMutationFunction<TData = unknown, TVariables = unknown> = (
+  variables: TVariables,
+  options: { signal: AbortSignal },
+) => Promise<TData>;
+
 export interface MobxMutationConfig<
   TData = unknown,
   TVariables = void,
   TError = DefaultError,
   TContext = unknown,
 > extends Omit<
       MutationObserverOptions<TData, TError, TVariables, TContext>,
-      '_defaulted'
+      '_defaulted' | 'mutationFn'
     >,
     MobxMutationFeatures {
+  mutationFn?: MobxMutationFunction<TData, TVariables>;
   queryClient: AnyQueryClient;
   abortSignal?: AbortSignal;
   invalidateQueries?: