Cached maps (useFacetMemo) can return values before any subscription (#139)

* Cached maps can return values before any subscription

* Update packages/@react-facet/core/src/mapFacets/mapFacets.spec.ts

Co-authored-by: Marlon <[email protected]>

* Update packages/@react-facet/core/src/mapFacets/mapFacets.spec.ts

---------

Co-authored-by: Marlon <[email protected]>

Author: pirelenito

packages/@react-facet/core/src/mapFacets/mapFacetArrayCached.ts

@@ -9,9 +9,25 @@ export function mapFacetArrayCached<M>(
 ): Facet<M> {
   const initialValues = facets.map((facet) => facet.get())
   const hasAllValues = initialValues.reduce<boolean>((prev, curr) => prev && curr !== NO_VALUE, true)
-  return createFacet<M>({
+  const cachedFacet = createFacet<M>({
     // pass the equalityCheck to the mapIntoObserveArray to prevent even triggering the observable
     startSubscription: mapIntoObserveArray(facets, fn, equalityCheck),
     initialValue: hasAllValues ? fn(...initialValues) : NO_VALUE,
   })
+
+  return {
+    get: () => {
+      const cachedValue = cachedFacet.get()
+      if (cachedValue !== NO_VALUE) return cachedValue
+
+      const dependencyValues = facets.map((facet) => facet.get())
+      const hasAllValues = dependencyValues.reduce<boolean>((acc, value) => acc && value !== NO_VALUE, true)
+      if (!hasAllValues) return NO_VALUE
+
+      const mappedValue = fn(...dependencyValues)
+      if (mappedValue !== NO_VALUE) cachedFacet.set(mappedValue)
+      return mappedValue
+    },
+    observe: cachedFacet.observe,
+  }
 }

packages/@react-facet/core/src/mapFacets/mapFacetArrayLightweight.ts

@@ -8,11 +8,11 @@ export function mapFacetArrayLightweight<M>(
 ): Facet<M> {
   return {
     get: () => {
-      const values = facets.map((facet) => facet.get())
-      const hasAllValues = values.reduce<boolean>((acc, value) => acc && value !== NO_VALUE, true)
+      const dependencyValues = facets.map((facet) => facet.get())
+      const hasAllValues = dependencyValues.reduce<boolean>((acc, value) => acc && value !== NO_VALUE, true)
       if (!hasAllValues) return NO_VALUE
 
-      return fn(...values)
+      return fn(...dependencyValues)
     },
     observe: mapIntoObserveArray(facets, fn, equalityCheck),
   }

packages/@react-facet/core/src/mapFacets/mapFacetSingleCached.ts

@@ -3,14 +3,29 @@ import { mapIntoObserveSingle } from './mapIntoObserveSingle'
 import { createFacet } from '../facet'
 
 export function mapFacetSingleCached<T, M>(
-  facets: Facet<T>,
+  facet: Facet<T>,
   fn: (value: T) => M | NoValue,
   equalityCheck?: EqualityCheck<M>,
 ): Facet<M> {
-  const initialValue = facets.get()
-  return createFacet<M>({
+  const initialValue = facet.get()
+  const cachedFacet = createFacet<M>({
     // pass the equalityCheck to the mapIntoObserveSingle to prevent even triggering the observable
-    startSubscription: mapIntoObserveSingle(facets, fn, equalityCheck),
+    startSubscription: mapIntoObserveSingle(facet, fn, equalityCheck),
     initialValue: initialValue !== NO_VALUE ? fn(initialValue) : NO_VALUE,
   })
+
+  return {
+    get: () => {
+      const cachedValue = cachedFacet.get()
+      if (cachedValue !== NO_VALUE) return cachedValue
+
+      const dependencyValue = facet.get()
+      if (dependencyValue === NO_VALUE) return NO_VALUE
+
+      const mappedValue = fn(dependencyValue)
+      if (mappedValue !== NO_VALUE) cachedFacet.set(mappedValue)
+      return mappedValue
+    },
+    observe: cachedFacet.observe,
+  }
 }

packages/@react-facet/core/src/mapFacets/mapFacetSingleLightweight.ts

@@ -8,10 +8,10 @@ export function mapFacetSingleLightweight<T, M>(
 ): Facet<M> {
   return {
     get: () => {
-      const value = facet.get()
-      if (value === NO_VALUE) return NO_VALUE
+      const dependencyValue = facet.get()
+      if (dependencyValue === NO_VALUE) return NO_VALUE
 
-      return fn(value)
+      return fn(dependencyValue)
     },
 
     observe: mapIntoObserveSingle(facet, fn, equalityCheck),

packages/@react-facet/core/src/mapFacets/mapFacets.spec.ts

@@ -124,6 +124,67 @@ describe('mapFacetsCached WITH an initial value', () => {
     // check that the map was called just once
     expect(mapFunction).toHaveBeenCalledTimes(1)
   })
+
+  it('gets NO_VALUE as a value from a single source if it also has NO_VALUE', () => {
+    const mapFunction = jest.fn().mockReturnValue('dummy')
+    const sourceFacet = createFacet({ initialValue: NO_VALUE })
+    const mapFacet = mapFacetsCached([sourceFacet], mapFunction, () => () => false)
+
+    expect(mapFacet.get()).toBe(NO_VALUE)
+  })
+
+  it('gets NO_VALUE as a value from multiple sources if they also have NO_VALUE', () => {
+    const mapFunction = jest.fn().mockReturnValue('dummy')
+    const sourceAFacet = createFacet({ initialValue: 'initial value' })
+    const sourceBFacet = createFacet({ initialValue: NO_VALUE })
+    const mapFacet = mapFacetsCached([sourceAFacet, sourceBFacet], mapFunction, () => () => false)
+
+    expect(mapFacet.get()).toBe(NO_VALUE)
+  })
+
+  it('can get the mapped value from a single source before any subscription', () => {
+    const mapFunction = jest.fn().mockReturnValue('dummy')
+    const sourceFacet = createFacet({ initialValue: 'initial value' })
+    const mapFacet = mapFacetsCached([sourceFacet], mapFunction, () => () => false)
+
+    expect(mapFacet.get()).toBe('dummy')
+  })
+
+  it('can get the mapped value from multiple sources before any subscription', () => {
+    const mapFunction = jest.fn().mockReturnValue('dummy')
+    const sourceAFacet = createFacet({ initialValue: 'initial value' })
+    const sourceBFacet = createFacet({ initialValue: 'initial value' })
+    const mapFacet = mapFacetsCached([sourceAFacet, sourceBFacet], mapFunction, () => () => false)
+
+    expect(mapFacet.get()).toBe('dummy')
+  })
+
+  it('caches calls to the mapFunction through a get call before any subscription, given a single source', () => {
+    const mapFunction = jest.fn().mockReturnValue('dummy')
+    const sourceFacet = createFacet({ initialValue: 'initial value' })
+    const mapFacet = mapFacetsCached([sourceFacet], mapFunction, () => () => false)
+
+    expect(mapFacet.get()).toBe('dummy')
+    expect(mapFunction).toHaveBeenCalledTimes(1)
+
+    mapFunction.mockClear()
+    expect(mapFacet.get()).toBe('dummy')
+    expect(mapFunction).not.toHaveBeenCalled()
+  })
+
+  it('caches calls to the mapFunction through a get call before any subscription, given multiple sources', () => {
+    const mapFunction = jest.fn().mockReturnValue('dummy')
+    const sourceAFacet = createFacet({ initialValue: 'initial value' })
+    const sourceBFacet = createFacet({ initialValue: 'initial value' })
+    const mapFacet = mapFacetsCached([sourceAFacet, sourceBFacet], mapFunction, () => () => false)
+
+    expect(mapFacet.get()).toBe('dummy')
+    expect(mapFunction).toHaveBeenCalledTimes(1)
+
+    mapFunction.mockClear()
+    expect(mapFacet.get()).toBe('dummy')
+    expect(mapFunction).not.toHaveBeenCalled()
+  })
 })
 
 describe('mapFacetsLightweight', () => {