Skip to content

Commit

Permalink
Rework uSES init to not rely on module initialization order
Browse files Browse the repository at this point in the history
The previous attempt worked fine in local dev + tests, but failed
when built and run in a real app.
  • Loading branch information
markerikson committed Nov 20, 2021
1 parent 268e3d1 commit e0c5c3d
Show file tree
Hide file tree
Showing 6 changed files with 31 additions and 26 deletions.
6 changes: 4 additions & 2 deletions src/alternate-renderers.ts
Original file line number Diff line number Diff line change
Expand Up @@ -6,9 +6,11 @@
import { useSyncExternalStore } from 'use-sync-external-store/shim'
import { useSyncExternalStoreWithSelector } from 'use-sync-external-store/shim/with-selector'

import { setSyncFunctions } from './utils/useSyncExternalStore'
import { initializeUseSelector } from './hooks/useSelector'
import { initializeConnect } from './components/connect'

setSyncFunctions(useSyncExternalStore, useSyncExternalStoreWithSelector)
initializeUseSelector(useSyncExternalStoreWithSelector)
initializeConnect(useSyncExternalStore)

import { getBatch } from './utils/batch'

Expand Down
7 changes: 5 additions & 2 deletions src/compat.ts
Original file line number Diff line number Diff line change
Expand Up @@ -5,11 +5,14 @@
import { useSyncExternalStore } from 'use-sync-external-store/shim'
import { useSyncExternalStoreWithSelector } from 'use-sync-external-store/shim/with-selector'

import { setSyncFunctions } from './utils/useSyncExternalStore'
import { unstable_batchedUpdates as batch } from './utils/reactBatchedUpdates'
import { setBatch } from './utils/batch'

setSyncFunctions(useSyncExternalStore, useSyncExternalStoreWithSelector)
import { initializeUseSelector } from './hooks/useSelector'
import { initializeConnect } from './components/connect'

initializeUseSelector(useSyncExternalStoreWithSelector)
initializeConnect(useSyncExternalStore)

// Enable batched updates in our subscriptions for use
// with standard React renderers (ReactDOM, React Native)
Expand Down
9 changes: 7 additions & 2 deletions src/components/connect.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -28,7 +28,6 @@ import defaultMergePropsFactories from '../connect/mergeProps'

import { createSubscription, Subscription } from '../utils/Subscription'
import { useIsomorphicLayoutEffect } from '../utils/useIsomorphicLayoutEffect'
import { getSyncFunctions } from '../utils/useSyncExternalStore'
import shallowEqual from '../utils/shallowEqual'

import {
Expand All @@ -37,7 +36,13 @@ import {
ReactReduxContextInstance,
} from './Context'

const [useSyncExternalStore] = getSyncFunctions()
import type { uSES } from '../utils/useSyncExternalStore'
import { notInitialized } from '../utils/useSyncExternalStore'

let useSyncExternalStore = notInitialized as uSES
export const initializeConnect = (fn: uSES) => {
useSyncExternalStore = fn
}

// Define some constant arrays just to avoid re-creating these
const EMPTY_ARRAY: [unknown, number] = [null, 0]
Expand Down
8 changes: 6 additions & 2 deletions src/hooks/useSelector.ts
Original file line number Diff line number Diff line change
Expand Up @@ -2,10 +2,14 @@ import { useContext, useDebugValue } from 'react'

import { useReduxContext as useDefaultReduxContext } from './useReduxContext'
import { ReactReduxContext } from '../components/Context'
import { getSyncFunctions } from '../utils/useSyncExternalStore'
import type { DefaultRootState, EqualityFn } from '../types'
import type { uSESWS } from '../utils/useSyncExternalStore'
import { notInitialized } from '../utils/useSyncExternalStore'

const [, useSyncExternalStoreWithSelector] = getSyncFunctions()
let useSyncExternalStoreWithSelector = notInitialized as uSESWS
export const initializeUseSelector = (fn: uSESWS) => {
useSyncExternalStoreWithSelector = fn
}

const refEquality: EqualityFn<any> = (a, b) => a === b

Expand Down
7 changes: 5 additions & 2 deletions src/index.ts
Original file line number Diff line number Diff line change
Expand Up @@ -7,11 +7,14 @@
import { useSyncExternalStore } from 'react'
import { useSyncExternalStoreWithSelector } from 'use-sync-external-store/with-selector'

import { setSyncFunctions } from './utils/useSyncExternalStore'
import { unstable_batchedUpdates as batch } from './utils/reactBatchedUpdates'
import { setBatch } from './utils/batch'

setSyncFunctions(useSyncExternalStore, useSyncExternalStoreWithSelector)
import { initializeUseSelector } from './hooks/useSelector'
import { initializeConnect } from './components/connect'

initializeUseSelector(useSyncExternalStoreWithSelector)
initializeConnect(useSyncExternalStore)

// Enable batched updates in our subscriptions for use
// with standard React renderers (ReactDOM, React Native)
Expand Down
20 changes: 4 additions & 16 deletions src/utils/useSyncExternalStore.ts
Original file line number Diff line number Diff line change
@@ -1,21 +1,9 @@
import type { useSyncExternalStore } from 'use-sync-external-store'
import type { useSyncExternalStoreWithSelector } from 'use-sync-external-store/with-selector'

const notInitialized = () => {
throw new Error('Not initialize!')
export const notInitialized = () => {
throw new Error('uSES not initialized!')
}

let uSES: typeof useSyncExternalStore = notInitialized
let uSESWS: typeof useSyncExternalStoreWithSelector = notInitialized

// Allow injecting the actual functions from the entry points
export const setSyncFunctions = (
sync: typeof useSyncExternalStore,
withSelector: typeof useSyncExternalStoreWithSelector
) => {
uSES = sync
uSESWS = withSelector
}

// Supply a getter just to skip dealing with ESM bindings
export const getSyncFunctions = () => [uSES, uSESWS] as const
export type uSES = typeof useSyncExternalStore
export type uSESWS = typeof useSyncExternalStoreWithSelector

0 comments on commit e0c5c3d

Please sign in to comment.