Fix lens nested childs bug

zerobias · zerobias · commit c9e4c65a7efe · 2025-04-29T21:54:43.000+05:00
Lazy things got complicated
diff --git a/packages/core/src/keyval.ts b/packages/core/src/keyval.ts
@@ -100,62 +100,71 @@ export function keyval<Input, ModelEnhance, Api, Shape>(
     return options.clone(true, options.cloneOf || options);
   }
 
+  type Enriched = Input & ModelEnhance;
+  type Output = {
+    [K in keyof ModelEnhance]:
+      | Store<ModelEnhance[K]>
+      | Keyval<any, ModelEnhance[K], any, any>;
+  };
+  type KeyvalListState = ListState<Enriched, Output, Api>;
+
   const init = (
     isClone: boolean,
-    cloneOf: Keyval<any, any, any, any> | null,
+    cloneOf: Keyval<Input, Enriched, Api, Shape> | null,
   ) => {
-    type Enriched = Input & ModelEnhance;
-    type Output = {
-      [K in keyof ModelEnhance]:
-        | Store<ModelEnhance[K]>
-        | Keyval<any, ModelEnhance[K], any, any>;
-    };
-    type KeyvalListState = ListState<Enriched, Output, Api>;
     const $entities = createStore<KeyvalListState>({
       items: [],
       instances: [],
       keys: [],
     });
     const $items = $entities.map(({ items }) => items);
     const $keys = $entities.map(({ keys }) => keys);
+    let getKeyRaw:
+      | keyof Input
+      | ((entity: Input) => string | number)
+      | undefined;
+    let create:
+      | void
+      | ((config: { onMount: Event<void> }) => {
+          state: unknown;
+          api?: unknown;
+          key: string;
+          optional?: string[];
+        });
+    let shape: Shape;
+    if (typeof options === 'function') {
+      create = options as any;
+    } else {
+      ({
+        key: getKeyRaw,
+        shape = {} as Shape,
+        create,
+      } = options as Exclude<typeof options, Keyval<any, any, any, any>>);
+    }
+    const {
+      getKey: getKeyClone,
+      keyField: keyFieldClone,
+      structShape: structShapeClone,
+      defaultState: defaultStateClone,
+    } = cloneOf?.getCloneData() ?? {};
     return lazyInit(
       {
         type: 'keyval',
         api: 0,
         __lens: 0,
-        __struct: 0,
+        __struct: structShapeClone,
         $items,
         $keys,
         __$listState: $entities,
-        defaultState: () => null as any,
+        defaultState: defaultStateClone,
         edit: 0,
         editField: 0,
         clone: init,
         isClone,
         cloneOf,
+        getCloneData: cloneOf?.getCloneData ?? (() => null as any),
       } as any as Keyval<Input, Input & ModelEnhance, Api, Shape>,
       () => {
-        let create:
-          | void
-          | ((config: { onMount: Event<void> }) => {
-              state: unknown;
-              api?: unknown;
-              key: string;
-              optional?: string[];
-            });
-        // @ts-expect-error bad implementation
-        let getKeyRaw;
-        let shape: Shape;
-        if (typeof options === 'function') {
-          create = options as any;
-        } else {
-          ({
-            key: getKeyRaw,
-            shape = {} as Shape,
-            create,
-          } = options as Exclude<typeof options, Keyval<any, any, any, any>>);
-        }
-
         let kvModel:
           | Model<
               {
@@ -169,20 +178,55 @@ export function keyval<Input, ModelEnhance, Api, Shape>(
 
         if (create) {
           // @ts-expect-error typecast
-          kvModel = model({ create });
+          kvModel = model({ create, isClone });
         }
+        const getKey =
+          getKeyClone ??
+          (!kvModel
+            ? typeof getKeyRaw === 'function'
+              ? getKeyRaw
+              : // @ts-expect-error bad implementation
+                (entity: Input) => entity[getKeyRaw] as string | number
+            : (entity: Input) => entity[kvModel.keyField] as string | number);
+        const keyField =
+          keyFieldClone ??
+          (!kvModel
+            ? typeof getKeyRaw === 'function' || getKeyRaw === undefined
+              ? null
+              : getKeyRaw
+            : kvModel.keyField);
+        const structShape =
+          structShapeClone ??
+          (kvModel
+            ? ({
+                type: 'structKeyval',
+                getKey,
+                shape: kvModel.__struct!.shape,
+                defaultItem: kvModel.defaultState,
+              } as StructKeyval)
+            : shape!
+              ? ({
+                  type: 'structKeyval',
+                  getKey,
+                  shape: {},
+                  // TODO add support for .itemStore
+                  defaultItem: () => null,
+                } as StructKeyval)
+              : (null as any as StructKeyval));
 
-        const getKey = !kvModel
-          ? typeof getKeyRaw === 'function'
-            ? getKeyRaw
-            : // @ts-expect-error bad implementation
-              (entity: Input) => entity[getKeyRaw] as string | number
-          : (entity: Input) => entity[kvModel.keyField] as string | number;
-        const keyField = !kvModel
-          ? typeof getKeyRaw === 'function' || getKeyRaw === undefined
-            ? null
-            : getKeyRaw
-          : kvModel.keyField;
+        const defaultState =
+          defaultStateClone ?? (() => kvModel?.defaultState() ?? (null as any));
+
+        const getCloneData =
+          cloneOf?.getCloneData ??
+          (() => {
+            return {
+              defaultState,
+              structShape,
+              keyField,
+              getKey,
+            };
+          });
 
         const api = createInstanceApi($entities, kvModel);
         const editApi = createEditApi(
@@ -194,41 +238,22 @@ export function keyval<Input, ModelEnhance, Api, Shape>(
         );
         const editField = createEditFieldApi(keyField, kvModel, editApi.update);
 
-        const structShape = kvModel
-          ? ({
-              type: 'structKeyval',
-              getKey,
-              shape: kvModel.__struct!.shape,
-              defaultItem: kvModel.defaultState,
-            } as StructKeyval)
-          : shape!
-            ? ({
-                type: 'structKeyval',
-                getKey,
-                shape: {},
-                // TODO add support for .itemStore
-                defaultItem: () => null,
-              } as StructKeyval)
-            : (null as any as StructKeyval);
-
         return {
           type: 'keyval' as const,
           api: api as any,
-          // @ts-expect-error bad implementation
           __lens: shape,
           __struct: structShape,
           $items,
           $keys,
           __$listState: $entities as any,
-          defaultState() {
-            return kvModel?.defaultState() ?? (null as any);
-          },
+          defaultState,
           edit: editApi,
           editField,
           clone: init,
           isClone,
           cloneOf,
-        };
+          getCloneData,
+        } as Keyval<Input, Input & ModelEnhance, Api, Shape>;
       },
     );
   };
diff --git a/packages/core/src/lazy.ts b/packages/core/src/lazy.ts
@@ -17,18 +17,23 @@ type TypeMap = {
 
 export let currentSkipLazyCb = true;
 export let isRoot = true;
+export let isInitClone = false;
 
 export function callInLazyStack<T extends () => any>(
   fn: T,
   skipLazyCb: boolean,
+  isClone: boolean,
 ): ReturnType<T> {
   const prevLazyCb = currentSkipLazyCb;
   const prevIsRoot = isRoot;
+  const prevIsInitClone = isInitClone;
   currentSkipLazyCb = skipLazyCb;
   isRoot = false;
+  isInitClone = isClone;
   const result = fn();
   currentSkipLazyCb = prevLazyCb;
   isRoot = prevIsRoot;
+  isInitClone = prevIsInitClone;
   return result;
 }
 
diff --git a/packages/core/src/lazyInit.ts b/packages/core/src/lazyInit.ts
@@ -1,4 +1,4 @@
-import { currentSkipLazyCb, isRoot } from './lazy';
+import { currentSkipLazyCb, isRoot, isInitClone } from './lazy';
 
 const queue: InitTask<any>[] = [];
 let scheduled = false;
@@ -17,6 +17,7 @@ const ignore = [
   '__$listState',
   '$items',
   '$keys',
+  'getCloneData',
 ];
 
 function runQueue() {
@@ -39,7 +40,7 @@ function runQueue() {
 }
 
 export function lazyInit<T extends object>(target: T, init: () => T): T {
-  if (currentSkipLazyCb && !isRoot) {
+  if (currentSkipLazyCb && !isRoot && isInitClone) {
     return target;
   }
   const task: InitTask<T> = { target, init, initialized: false };
diff --git a/packages/core/src/model.ts b/packages/core/src/model.ts
@@ -44,6 +44,7 @@ export function model<
   } = {},
 >({
   create,
+  isClone,
 }: {
   create: () => {
     state: Output;
@@ -52,6 +53,7 @@ export function model<
     optional?: string[];
     onMount?: EventCallable<void>;
   };
+  isClone: boolean;
 }): Model<
   Input,
   Show<{
@@ -78,7 +80,7 @@ export function model<
     onMount,
     ...rest
   } = withRegion(region, () => {
-    return callInLazyStack(() => create(), true);
+    return callInLazyStack(() => create(), true, isClone);
   });
 
   if (Object.keys(rest).length > 0) {
@@ -156,7 +158,7 @@ export function model<
       if (!defaultState) {
         const region = createRegionalNode(false);
         const { state = {} } = withRegion(region, () =>
-          callInLazyStack(() => create(), false),
+          callInLazyStack(() => create(), false, false),
         );
         defaultState = {};
         for (const key in state) {
diff --git a/packages/core/src/spawn.ts b/packages/core/src/spawn.ts
@@ -84,7 +84,7 @@ export function spawn<
         state: storeOutputs = {},
         api: apiOutputs = {},
         onMount,
-      } = callInLazyStack(() => model.create(), false);
+      } = callInLazyStack(() => model.create(), false, false);
       const resultShape = {
         ...storeOutputs,
       } as Output;
diff --git a/packages/core/src/types.ts b/packages/core/src/types.ts
@@ -240,7 +240,7 @@ export type Keyval<Input, Enriched, Api, Shape> = {
   //private
   clone(
     isClone: boolean,
-    cloneOf: Keyval<any, any, any, any> | null,
+    cloneOf: Keyval<Input, Enriched, Api, Shape> | null,
   ): Keyval<Input, Enriched, Api, Shape>;
   isClone: boolean;
   // private
@@ -256,6 +256,12 @@ export type Keyval<Input, Enriched, Api, Shape> = {
     >
   >;
   cloneOf: Keyval<any, any, any, any> | null;
+  getCloneData(): {
+    defaultState(): Enriched;
+    structShape: StructKeyval;
+    keyField: keyof Input | null;
+    getKey(entity: Input): string | number;
+  };
 };
 
 export type StoreContext<T> = {
