BREAKING_CHANGE: modify typings linked with parent view models access

Author: js2me

README.md

@@ -19,7 +19,7 @@ import {
 
 export class ViewModelImpl<
     Payload extends AnyObject = EmptyObject,
-    ParentViewModel extends ViewModel<any> = ViewModel<any>,
+    ParentViewModel extends ViewModel<any> | null = null,
   >
   extends AbstractViewModel<Payload, ParentViewModel>
   implements ViewModel<Payload, ParentViewModel>

src/view-model/abstract-view-model.store.test.ts

@@ -1,21 +1,23 @@
 import { describe, expect, it, vi } from 'vitest';
 
+import { AnyObject, EmptyObject, Maybe } from '../utils/types';
+
 import { AbstractViewModelStore } from './abstract-view-model.store';
 import { TestViewModelImpl } from './abstract-view-model.test';
 import { AbstractViewModelParams } from './abstract-view-model.types';
+import { ViewModel } from './view-model';
+import { ViewModelStore } from './view-model.store';
 import {
   ViewModelCreateConfig,
   ViewModelGenerateIdConfig,
 } from './view-model.store.types';
 
-export class TestViewModelStoreImpl extends AbstractViewModelStore<TestViewModelImpl> {
+export class TestViewModelStoreImpl extends AbstractViewModelStore {
   spies = {
     generateViewModelId: vi.fn(),
   };
 
-  createViewModel<VM extends TestViewModelImpl>(
-    config: ViewModelCreateConfig<VM>,
-  ): VM {
+  createViewModel<VM extends ViewModel>(config: ViewModelCreateConfig<VM>): VM {
     const VM = config.VM;
 
     const params: AbstractViewModelParams<VM['payload']> = {
@@ -27,7 +29,7 @@ export class TestViewModelStoreImpl extends AbstractViewModelStore<TestViewModel
     return new VM(params);
   }
 
-  generateViewModelId<VM extends TestViewModelImpl>(
+  generateViewModelId<VM extends ViewModel>(
     config: ViewModelGenerateIdConfig<VM>,
   ): string {
     const result = super.generateViewModelId(config);
@@ -36,30 +38,64 @@ export class TestViewModelStoreImpl extends AbstractViewModelStore<TestViewModel
   }
 }
 
-const createTestViewModelStore = () => {
-  return new TestViewModelStoreImpl();
-};
-
 describe('AbstractViewModelStore', () => {
   it('create instance', () => {
-    const vmStore = createTestViewModelStore();
+    const vmStore = new TestViewModelStoreImpl();
     expect(vmStore).toBeDefined();
   });
 
   it('is able to attach view model', async () => {
-    const vmStore = createTestViewModelStore();
-    const vm = new TestViewModelImpl({ id: '1', payload: '1' });
+    const vmStore = new TestViewModelStoreImpl();
+    const vm = new TestViewModelImpl({ id: '1' });
     await vmStore.attach(vm);
     expect(vmStore.get('1')).toBe(vm);
     expect(vmStore.instanceAttachedCount.get('1')).toBe(1);
   });
 
   it('is able to detach view model', async () => {
-    const vmStore = createTestViewModelStore();
-    const vm = new TestViewModelImpl({ id: '1', payload: '1' });
+    const vmStore = new TestViewModelStoreImpl();
+    const vm = new TestViewModelImpl({ id: '1' });
     await vmStore.attach(vm);
     await vmStore.detach('1');
     expect(vmStore.get('1')).toBe(null);
     expect(vmStore.instanceAttachedCount.get('1')).toBe(undefined);
   });
+
+  it('accessing to parent view models using store', async () => {
+    class TestViewModelImpl1<
+      Payload extends AnyObject = EmptyObject,
+      ParentViewModel extends ViewModel<any> | null = null,
+    > extends TestViewModelImpl<Payload, ParentViewModel> {
+      constructor(
+        private vmStore: ViewModelStore,
+        params?: Partial<AbstractViewModelParams<Payload>>,
+      ) {
+        super(params);
+      }
+
+      protected getParentViewModel(
+        parentViewModelId: Maybe<string>,
+      ): ParentViewModel {
+        return this.vmStore.get(parentViewModelId)! as ParentViewModel;
+      }
+    }
+
+    class VMParent extends TestViewModelImpl1 {}
+    class VMChild extends TestViewModelImpl1<any, VMParent> {}
+
+    const vmStore = new TestViewModelStoreImpl();
+
+    const parentVM = new VMParent(vmStore, { id: 'parent' });
+
+    await vmStore.attach(parentVM);
+
+    const childVM = new VMChild(vmStore, {
+      id: 'child',
+      parentViewModelId: 'parent',
+    });
+
+    await vmStore.attach(parentVM);
+
+    expect(childVM.parentViewModel.id).toBe('parent');
+  });
 });

src/view-model/abstract-view-model.test.ts

@@ -1,11 +1,15 @@
 import { describe, expect, it, vi } from 'vitest';
 
-import { Maybe } from '../utils/types';
+import { AnyObject, EmptyObject, Maybe } from '../utils/types';
 
 import { AbstractViewModel } from './abstract-view-model';
+import { AbstractViewModelParams } from './abstract-view-model.types';
 import { ViewModel } from './view-model';
 
-export class TestViewModelImpl extends AbstractViewModel<any, any> {
+export class TestViewModelImpl<
+  Payload extends AnyObject = EmptyObject,
+  ParentViewModel extends ViewModel<any> | null = null,
+> extends AbstractViewModel<Payload, ParentViewModel> {
   spies = {
     mount: vi.fn(),
     unmount: vi.fn(),
@@ -14,10 +18,18 @@ export class TestViewModelImpl extends AbstractViewModel<any, any> {
     didUnmount: vi.fn(),
   };
 
+  constructor(params?: Partial<AbstractViewModelParams<Payload>>) {
+    super({
+      ...params,
+      id: params?.id ?? '1',
+      payload: params?.payload ?? ({} as any),
+    });
+  }
+
   protected getParentViewModel(
     // eslint-disable-next-line @typescript-eslint/no-unused-vars
     parentViewModelId: Maybe<string>,
-  ): ViewModel<any, ViewModel<any, any>> | null {
+  ): ParentViewModel {
     throw new Error('Method not implemented.');
   }
 
@@ -43,94 +55,83 @@ export class TestViewModelImpl extends AbstractViewModel<any, any> {
     this.spies.didUnmount();
   }
 }
-export const createTestViewModel = ({
-  id = '1',
-  payload = {},
-}: {
-  id?: string;
-  payload?: any;
-} = {}) => {
-  const vm = new TestViewModelImpl({ id, payload });
-
-  return vm;
-};
 
 describe('AbstractViewModel', () => {
   it('create instance', () => {
-    const vm = new TestViewModelImpl({ id: '1', payload: {} });
+    const vm = new TestViewModelImpl();
     expect(vm).toBeDefined();
   });
 
   it('has id', () => {
-    const vm = new TestViewModelImpl({ id: '1', payload: {} });
+    const vm = new TestViewModelImpl();
     expect(vm.id).toBe('1');
   });
 
   it('has payload', () => {
-    const vm = new TestViewModelImpl({ id: '1', payload: { test: 1 } });
+    const vm = new TestViewModelImpl({ payload: { test: 1 } });
     expect(vm.payload).toEqual({ test: 1 });
   });
 
   it('has isMounted', () => {
-    const vm = new TestViewModelImpl({ id: '1', payload: {} });
+    const vm = new TestViewModelImpl();
     expect(vm.isMounted).toBe(false);
   });
 
   it('has mount method', () => {
-    const vm = new TestViewModelImpl({ id: '1', payload: {} });
+    const vm = new TestViewModelImpl();
     expect(vm.mount).toBeDefined();
   });
 
   it('has unmount method', () => {
-    const vm = new TestViewModelImpl({ id: '1', payload: {} });
+    const vm = new TestViewModelImpl();
     expect(vm.unmount).toBeDefined();
   });
 
   it('has dispose', () => {
-    const vm = new TestViewModelImpl({ id: '1', payload: {} });
+    const vm = new TestViewModelImpl();
     expect(vm.dispose).toBeDefined();
   });
 
   it('mount should be called once', () => {
-    const vm = new TestViewModelImpl({ id: '1', payload: {} });
+    const vm = new TestViewModelImpl();
 
     vm.mount();
 
     expect(vm.spies.mount).toHaveBeenCalledOnce();
   });
 
   it('didMount should be called after mount', () => {
-    const vm = new TestViewModelImpl({ id: '1', payload: {} });
+    const vm = new TestViewModelImpl();
 
     vm.mount();
 
     expect(vm.spies.didMount).toHaveBeenCalledOnce();
   });
 
   it('isMounted should be true after mount', () => {
-    const vm = createTestViewModel();
+    const vm = new TestViewModelImpl();
     vm.mount();
     expect(vm.isMounted).toBe(true);
   });
 
   it('unmount should be called once', () => {
-    const vm = createTestViewModel();
+    const vm = new TestViewModelImpl();
 
     vm.unmount();
 
     expect(vm.spies.unmount).toHaveBeenCalledOnce();
   });
 
   it('didUnmount should be called after unmount', () => {
-    const vm = createTestViewModel();
+    const vm = new TestViewModelImpl();
 
     vm.unmount();
 
     expect(vm.spies.didUnmount).toHaveBeenCalledOnce();
   });
 
   it('isMounted should be false after unmount', () => {
-    const vm = createTestViewModel();
+    const vm = new TestViewModelImpl();
     vm.mount();
     vm.unmount();
     expect(vm.isMounted).toBe(false);

src/view-model/abstract-view-model.ts

@@ -10,8 +10,8 @@ import { ViewModel } from './view-model';
 
 export abstract class AbstractViewModel<
   Payload extends AnyObject = EmptyObject,
-  ParentViewModel extends ViewModel<any> = ViewModel<any>,
-> implements ViewModel<Payload>
+  ParentViewModel extends ViewModel<any> | null = null,
+> implements ViewModel<Payload, ParentViewModel>
 {
   private abortController: AbortController;
 
@@ -114,7 +114,7 @@ export abstract class AbstractViewModel<
    */
   protected abstract getParentViewModel(
     parentViewModelId: Maybe<string>,
-  ): ParentViewModel | null;
+  ): ParentViewModel;
 
   /**
    * @deprecated use {didUnmount} instead

src/view-model/view-model.ts

@@ -8,7 +8,7 @@ import type { AbstractViewModel } from './abstract-view-model';
  */
 export interface ViewModel<
   Payload extends AnyObject = EmptyObject,
-  ParentViewModel extends ViewModel<any> = ViewModel<any, any>,
+  ParentViewModel extends ViewModel<any> | null = null,
 > {
   /**
    * The unique identifier for the view model.
@@ -33,7 +33,7 @@ export interface ViewModel<
    * Parent view model is the one that is above the current view model in the tree of view models.
    * Parent view model is determined by the getParentViewModel() method.
    */
-  readonly parentViewModel: ParentViewModel | null;
+  readonly parentViewModel: ParentViewModel;
 
   /**
    * The method that is called when the view model is mounted.