implement cleanup function for async computed signal

Author: Varixo

packages/qwik/src/core/reactive-primitives/impl/async-computed-signal-impl.ts

@@ -3,13 +3,14 @@ import { qwikDebugToString } from '../../debug';
 import type { Container } from '../../shared/types';
 import { ChoreType } from '../../shared/util-chore-type';
 import { isPromise } from '../../shared/utils/promises';
-import { trackFn } from '../../use/utils/tracker';
+import { cleanupFn, trackFn } from '../../use/utils/tracker';
 import type { BackRef } from '../cleanup';
 import type { AsyncComputeQRL, EffectSubscription } from '../types';
 import { _EFFECT_BACK_REF, EffectProperty, SignalFlags } from '../types';
 import { throwIfQRLNotResolved } from '../utils';
 import { ComputedSignalImpl } from './computed-signal-impl';
 import { setupSignalValueAccess } from './signal-impl';
+import type { NoSerialize } from '../../shared/utils/serialize-utils';
 
 const DEBUG = false;
 const log = (...args: any[]) =>
@@ -32,6 +33,7 @@ export class AsyncComputedSignalImpl<T>
 
   $pendingEffects$: null | Set<EffectSubscription> = null;
   $failedEffects$: null | Set<EffectSubscription> = null;
+  $destroy$: NoSerialize<() => void> | null;
   private $promiseValue$: T | null = null;
 
   [_EFFECT_BACK_REF]: Map<EffectProperty | string, EffectSubscription> | null = null;
@@ -103,8 +105,13 @@ export class AsyncComputedSignalImpl<T>
     const computeQrl = this.$computeQrl$;
     throwIfQRLNotResolved(computeQrl);
 
+    const [cleanup] = cleanupFn(this, (err) => this.$container$?.handleError(err, null!));
     const untrackedValue =
-      this.$promiseValue$ ?? (computeQrl.getFn()({ track: trackFn(this, this.$container$) }) as T);
+      this.$promiseValue$ ??
+      (computeQrl.getFn()({
+        track: trackFn(this, this.$container$),
+        cleanup,
+      }) as T);
     if (isPromise(untrackedValue)) {
       this.untrackedPending = true;
       this.untrackedFailed = false;

packages/qwik/src/core/reactive-primitives/types.ts

@@ -38,6 +38,7 @@ export interface InternalSignal<T = any> extends InternalReadonlySignal<T> {
 export type ComputeQRL<T> = QRLInternal<ComputedFn<T>>;
 export type AsyncComputedCtx = {
   track: Tracker;
+  cleanup: (callback: () => void) => void;
 };
 export type AsyncComputeQRL<T> = QRLInternal<AsyncComputedFn<T>>;
 

packages/qwik/src/core/use/utils/tracker.ts

@@ -10,10 +10,12 @@ import { EffectProperty, STORE_ALL_PROPS, type Consumer } from '../../reactive-p
 import { isSignal } from '../../reactive-primitives/utils';
 import { qError, QError } from '../../shared/error/error';
 import type { Container } from '../../shared/types';
-import { noSerialize } from '../../shared/utils/serialize-utils';
+import { noSerialize, type NoSerialize } from '../../shared/utils/serialize-utils';
 import { isFunction, isObject } from '../../shared/utils/types';
 import { invoke, newInvokeContext } from '../use-core';
-import type { Task, Tracker } from '../use-task';
+import type { Tracker } from '../use-task';
+
+export type Destroyable = { $destroy$: NoSerialize<() => void> | null };
 
 export const trackFn =
   (target: Consumer, container: Container | null): Tracker =>
@@ -44,8 +46,8 @@ export const trackFn =
     });
   };
 
-export const cleanupFn = (
-  target: Task,
+export const cleanupFn = <T extends Destroyable>(
+  target: T,
   handleError: (err: unknown) => void
 ): [(callback: () => void) => void, (() => void)[]] => {
   let cleanupFns: (() => void)[] | null = null;