reselect-kit 1.0.0

package/src/__tests__/createSequenceSelector.test.ts

@@ -0,0 +1,62 @@
+import { describe, expect, test, vi } from 'vitest';
+import { createSelector } from '@veksa/reselect';
+import { commonState, State } from '../__data__/state';
+import { createSequenceSelector } from '../createSequenceSelector';
+
+describe('createSequenceSelector', () => {
+  test('combines input selector results into an ordered array', () => {
+    const selector = createSequenceSelector<State, number | undefined>([
+      (state) => state.persons.currentPersonId,
+      (state) => state.messages.currentMessageId,
+    ]);
+
+    expect(selector(commonState)).toEqual([1, 200]);
+  });
+
+  test('memoizes the result while inputs are unchanged', () => {
+    const selector = createSequenceSelector<State, number | undefined>([
+      (state) => state.persons.currentPersonId,
+    ]);
+
+    const first = selector(commonState);
+    const second = selector(commonState);
+
+    expect(second).toBe(first);
+  });
+
+  test('recomputes when an input selector result changes', () => {
+    const selector = createSequenceSelector<State, number | undefined>([
+      (state) => state.persons.currentPersonId,
+    ]);
+
+    const first = selector(commonState);
+    const nextState: State = {
+      ...commonState,
+      persons: { ...commonState.persons, currentPersonId: 2 },
+    };
+    const second = selector(nextState);
+
+    expect(second).not.toBe(first);
+    expect(second).toEqual([2]);
+  });
+
+  test('passes props through to parametric input selectors', () => {
+    const selector = createSequenceSelector<State, { personId: number }, number>([
+      (_state, props) => props.personId,
+      (state) => state.persons.currentPersonId ?? 0,
+    ]);
+
+    expect(selector(commonState, { personId: 7 })).toEqual([7, 1]);
+  });
+
+  test('uses the provided selector creator', () => {
+    const selectorCreator = vi.fn(createSelector);
+
+    createSequenceSelector<State, number | undefined>(
+      [(state) => state.persons.currentPersonId],
+      selectorCreator as unknown as typeof createSelector,
+    );
+
+    expect(selectorCreator).toHaveBeenCalledTimes(1);
+  });
+});

package/src/_helpers/__tests__/arePathsEqual.test.ts

@@ -0,0 +1,27 @@
+import { arePathsEqual } from '../arePathsEqual';
+
+describe('arePathsEqual', () => {
+  test('should return false if paths have different length', () => {
+    const path = ['first', 'second'];
+    const anotherPath = ['123'];
+
+    const actual = arePathsEqual(path, anotherPath);
+    expect(actual).toBeFalsy();
+  });
+
+  test('should return false if paths have different elements', () => {
+    const path = ['first', 'second'];
+    const anotherPath = ['first', 'third'];
+
+    const actual = arePathsEqual(path, anotherPath);
+    expect(actual).toBeFalsy();
+  });
+
+  test('should return true if paths have equal elements', () => {
+    const path = ['first', 'second'];
+    const anotherPath = ['first', 'second'];
+
+    const actual = arePathsEqual(path, anotherPath);
+    expect(actual).toBeTruthy();
+  });
+});

package/src/_helpers/__tests__/getObjectPaths.test.ts

@@ -0,0 +1,56 @@
+import { getObjectPaths } from '../getObjectPaths';
+
+describe('getObjectPaths', () => {
+  test('should extract keys from object', () => {
+    const obj = {
+      key1: 1,
+      key2: 'sting',
+      key3: true,
+      key4: undefined,
+      key5: null,
+    };
+
+    const actual = getObjectPaths(obj);
+
+    expect(actual).toEqual([['key1'], ['key2'], ['key3'], ['key4'], ['key5']]);
+  });
+
+  test('should extract keys from nested object', () => {
+    const obj = {
+      key1: {
+        key2: {
+          key3: undefined,
+        },
+        key4: {
+          key5: 1,
+        },
+        key6: {
+          key7: 'sting',
+          key8: null,
+        },
+      },
+    };
+
+    const actual = getObjectPaths(obj);
+
+    expect(actual).toEqual([
+      ['key1', 'key2', 'key3'],
+      ['key1', 'key4', 'key5'],
+      ['key1', 'key6', 'key7'],
+      ['key1', 'key6', 'key8'],
+    ]);
+  });
+
+  test('should work with array', () => {
+    const obj = {
+      key1: [{ key2: { key3: [1] } }, 2],
+    };
+
+    const actual = getObjectPaths(obj);
+
+    expect(actual).toEqual([
+      ['key1', '0', 'key2', 'key3', '0'],
+      ['key1', '1'],
+    ]);
+  });
+});

package/src/_helpers/__tests__/temporaryAssign.test.ts

@@ -0,0 +1,59 @@
+import { temporaryAssign } from '../temporaryAssign';
+
+describe('temporaryAssign', () => {
+  test('should delete field if it was not in target object', () => {
+    const target = {
+      field1: 'some value',
+    };
+    const source = {
+      field1: 'another value',
+      field2: 'second value',
+    };
+
+    const { rollback } = temporaryAssign(target, source);
+
+    const expected = {
+      field1: 'another value',
+      field2: 'second value',
+    };
+
+    expect(target).toEqual(expected);
+
+    rollback();
+
+    const rollbackExpected = {
+      field1: 'some value',
+    };
+
+    expect(target).toEqual(rollbackExpected);
+  });
+
+  test('should set undefined field if field was undefined in target object', () => {
+    const target = {
+      field1: 'some value',
+      field2: undefined,
+    } as Record<string, unknown>;
+    const source = {
+      field1: 'another value',
+      field2: 'second value',
+    };
+
+    const { rollback } = temporaryAssign(target, source);
+
+    const expected = {
+      field1: 'another value',
+      field2: 'second value',
+    };
+
+    expect(target).toEqual(expected);
+
+    rollback();
+
+    const rollbackExpected = {
+      field1: 'some value',
+      field2: undefined,
+    } as Record<string, unknown>;
+
+    expect(target).toEqual(rollbackExpected);
+  });
+});

package/src/_helpers/arePathsEqual.ts

@@ -0,0 +1,15 @@
+import { Path } from '../types';
+
+export const arePathsEqual = (path: Path, anotherPath: Path) => {
+  if (path.length !== anotherPath.length) {
+    return false;
+  }
+
+  for (let i = 0; i < path.length; i += 1) {
+    if (path[i] !== anotherPath[i]) {
+      return false;
+    }
+  }
+
+  return true;
+};

package/src/_helpers/defineDynamicSelectorName.ts

@@ -0,0 +1,10 @@
+export const defineDynamicSelectorName = (selector: unknown, selectorNameGetter: () => string) => {
+  let overriddenSelectorName: string;
+  Object.defineProperty(selector, 'selectorName', {
+    configurable: true,
+    get: () => overriddenSelectorName ?? selectorNameGetter(),
+    set: (value: string) => {
+      overriddenSelectorName = value;
+    },
+  });
+};

package/src/_helpers/generateSelectorKey.ts

@@ -0,0 +1,15 @@
+import { stringifyFunction } from './stringifyFunction';
+
+export const generateSelectorKey = (selector: unknown) => {
+  const dependencies = (selector as { dependencies?: unknown[] }).dependencies ?? [];
+
+  let result = stringifyFunction(selector);
+
+  for (let i = dependencies.length - 1; i >= 0; i -= 1) {
+    const dependency = dependencies[i];
+
+    result += stringifyFunction(dependency);
+  }
+
+  return result;
+};

package/src/_helpers/getObjectPaths.ts

@@ -0,0 +1,13 @@
+import { Path } from '../types';
+import { isObject } from './isObject';
+
+export const getObjectPaths = (value: unknown, parentPath: Path = []): Path[] => {
+  if (!isObject(value)) {
+    return [parentPath];
+  }
+
+  return Object.keys(value).reduce<Path[]>((result, key) => {
+    const paths = getObjectPaths(value[key], parentPath.concat([key]));
+    return result.concat(paths);
+  }, []);
+};

package/src/_helpers/getSelectorName.ts

@@ -0,0 +1,7 @@
+export const getSelectorName = (selector: { name: string; selectorName?: string }): string => {
+  if ('selectorName' in selector && selector.selectorName) {
+    return selector.selectorName;
+  }
+
+  return selector.name;
+};

package/src/_helpers/isCachedSelector.ts

@@ -0,0 +1,9 @@
+import { CachedSelector } from '../types';
+
+export const isCachedSelector = (selector: unknown): selector is CachedSelector => {
+  return (
+    selector instanceof Object &&
+    'keySelector' in selector &&
+    typeof (selector as CachedSelector).keySelector === 'function'
+  );
+};

package/src/_helpers/isObject.ts

@@ -0,0 +1,3 @@
+export const isObject = (value: unknown): value is Record<string, unknown> => {
+  return value !== null && typeof value === 'object';
+};

package/src/_helpers/stringifyFunction.ts

@@ -0,0 +1,3 @@
+export const stringifyFunction = (source: unknown) => {
+  return String(source).replace(/\s+/g, ' ').trim();
+};

package/src/_helpers/temporaryAssign.ts

@@ -0,0 +1,80 @@
+const noop = () => undefined;
+
+export function temporaryAssign(
+  target: Record<string, unknown>,
+  source: Record<string, unknown>,
+): {
+  result: Record<string, unknown>;
+  rollback: () => void;
+} {
+  if (typeof target !== 'object' || target === null) {
+    return {
+      result: source,
+      rollback: noop,
+    };
+  }
+
+  // Both containers and the closure are allocated only once something actually has
+  // to be restored. This runs on every call of every bound selector, and the usual
+  // case is a binding whose keys the target does not have — one entry in
+  // `deleteProps`, nothing in `temporary` — while a re-entrant call that finds the
+  // binding already applied changes nothing at all and can share `noop`.
+  let temporary: Record<string, unknown> | null = null;
+  let deleteProps: string[] | null = null;
+
+  for (const prop in source as unknown as object) {
+    if (Object.prototype.hasOwnProperty.call(source, prop)) {
+      const targetProp = target[prop];
+      const sourceProp = source[prop];
+
+      if (targetProp !== sourceProp) {
+        if (Object.prototype.hasOwnProperty.call(target, prop)) {
+          if (temporary === null) {
+            temporary = {};
+          }
+          temporary[prop] = targetProp;
+        } else {
+          if (deleteProps === null) {
+            deleteProps = [];
+          }
+          deleteProps.push(prop);
+        }
+
+        target[prop] = sourceProp;
+      }
+    }
+  }
+
+  if (temporary === null && deleteProps === null) {
+    return {
+      result: target,
+      rollback: noop,
+    };
+  }
+
+  const restore = temporary;
+  const remove = deleteProps;
+
+  const rollback = () => {
+    if (restore !== null) {
+      for (const prop in restore) {
+        if (Object.prototype.hasOwnProperty.call(restore, prop)) {
+          target[prop] = restore[prop];
+        }
+      }
+    }
+
+    if (remove !== null) {
+      for (const prop of remove) {
+        if (Object.prototype.hasOwnProperty.call(target, prop)) {
+          delete target[prop];
+        }
+      }
+    }
+  };
+
+  return {
+    result: target,
+    rollback,
+  };
+}

package/src/_hooks/__tests__/useMemoWith.test.ts

@@ -0,0 +1,31 @@
+import { describe, expect, test } from 'vitest';
+import { renderHook } from '@testing-library/react';
+import { useMemoWith } from '../useMemoWith';
+
+describe('useMemoWith', () => {
+  const byId = (a: { id: number }, b: { id: number }) => a.id === b.id;
+
+  test('keeps the previous value while the comparator reports equality', () => {
+    const { result, rerender } = renderHook(({ value }) => useMemoWith(value, byId), {
+      initialProps: { value: { id: 1, tag: 'a' } },
+    });
+
+    const first = result.current;
+    rerender({ value: { id: 1, tag: 'b' } });
+
+    expect(result.current).toBe(first);
+  });
+
+  test('updates the value when the comparator reports inequality', () => {
+    const { result, rerender } = renderHook(({ value }) => useMemoWith(value, byId), {
+      initialProps: { value: { id: 1 } },
+    });
+
+    const first = result.current;
+    const next = { id: 2 };
+    rerender({ value: next });
+
+    expect(result.current).not.toBe(first);
+    expect(result.current).toBe(next);
+  });
+});

package/src/_hooks/__tests__/useSelector.test.ts

@@ -0,0 +1,87 @@
+import { createElement, ReactNode } from 'react';
+import { describe, expect, test, vi } from 'vitest';
+import { renderHook } from '@testing-library/react';
+import { Provider } from '@veksa/react-redux';
+import { useSelector } from '../useSelector';
+
+// `children` is passed positionally (oxlint forbids it as a prop), so relax the
+// Provider's prop type to make `children` optional in the props object.
+const StoreProvider = Provider as unknown as (props: {
+  store: unknown;
+  children?: ReactNode;
+}) => ReactNode;
+
+type State = { count: number };
+
+const createMockStore = (state: State) => {
+  const listeners = new Set<() => void>();
+
+  const store = {
+    getState: () => state,
+    dispatch: (action: unknown) => action,
+    subscribe: (listener: () => void) => {
+      listeners.add(listener);
+      return () => listeners.delete(listener);
+    },
+    replaceReducer: () => undefined,
+  };
+
+  return store as unknown as never;
+};
+
+const wrapperWith =
+  (store: never) =>
+  ({ children }: { children: ReactNode }) =>
+    createElement(StoreProvider, { store }, children);
+
+describe('useSelector', () => {
+  const state: State = { count: 5 };
+
+  test('returns the selector result for the current state and props', () => {
+    const store = createMockStore(state);
+
+    const { result } = renderHook(
+      () =>
+        useSelector((s: State, props: { factor: number }) => s.count * props.factor, { factor: 2 }),
+      { wrapper: wrapperWith(store) },
+    );
+
+    expect(result.current).toBe(10);
+  });
+
+  test('stabilizes shallow-equal props between renders', () => {
+    const store = createMockStore(state);
+    const selector = vi.fn((s: State, props: { factor: number }) => s.count * props.factor);
+
+    const { rerender } = renderHook(({ props }) => useSelector(selector, props), {
+      wrapper: wrapperWith(store),
+      initialProps: { props: { factor: 2 } },
+    });
+
+    rerender({ props: { factor: 2 } });
+
+    const propsArgs = selector.mock.calls.map((call) => call[1]);
+    // A new-but-shallow-equal props object must not reach the selector as a new reference.
+    expect(new Set(propsArgs).size).toBe(1);
+  });
+
+  test('unfreezes frozen props before passing them to the selector', () => {
+    const store = createMockStore(state);
+    let receivedProps: { factor: number } | undefined;
+
+    renderHook(
+      () =>
+        useSelector(
+          (s: State, props: { factor: number }) => {
+            receivedProps = props;
+            return s.count;
+          },
+          Object.freeze({ factor: 2 }),
+        ),
+      { wrapper: wrapperWith(store) },
+    );
+
+    expect(Object.isFrozen(receivedProps)).toBe(false);
+    expect(receivedProps?.factor).toBe(2);
+  });
+});

package/src/_hooks/useMemoWith.ts

@@ -0,0 +1,11 @@
+import { useRef } from 'react';
+
+export const useMemoWith = <T>(value: T, comparator: (a: T, b: T) => boolean) => {
+  const ref = useRef<T>(value);
+
+  if (!comparator(value, ref.current)) {
+    ref.current = value;
+  }
+
+  return ref.current;
+};

package/src/_hooks/useSelector.ts

@@ -0,0 +1,34 @@
+import { shallowEqual, useSelector as useReduxSelector } from '@veksa/react-redux';
+import { useMemoWith } from './useMemoWith';
+import { useCallback, useMemo } from 'react';
+
+export function useSelector<S extends object, R>(selector: (state: S) => R): R;
+
+export function useSelector<S extends object, P, R>(
+  selector: (state: S, props: P) => R,
+  props: P,
+): R;
+
+export function useSelector(selector: Function, ...params: any[]) {
+  const props = params[0];
+  const memoizedProps = useMemoWith(props, shallowEqual);
+
+  // unfreeze props for performance optimization (see temporaryAssign.ts)
+  const unfrozenProps = useMemo(() => {
+    return Object.isFrozen(memoizedProps) ? { ...memoizedProps } : memoizedProps;
+  }, [memoizedProps]);
+
+  const memoizedPropsSelector = useCallback(
+    (state: unknown) => {
+      return selector(state, unfrozenProps);
+    },
+    [selector, unfrozenProps],
+  );
+
+  return useReduxSelector(memoizedPropsSelector, {
+    devModeChecks: {
+      stabilityCheck: 'never',
+      identityFunctionCheck: 'never',
+    },
+  });
+}

package/src/cache/TreeCache.ts

@@ -0,0 +1,126 @@
+import { FlatObjectCache, ICacheObject } from '@veksa/re-reselect';
+
+export type TreeCacheObjectOptions = {
+  cacheObjectCreator?: () => ICacheObject;
+};
+
+const normalizeKey = (key: unknown): unknown[] => (Array.isArray(key) ? key : [key]);
+
+class TreeCacheNode {
+  public cache?: ICacheObject;
+
+  public selectorFn?: unknown;
+}
+
+export class TreeCache implements ICacheObject {
+  private readonly cacheObjectCreator: () => ICacheObject;
+
+  private root: TreeCacheNode;
+
+  constructor(options: TreeCacheObjectOptions) {
+    this.cacheObjectCreator = options.cacheObjectCreator ?? (() => new FlatObjectCache());
+
+    const root = new TreeCacheNode();
+    root.cache = this.cacheObjectCreator();
+    this.root = root;
+  }
+
+  public clear() {
+    const root = new TreeCacheNode();
+    root.cache = this.cacheObjectCreator();
+    this.root = root;
+  }
+
+  public get(key: unknown) {
+    // A scalar key is the common case and `normalizeKey` would wrap it in a fresh
+    // array on every lookup. The tree walk for one level is a single cache read, so
+    // it is spelled out rather than allocated for.
+    if (!Array.isArray(key)) {
+      const cacheResponse: unknown = this.root.cache?.get(key);
+
+      return cacheResponse instanceof TreeCacheNode ? cacheResponse.selectorFn : undefined;
+    }
+
+    let currentNode = this.root;
+
+    for (let i = 0; i < key.length; i += 1) {
+      const item = key[i];
+      const cacheResponse: unknown = currentNode.cache?.get(item);
+
+      if (cacheResponse instanceof TreeCacheNode) {
+        currentNode = cacheResponse;
+      } else {
+        return undefined;
+      }
+    }
+
+    return currentNode.selectorFn;
+  }
+
+  public set(key: unknown, selectorFn: unknown) {
+    const keyPath = normalizeKey(key);
+    let currentNode = this.root;
+
+    for (let i = 0; i < keyPath.length; i += 1) {
+      const item = keyPath[i];
+
+      if (!currentNode.cache) {
+        currentNode.cache = this.cacheObjectCreator();
+      }
+
+      const cacheResponse: unknown = currentNode.cache.get(item);
+
+      if (cacheResponse instanceof TreeCacheNode) {
+        currentNode = cacheResponse;
+      } else {
+        const node = new TreeCacheNode();
+        currentNode.cache.set(item, node);
+        currentNode = node;
+      }
+    }
+
+    currentNode.selectorFn = selectorFn;
+  }
+
+  public remove(key: unknown) {
+    const keyPath = normalizeKey(key);
+    let currentNode = this.root;
+
+    for (let i = 0; i < keyPath.length; i += 1) {
+      const item = keyPath[i];
+      const cacheResponse: unknown = currentNode.cache?.get(item);
+
+      if (cacheResponse instanceof TreeCacheNode) {
+        currentNode = cacheResponse;
+      } else {
+        return;
+      }
+    }
+
+    currentNode.selectorFn = undefined;
+  }
+
+  /**
+   * Called by re-reselect on every cache operation, so neither the wrapping array
+   * nor the `every` callback is allocated here.
+   */
+  public isValidCacheKey(key: unknown) {
+    const rootCache = this.root.cache;
+
+    if (rootCache?.isValidCacheKey === undefined) {
+      return true;
+    }
+
+    if (!Array.isArray(key)) {
+      return rootCache.isValidCacheKey(key);
+    }
+
+    for (let i = 0; i < key.length; i += 1) {
+      if (!rootCache.isValidCacheKey(key[i])) {
+        return false;
+      }
+    }
+
+    return true;
+  }
+}