Skip to content

Commit

Permalink
Wire up the native API for useSyncExternalStore (#22237)
Browse files Browse the repository at this point in the history 
Adds useSyncExternalStore to the internal dispatcher, and exports
the native API from the React package without yet implementing it.
  • Loading branch information
@acdlite
acdlite committed Sep 7, 2021
1 parent 031abd2 commit 77912d9
Show file tree
Hide file tree
Showing 17 changed files with 311 additions and 61 deletions.
8 changes: 8 additions & 0 deletions packages/react-debug-tools/src/ReactDebugHooks.js
View file
Expand Up @@ -265,6 +265,13 @@ function useMutableSource<Source, Snapshot>(
return value;
}

function useSyncExternalStore<T>(
subscribe: (() => void) => () => void,
getSnapshot: () => T,
): T {
throw new Error('Not yet implemented');
}

function useTransition(): [boolean, (() => void) => void] {
// useTransition() composes multiple hooks internally.
// Advance the current hook index the same number of times
Expand Down Expand Up @@ -326,6 +333,7 @@ const Dispatcher: DispatcherType = {
useState,
useTransition,
useMutableSource,
useSyncExternalStore,
useDeferredValue,
useOpaqueIdentifier,
};
Expand Down
8 changes: 8 additions & 0 deletions packages/react-dom/src/server/ReactPartialRendererHooks.js
View file
Expand Up @@ -462,6 +462,13 @@ function useMutableSource<Source, Snapshot>(
return getSnapshot(source._source);
}

function useSyncExternalStore<T>(
subscribe: (() => void) => () => void,
getSnapshot: () => T,
): T {
throw new Error('Not yet implemented');
}

function useDeferredValue<T>(value: T): T {
resolveCurrentlyRenderingComponent();
return value;
Expand Down Expand Up @@ -514,6 +521,7 @@ export const Dispatcher: DispatcherType = {
useOpaqueIdentifier,
// Subscriptions are not setup in a server environment.
useMutableSource,
useSyncExternalStore,
};

if (enableCache) {
Expand Down
77 changes: 77 additions & 0 deletions packages/react-reconciler/src/ReactFiberHooks.new.js
View file
Expand Up @@ -1242,6 +1242,20 @@ function updateMutableSource<Source, Snapshot>(
return useMutableSource(hook, source, getSnapshot, subscribe);
}

function mountSyncExternalStore<T>(
subscribe: (() => void) => () => void,
getSnapshot: () => T,
): T {
throw new Error('Not yet implemented');
}

function updateSyncExternalStore<T>(
subscribe: (() => void) => () => void,
getSnapshot: () => T,
): T {
throw new Error('Not yet implemented');
}

function mountState<S>(
initialState: (() => S) | S,
): [S, Dispatch<BasicStateAction<S>>] {
Expand Down Expand Up @@ -2079,6 +2093,7 @@ export const ContextOnlyDispatcher: Dispatcher = {
useDeferredValue: throwInvalidHookError,
useTransition: throwInvalidHookError,
useMutableSource: throwInvalidHookError,
useSyncExternalStore: throwInvalidHookError,
useOpaqueIdentifier: throwInvalidHookError,

unstable_isNewReconciler: enableNewReconciler,
Expand All @@ -2104,6 +2119,7 @@ const HooksDispatcherOnMount: Dispatcher = {
useDeferredValue: mountDeferredValue,
useTransition: mountTransition,
useMutableSource: mountMutableSource,
useSyncExternalStore: mountSyncExternalStore,
useOpaqueIdentifier: mountOpaqueIdentifier,

unstable_isNewReconciler: enableNewReconciler,
Expand All @@ -2129,6 +2145,7 @@ const HooksDispatcherOnUpdate: Dispatcher = {
useDeferredValue: updateDeferredValue,
useTransition: updateTransition,
useMutableSource: updateMutableSource,
useSyncExternalStore: updateSyncExternalStore,
useOpaqueIdentifier: updateOpaqueIdentifier,

unstable_isNewReconciler: enableNewReconciler,
Expand All @@ -2154,6 +2171,7 @@ const HooksDispatcherOnRerender: Dispatcher = {
useDeferredValue: rerenderDeferredValue,
useTransition: rerenderTransition,
useMutableSource: updateMutableSource,
useSyncExternalStore: mountSyncExternalStore,
useOpaqueIdentifier: rerenderOpaqueIdentifier,

unstable_isNewReconciler: enableNewReconciler,
Expand Down Expand Up @@ -2302,6 +2320,14 @@ if (__DEV__) {
mountHookTypesDev();
return mountMutableSource(source, getSnapshot, subscribe);
},
useSyncExternalStore<T>(
subscribe: (() => void) => () => void,
getSnapshot: () => T,
): T {
currentHookNameInDev = 'useSyncExternalStore';
mountHookTypesDev();
return mountSyncExternalStore(subscribe, getSnapshot);
},
useOpaqueIdentifier(): OpaqueIDType | void {
currentHookNameInDev = 'useOpaqueIdentifier';
mountHookTypesDev();
Expand Down Expand Up @@ -2426,6 +2452,14 @@ if (__DEV__) {
updateHookTypesDev();
return mountMutableSource(source, getSnapshot, subscribe);
},
useSyncExternalStore<T>(
subscribe: (() => void) => () => void,
getSnapshot: () => T,
): T {
currentHookNameInDev = 'useSyncExternalStore';
updateHookTypesDev();
return mountSyncExternalStore(subscribe, getSnapshot);
},
useOpaqueIdentifier(): OpaqueIDType | void {
currentHookNameInDev = 'useOpaqueIdentifier';
updateHookTypesDev();
Expand Down Expand Up @@ -2550,6 +2584,14 @@ if (__DEV__) {
updateHookTypesDev();
return updateMutableSource(source, getSnapshot, subscribe);
},
useSyncExternalStore<T>(
subscribe: (() => void) => () => void,
getSnapshot: () => T,
): T {
currentHookNameInDev = 'useSyncExternalStore';
updateHookTypesDev();
return updateSyncExternalStore(subscribe, getSnapshot);
},
useOpaqueIdentifier(): OpaqueIDType | void {
currentHookNameInDev = 'useOpaqueIdentifier';
updateHookTypesDev();
Expand Down Expand Up @@ -2675,6 +2717,14 @@ if (__DEV__) {
updateHookTypesDev();
return updateMutableSource(source, getSnapshot, subscribe);
},
useSyncExternalStore<T>(
subscribe: (() => void) => () => void,
getSnapshot: () => T,
): T {
currentHookNameInDev = 'useSyncExternalStore';
updateHookTypesDev();
return updateSyncExternalStore(subscribe, getSnapshot);
},
useOpaqueIdentifier(): OpaqueIDType | void {
currentHookNameInDev = 'useOpaqueIdentifier';
updateHookTypesDev();
Expand Down Expand Up @@ -2813,6 +2863,15 @@ if (__DEV__) {
mountHookTypesDev();
return mountMutableSource(source, getSnapshot, subscribe);
},
useSyncExternalStore<T>(
subscribe: (() => void) => () => void,
getSnapshot: () => T,
): T {
currentHookNameInDev = 'useSyncExternalStore';
warnInvalidHookAccess();
mountHookTypesDev();
return mountSyncExternalStore(subscribe, getSnapshot);
},
useOpaqueIdentifier(): OpaqueIDType | void {
currentHookNameInDev = 'useOpaqueIdentifier';
warnInvalidHookAccess();
Expand Down Expand Up @@ -2952,6 +3011,15 @@ if (__DEV__) {
updateHookTypesDev();
return updateMutableSource(source, getSnapshot, subscribe);
},
useSyncExternalStore<T>(
subscribe: (() => void) => () => void,
getSnapshot: () => T,
): T {
currentHookNameInDev = 'useSyncExternalStore';
warnInvalidHookAccess();
updateHookTypesDev();
return updateSyncExternalStore(subscribe, getSnapshot);
},
useOpaqueIdentifier(): OpaqueIDType | void {
currentHookNameInDev = 'useOpaqueIdentifier';
warnInvalidHookAccess();
Expand Down Expand Up @@ -3092,6 +3160,15 @@ if (__DEV__) {
updateHookTypesDev();
return updateMutableSource(source, getSnapshot, subscribe);
},
useSyncExternalStore<T>(
subscribe: (() => void) => () => void,
getSnapshot: () => T,
): T {
currentHookNameInDev = 'useSyncExternalStore';
warnInvalidHookAccess();
updateHookTypesDev();
return updateSyncExternalStore(subscribe, getSnapshot);
},
useOpaqueIdentifier(): OpaqueIDType | void {
currentHookNameInDev = 'useOpaqueIdentifier';
warnInvalidHookAccess();
Expand Down
77 changes: 77 additions & 0 deletions packages/react-reconciler/src/ReactFiberHooks.old.js
View file
Expand Up @@ -1242,6 +1242,20 @@ function updateMutableSource<Source, Snapshot>(
return useMutableSource(hook, source, getSnapshot, subscribe);
}

function mountSyncExternalStore<T>(
subscribe: (() => void) => () => void,
getSnapshot: () => T,
): T {
throw new Error('Not yet implemented');
}

function updateSyncExternalStore<T>(
subscribe: (() => void) => () => void,
getSnapshot: () => T,
): T {
throw new Error('Not yet implemented');
}

function mountState<S>(
initialState: (() => S) | S,
): [S, Dispatch<BasicStateAction<S>>] {
Expand Down Expand Up @@ -2079,6 +2093,7 @@ export const ContextOnlyDispatcher: Dispatcher = {
useDeferredValue: throwInvalidHookError,
useTransition: throwInvalidHookError,
useMutableSource: throwInvalidHookError,
useSyncExternalStore: throwInvalidHookError,
useOpaqueIdentifier: throwInvalidHookError,

unstable_isNewReconciler: enableNewReconciler,
Expand All @@ -2104,6 +2119,7 @@ const HooksDispatcherOnMount: Dispatcher = {
useDeferredValue: mountDeferredValue,
useTransition: mountTransition,
useMutableSource: mountMutableSource,
useSyncExternalStore: mountSyncExternalStore,
useOpaqueIdentifier: mountOpaqueIdentifier,

unstable_isNewReconciler: enableNewReconciler,
Expand All @@ -2129,6 +2145,7 @@ const HooksDispatcherOnUpdate: Dispatcher = {
useDeferredValue: updateDeferredValue,
useTransition: updateTransition,
useMutableSource: updateMutableSource,
useSyncExternalStore: updateSyncExternalStore,
useOpaqueIdentifier: updateOpaqueIdentifier,

unstable_isNewReconciler: enableNewReconciler,
Expand All @@ -2154,6 +2171,7 @@ const HooksDispatcherOnRerender: Dispatcher = {
useDeferredValue: rerenderDeferredValue,
useTransition: rerenderTransition,
useMutableSource: updateMutableSource,
useSyncExternalStore: mountSyncExternalStore,
useOpaqueIdentifier: rerenderOpaqueIdentifier,

unstable_isNewReconciler: enableNewReconciler,
Expand Down Expand Up @@ -2302,6 +2320,14 @@ if (__DEV__) {
mountHookTypesDev();
return mountMutableSource(source, getSnapshot, subscribe);
},
useSyncExternalStore<T>(
subscribe: (() => void) => () => void,
getSnapshot: () => T,
): T {
currentHookNameInDev = 'useSyncExternalStore';
mountHookTypesDev();
return mountSyncExternalStore(subscribe, getSnapshot);
},
useOpaqueIdentifier(): OpaqueIDType | void {
currentHookNameInDev = 'useOpaqueIdentifier';
mountHookTypesDev();
Expand Down Expand Up @@ -2426,6 +2452,14 @@ if (__DEV__) {
updateHookTypesDev();
return mountMutableSource(source, getSnapshot, subscribe);
},
useSyncExternalStore<T>(
subscribe: (() => void) => () => void,
getSnapshot: () => T,
): T {
currentHookNameInDev = 'useSyncExternalStore';
updateHookTypesDev();
return mountSyncExternalStore(subscribe, getSnapshot);
},
useOpaqueIdentifier(): OpaqueIDType | void {
currentHookNameInDev = 'useOpaqueIdentifier';
updateHookTypesDev();
Expand Down Expand Up @@ -2550,6 +2584,14 @@ if (__DEV__) {
updateHookTypesDev();
return updateMutableSource(source, getSnapshot, subscribe);
},
useSyncExternalStore<T>(
subscribe: (() => void) => () => void,
getSnapshot: () => T,
): T {
currentHookNameInDev = 'useSyncExternalStore';
updateHookTypesDev();
return updateSyncExternalStore(subscribe, getSnapshot);
},
useOpaqueIdentifier(): OpaqueIDType | void {
currentHookNameInDev = 'useOpaqueIdentifier';
updateHookTypesDev();
Expand Down Expand Up @@ -2675,6 +2717,14 @@ if (__DEV__) {
updateHookTypesDev();
return updateMutableSource(source, getSnapshot, subscribe);
},
useSyncExternalStore<T>(
subscribe: (() => void) => () => void,
getSnapshot: () => T,
): T {
currentHookNameInDev = 'useSyncExternalStore';
updateHookTypesDev();
return updateSyncExternalStore(subscribe, getSnapshot);
},
useOpaqueIdentifier(): OpaqueIDType | void {
currentHookNameInDev = 'useOpaqueIdentifier';
updateHookTypesDev();
Expand Down Expand Up @@ -2813,6 +2863,15 @@ if (__DEV__) {
mountHookTypesDev();
return mountMutableSource(source, getSnapshot, subscribe);
},
useSyncExternalStore<T>(
subscribe: (() => void) => () => void,
getSnapshot: () => T,
): T {
currentHookNameInDev = 'useSyncExternalStore';
warnInvalidHookAccess();
mountHookTypesDev();
return mountSyncExternalStore(subscribe, getSnapshot);
},
useOpaqueIdentifier(): OpaqueIDType | void {
currentHookNameInDev = 'useOpaqueIdentifier';
warnInvalidHookAccess();
Expand Down Expand Up @@ -2952,6 +3011,15 @@ if (__DEV__) {
updateHookTypesDev();
return updateMutableSource(source, getSnapshot, subscribe);
},
useSyncExternalStore<T>(
subscribe: (() => void) => () => void,
getSnapshot: () => T,
): T {
currentHookNameInDev = 'useSyncExternalStore';
warnInvalidHookAccess();
updateHookTypesDev();
return updateSyncExternalStore(subscribe, getSnapshot);
},
useOpaqueIdentifier(): OpaqueIDType | void {
currentHookNameInDev = 'useOpaqueIdentifier';
warnInvalidHookAccess();
Expand Down Expand Up @@ -3092,6 +3160,15 @@ if (__DEV__) {
updateHookTypesDev();
return updateMutableSource(source, getSnapshot, subscribe);
},
useSyncExternalStore<T>(
subscribe: (() => void) => () => void,
getSnapshot: () => T,
): T {
currentHookNameInDev = 'useSyncExternalStore';
warnInvalidHookAccess();
updateHookTypesDev();
return updateSyncExternalStore(subscribe, getSnapshot);
},
useOpaqueIdentifier(): OpaqueIDType | void {
currentHookNameInDev = 'useOpaqueIdentifier';
warnInvalidHookAccess();
Expand Down
5 changes: 5 additions & 0 deletions packages/react-reconciler/src/ReactInternalTypes.js
View file
Expand Up @@ -41,6 +41,7 @@ export type HookType =
| 'useDeferredValue'
| 'useTransition'
| 'useMutableSource'
| 'useSyncExternalStore'
| 'useOpaqueIdentifier'
| 'useCacheRefresh';

Expand Down Expand Up @@ -304,6 +305,10 @@ export type Dispatcher = {|
getSnapshot: MutableSourceGetSnapshotFn<Source, Snapshot>,
subscribe: MutableSourceSubscribeFn<Source, Snapshot>,
): Snapshot,
useSyncExternalStore<T>(
subscribe: (() => void) => () => void,
getSnapshot: () => T,
): T,
useOpaqueIdentifier(): any,
useCacheRefresh?: () => <T>(?() => T, ?T) => void,

Expand Down

0 comments on commit 77912d9

Please sign in to comment.