fix(react): date compare in shallow equal function

packages/angular-store/src/index.ts

@@ -85,6 +85,11 @@ function shallow<T>(objA: T, objB: T) {
     return true
   }
 
+  if (objA instanceof Date && objB instanceof Date) {
+    if (objA.getTime() !== objB.getTime()) return false
+    return true
+  }
+
   const keysA = Object.keys(objA)
   if (keysA.length !== Object.keys(objB).length) {
     return false

packages/angular-store/tests/index.test.ts

@@ -93,3 +93,53 @@ describe('injectStore', () => {
     expect(count).toEqual(2)
   })
 })
+
+describe('dataType', () => {
+  test('date change trigger re-render', () => {
+    const store = new Store({ date: new Date('2025-03-29T21:06:30.401Z') })
+
+    @Component({
+      template: `
+        <div>
+          <p id="displayStoreVal">{{ storeVal() }}</p>
+          <button id="updateDate" (click)="updateDate()">Update date</button>
+        </div>
+      `,
+      standalone: true,
+    })
+    class MyCmp {
+      storeVal = injectStore(store, (state) => state.date)
+
+      constructor() {
+        effect(() => {
+          console.log(this.storeVal())
+        })
+      }
+
+      updateDate() {
+        store.setState((v) => ({
+          ...v,
+          date: new Date('2025-03-29T21:06:40.401Z'),
+        }))
+      }
+    }
+
+    const fixture = TestBed.createComponent(MyCmp)
+    fixture.detectChanges()
+
+    const debugElement = fixture.debugElement
+
+    expect(
+      debugElement.query(By.css('p#displayStoreVal')).nativeElement.textContent,
+    ).toContain(new Date('2025-03-29T21:06:30.401Z'))
+
+    debugElement
+      .query(By.css('button#updateDate'))
+      .triggerEventHandler('click', null)
+
+    fixture.detectChanges()
+    expect(
+      debugElement.query(By.css('p#displayStoreVal')).nativeElement.textContent,
+    ).toContain(new Date('2025-03-29T21:06:40.401Z'))
+  })
+})

packages/react-store/src/index.ts

@@ -61,6 +61,11 @@ export function shallow<T>(objA: T, objB: T) {
     return true
   }
 
+  if (objA instanceof Date && objB instanceof Date) {
+    if (objA.getTime() !== objB.getTime()) return false
+    return true
+  }
+
   const keysA = Object.keys(objA)
   if (keysA.length !== Object.keys(objB).length) {
     return false

packages/react-store/tests/index.test.tsx

@@ -187,4 +187,16 @@ describe('shallow', () => {
     const objB = new Set([2])
     expect(shallow(objA, objB)).toBe(false)
   })
+
+  test('should return false for dates with different values', () => {
+    const objA = new Date('2025-04-10T14:48:00')
+    const objB = new Date('2025-04-10T14:58:00')
+    expect(shallow(objA, objB)).toBe(false)
+  })
+
+  test('should return true for equal dates', () => {
+    const objA = new Date('2025-02-10')
+    const objB = new Date('2025-02-10')
+    expect(shallow(objA, objB)).toBe(true)
+  })
 })

packages/solid-store/tests/index.test.tsx

@@ -42,4 +42,14 @@ describe('useStore', () => {
 
     expect(result()).toBe(1)
   })
+
+  it('updates when date changes', () => {
+    const store = new Store(new Date('2025-03-29T21:06:30.401Z'))
+
+    const { result } = renderHook(() => useStore(store))
+
+    store.setState(() => new Date('2025-03-29T21:06:40.401Z'))
+
+    expect(result()).toStrictEqual(new Date('2025-03-29T21:06:40.401Z'))
+  })
 })

packages/svelte-store/src/index.svelte.ts

@@ -70,6 +70,11 @@ export function shallow<T>(objA: T, objB: T) {
     return true
   }
 
+  if (objA instanceof Date && objB instanceof Date) {
+    if (objA.getTime() !== objB.getTime()) return false
+    return true
+  }
+
   const keysA = Object.keys(objA)
   if (keysA.length !== Object.keys(objB).length) {
     return false

packages/svelte-store/tests/index.test.ts

@@ -79,4 +79,16 @@ describe('shallow', () => {
     // @ts-expect-error testing invalid input
     expect(shallow(objA, objB)).toBe(false)
   })
+
+  test('should return false for dates with different values', () => {
+    const objA = new Date('2025-04-10T14:48:00')
+    const objB = new Date('2025-04-10T14:58:00')
+    expect(shallow(objA, objB)).toBe(false)
+  })
+
+  test('should return true for equal dates', () => {
+    const objA = new Date('2025-02-10')
+    const objB = new Date('2025-02-10')
+    expect(shallow(objA, objB)).toBe(true)
+  })
 })

packages/vue-store/src/index.ts

@@ -74,6 +74,11 @@ export function shallow<T>(objA: T, objB: T) {
     return true
   }
 
+  if (objA instanceof Date && objB instanceof Date) {
+    if (objA.getTime() !== objB.getTime()) return false
+    return true
+  }
+
   const keysA = Object.keys(objA)
   if (keysA.length !== Object.keys(objB).length) {
     return false

packages/vue-store/tests/index.test.tsx

@@ -156,4 +156,16 @@ describe('shallow', () => {
     const objB = new Set([2])
     expect(shallow(objA, objB)).toBe(false)
   })
+
+  test('should return false for dates with different values', () => {
+    const objA = new Date('2025-04-10T14:48:00')
+    const objB = new Date('2025-04-10T14:58:00')
+    expect(shallow(objA, objB)).toBe(false)
+  })
+
+  test('should return true for equal dates', () => {
+    const objA = new Date('2025-02-10')
+    const objB = new Date('2025-02-10')
+    expect(shallow(objA, objB)).toBe(true)
+  })
 })