refactor: query features and mutation features inside queries/mutations

Author: js2me

.changeset/red-groups-tie.md

@@ -0,0 +1,5 @@
+---
+"mobx-tanstack-query": minor
+---
+
+rework query/mutation features code (refactor and clean code inside queries and mutations)

src/inifinite-query.ts

@@ -37,7 +37,6 @@ import {
   InfiniteQueryUpdateOptionsAllVariants,
 } from './inifinite-query.types';
 import { Query } from './query';
-import { QueryClient } from './query-client';
 import { AnyQueryClient, QueryClientHooks } from './query-client.types';
 import { QueryFeatures } from './query.types';
 
@@ -242,9 +241,9 @@ export class InfiniteQuery<
     TPageParam
   >;
 
-  private isEnabledOnResultDemand: boolean;
   isResultRequsted: boolean;
-  protected isLazy?: boolean;
+
+  protected features: QueryFeatures;
 
   /**
    * This parameter is responsible for holding the enabled value,
@@ -259,9 +258,10 @@ export class InfiniteQuery<
   >['enabled'];
   private _observerSubscription?: VoidFunction;
   private hooks?: QueryClientHooks;
+
   protected errorListeners: InfiniteQueryErrorListener<TError>[];
   protected doneListeners: InfiniteQueryDoneListener<TData>[];
-  protected cumulativeQueryHash: boolean;
+
   protected cumulativeQueryKeyHashesSet: Set<string>;
 
   constructor(
@@ -325,31 +325,30 @@ export class InfiniteQuery<
     this.queryClient = queryClient;
     this._result = undefined as any;
     this.isResultRequsted = false;
-    this.isEnabledOnResultDemand = config.enableOnDemand ?? false;
+
     this.errorListeners = [];
     this.doneListeners = [];
-    this.hooks =
-      'hooks' in this.queryClient ? this.queryClient.hooks : undefined;
-    this.isLazy = this.config.lazy;
-    this.cumulativeQueryHash = !!config.cumulativeQueryHash;
 
-    let transformError: QueryFeatures['transformError'] = config.transformError;
+    this.features = {
+      cumulativeQueryHash: config.cumulativeQueryHash,
+      enableOnDemand: config.enableOnDemand,
+      lazy: config.lazy,
+      resetOnDestroy: config.resetOnDestroy,
+      removeOnDestroy: config.removeOnDestroy,
+      transformError: config.transformError,
+      dynamicOptionsUpdateDelay: config.dynamicOptionsUpdateDelay,
+    };
 
     if ('queryFeatures' in queryClient) {
-      if (this.config.lazy === undefined) {
-        this.isLazy = queryClient.queryFeatures.lazy ?? false;
-      }
-      if (config.enableOnDemand === undefined) {
-        this.isEnabledOnResultDemand =
-          queryClient.queryFeatures.enableOnDemand ?? false;
-      }
-      if (config.cumulativeQueryHash === undefined) {
-        this.cumulativeQueryHash =
-          queryClient.queryFeatures.cumulativeQueryHash ?? false;
-      }
-      if (!transformError) {
-        transformError = queryClient.queryFeatures.transformError;
-      }
+      this.features.lazy ??= queryClient.queryFeatures.lazy;
+      this.features.enableOnDemand ??=
+        queryClient.queryFeatures.enableOnDemand ??
+        queryClient.queryFeatures.resetOnDispose;
+      this.features.cumulativeQueryHash ??=
+        queryClient.queryFeatures.cumulativeQueryHash;
+      this.features.transformError ??= queryClient.queryFeatures.transformError;
+
+      this.hooks = queryClient.hooks;
     }
 
     observable.deep(this, '_result');
@@ -363,9 +362,9 @@ export class InfiniteQuery<
 
     originalQueryProperties.forEach((property) => {
       if (this[property]) return;
-      if (property === 'error' && transformError) {
+      if (property === 'error' && this.features.transformError) {
         Object.defineProperty(this, property, {
-          get: () => transformError(this.result[property]),
+          get: () => this.features.transformError!(this.result[property]),
         });
       } else {
         Object.defineProperty(this, property, {
@@ -432,7 +431,7 @@ export class InfiniteQuery<
     // @ts-expect-error
     this.updateResult(this.queryObserver.getOptimisticResult(this.options));
 
-    if (this.isLazy) {
+    if (this.features.lazy) {
       const cleanup = lazyObserve({
         context: this,
         property: '_result',
@@ -566,7 +565,7 @@ export class InfiniteQuery<
   }
 
   public get result() {
-    if (this.isEnabledOnResultDemand && !this.isResultRequsted) {
+    if (this.features.enableOnDemand && !this.isResultRequsted) {
       runInAction(() => {
         this.isResultRequsted = true;
       });
@@ -628,27 +627,11 @@ export class InfiniteQuery<
     this.queryObserver.destroy();
     this.isResultRequsted = false;
 
-    let isNeedToReset =
-      this.config.resetOnDestroy || this.config.resetOnDispose;
-    let isNeedToRemove = this.config.removeOnDestroy;
-
-    if (this.queryClient instanceof QueryClient) {
-      if (isNeedToReset === undefined) {
-        isNeedToReset =
-          this.queryClient.queryFeatures.resetOnDestroy ||
-          this.queryClient.queryFeatures.resetOnDispose;
-      }
-
-      if (isNeedToRemove === undefined) {
-        isNeedToRemove = this.queryClient.queryFeatures.removeOnDestroy;
-      }
-    }
-
-    if (isNeedToReset) {
+    if (this.features.resetOnDestroy) {
       this.reset();
     }
 
-    if (isNeedToRemove) {
+    if (this.features.removeOnDestroy) {
       this.remove();
     }
 

src/mutation.ts

@@ -58,8 +58,7 @@ export class Mutation<
 
   result: MutationObserverResult<TData, TError, TVariables, TContext>;
 
-  protected isLazy?: boolean;
-  protected isResetOnDestroy?: MutationFeatures['resetOnDestroy'];
+  protected features: MutationFeatures;
 
   protected settledListeners: MutationSettledListener<
     TData,
@@ -129,44 +128,29 @@ export class Mutation<
   constructor(
     protected config: MutationConfig<TData, TVariables, TError, TContext>,
   ) {
-    const {
-      queryClient,
-      invalidateQueries,
-      invalidateByKey: providedInvalidateByKey,
-      mutationFn,
-      ...restOptions
-    } = config;
+    const { queryClient, invalidateQueries, mutationFn, ...restOptions } =
+      config;
     this.abortController = new LinkedAbortController(config.abortSignal);
     this.queryClient = queryClient;
     this.result = undefined as any;
-    this.isLazy = this.config.lazy;
+    this.features = {
+      invalidateByKey: config.invalidateByKey,
+      lazy: config.lazy,
+      resetOnDestroy: config.resetOnDestroy ?? config.resetOnDestroy,
+      transformError: config.transformError,
+    };
     this.settledListeners = [];
     this.errorListeners = [];
     this.doneListeners = [];
-    this.isResetOnDestroy =
-      this.config.resetOnDestroy ?? this.config.resetOnDispose;
-
-    let transformError: MutationFeatures['transformError'] =
-      config.transformError;
-
-    let invalidateByKey: MutationFeatures['invalidateByKey'] =
-      providedInvalidateByKey;
 
     if ('mutationFeatures' in queryClient) {
-      if (providedInvalidateByKey === undefined) {
-        invalidateByKey = queryClient.mutationFeatures.invalidateByKey;
-      }
-      if (this.config.lazy === undefined) {
-        this.isLazy = queryClient.mutationFeatures.lazy;
-      }
-      if (this.isResetOnDestroy === undefined) {
-        this.isResetOnDestroy =
-          queryClient.mutationFeatures.resetOnDestroy ??
-          queryClient.mutationFeatures.resetOnDispose;
-      }
-      if (!transformError) {
-        transformError = queryClient.queryFeatures.transformError;
-      }
+      this.features.invalidateByKey ??=
+        queryClient.mutationFeatures.invalidateByKey;
+      this.features.lazy ??= queryClient.mutationFeatures.lazy;
+      this.features.resetOnDestroy ??=
+        queryClient.mutationFeatures.resetOnDestroy ??
+        queryClient.mutationFeatures.resetOnDispose;
+      this.features.transformError ??= queryClient.queryFeatures.transformError;
 
       this.hooks = queryClient.hooks;
     }
@@ -177,9 +161,9 @@ export class Mutation<
     this.start = this.start.bind(this);
 
     originalMutationProperties.forEach((property) => {
-      if (property === 'error' && transformError) {
+      if (property === 'error' && this.features.transformError) {
         Object.defineProperty(this, property, {
-          get: () => transformError(this.result[property]),
+          get: () => this.features.transformError!(this.result[property]),
         });
       } else {
         Object.defineProperty(this, property, {
@@ -207,7 +191,7 @@ export class Mutation<
 
     this.updateResult(this.mutationObserver.getCurrentResult());
 
-    if (this.isLazy) {
+    if (this.features.lazy) {
       const cleanup = lazyObserve({
         context: this,
         property: 'result',
@@ -269,10 +253,12 @@ export class Mutation<
       });
     }
 
-    if (invalidateByKey && this.mutationOptions.mutationKey) {
+    if (this.features.invalidateByKey && this.mutationOptions.mutationKey) {
       this.onDone(() => {
         this.queryClient.invalidateQueries({
-          ...(invalidateByKey === true ? {} : invalidateByKey),
+          ...(this.features.invalidateByKey === true
+            ? {}
+            : this.features.invalidateByKey),
           queryKey: this.mutationOptions.mutationKey,
         });
       });
@@ -286,7 +272,7 @@ export class Mutation<
     variables: TVariables,
     options?: MutationOptions<TData, TError, TVariables, TContext>,
   ) {
-    if (this.isLazy) {
+    if (this.features.lazy) {
       let error: any;
 
       try {
@@ -365,7 +351,7 @@ export class Mutation<
     this.errorListeners = [];
     this.settledListeners = [];
 
-    if (this.isResetOnDestroy) {
+    if (this.features.resetOnDestroy) {
       this.reset();
     }