[crud] Rename useResourceEffect flag (#32204)
Rename the flag in preparation for the overload. --- [//]: # (BEGIN SAPLING FOOTER) Stack created with [Sapling](https://sapling-scm.com). Best reviewed with [ReviewStack](https://reviewstack.dev/facebook/react/pull/32204). * #32206 * #32205 * __->__ #32204
lauren committed
Feb 11, 2025 at 14:05 UTC
0461c0d8a49730d1c8ebca2071d9bb7adfc8ac92
18 files changed
+56
-56
packages/react-dom/src/__tests__/ReactDOMServerIntegrationHooks-test.js
+1
-1
@@ -657,7 +657,7 @@ describe('ReactDOMServerHooks', () => {
657
658
describe('useResourceEffect', () => {
659
gate(flags => {
660
- if (flags.enableUseResourceEffectHook) {
660
+ if (flags.enableUseEffectCRUDOverload) {
661
const yields = [];
662
itRenders(
663
'should ignore resource effects on the server',
packages/react-reconciler/src/ReactFiberCallUserSpace.js
+3
-3
@@ -18,7 +18,7 @@ import {
18
ResourceEffectIdentityKind,
19
ResourceEffectUpdateKind,
20
} from './ReactFiberHooks';
21
-import {enableUseResourceEffectHook} from 'shared/ReactFeatureFlags';
21
+import {enableUseEffectCRUDOverload} from 'shared/ReactFeatureFlags';
22
23
// These indirections exists so we can exclude its stack frame in DEV (and anything below it).
24
// TODO: Consider marking the whole bundle instead of these boundaries.
@@ -184,11 +184,11 @@ const callCreate = {
184
'react-stack-bottom-frame': function (
185
effect: Effect,
186
): (() => void) | {...} | void | null {
187
- if (!enableUseResourceEffectHook) {
187
+ if (!enableUseEffectCRUDOverload) {
188
if (effect.resourceKind != null) {
189
if (__DEV__) {
190
console.error(
191
- 'Expected only SimpleEffects when enableUseResourceEffectHook is disabled, ' +
191
+ 'Expected only SimpleEffects when enableUseEffectCRUDOverload is disabled, ' +
192
'got %s',
193
effect.resourceKind,
194
);
packages/react-reconciler/src/ReactFiberCommitEffects.js
+8
-8
@@ -22,7 +22,7 @@ import {
22
enableProfilerCommitHooks,
23
enableProfilerNestedUpdatePhase,
24
enableSchedulingProfiler,
25
- enableUseResourceEffectHook,
25
+ enableUseEffectCRUDOverload,
26
enableViewTransition,
27
} from 'shared/ReactFeatureFlags';
28
import {
@@ -160,7 +160,7 @@ export function commitHookEffectListMount(
160
161
// Mount
162
let destroy;
163
- if (enableUseResourceEffectHook) {
163
+ if (enableUseEffectCRUDOverload) {
164
if (effect.resourceKind === ResourceEffectIdentityKind) {
165
if (__DEV__) {
166
effect.inst.resource = runWithFiberInDEV(
@@ -200,7 +200,7 @@ export function commitHookEffectListMount(
200
if ((flags & HookInsertion) !== NoHookEffect) {
201
setIsRunningInsertionEffect(true);
202
}
203
- if (enableUseResourceEffectHook) {
203
+ if (enableUseEffectCRUDOverload) {
204
if (effect.resourceKind == null) {
205
destroy = runWithFiberInDEV(
206
finishedWork,
@@ -219,7 +219,7 @@ export function commitHookEffectListMount(
219
setIsRunningInsertionEffect(false);
220
}
221
} else {
222
- if (enableUseResourceEffectHook) {
222
+ if (enableUseEffectCRUDOverload) {
223
if (effect.resourceKind == null) {
224
const create = effect.create;
225
const inst = effect.inst;
@@ -230,7 +230,7 @@ export function commitHookEffectListMount(
230
if (effect.resourceKind != null) {
231
if (__DEV__) {
232
console.error(
233
- 'Expected only SimpleEffects when enableUseResourceEffectHook is disabled, ' +
233
+ 'Expected only SimpleEffects when enableUseEffectCRUDOverload is disabled, ' +
234
'got %s',
235
effect.resourceKind,
236
);
@@ -262,7 +262,7 @@ export function commitHookEffectListMount(
262
} else if ((effect.tag & HookInsertion) !== NoFlags) {
263
hookName = 'useInsertionEffect';
264
} else if (
265
- enableUseResourceEffectHook &&
265
+ enableUseEffectCRUDOverload &&
266
effect.resourceKind != null
267
) {
268
hookName = 'useResourceEffect';
@@ -338,7 +338,7 @@ export function commitHookEffectListUnmount(
338
const inst = effect.inst;
339
const destroy = inst.destroy;
340
if (destroy !== undefined) {
341
- if (enableUseResourceEffectHook) {
341
+ if (enableUseEffectCRUDOverload) {
342
if (effect.resourceKind == null) {
343
inst.destroy = undefined;
344
}
@@ -358,7 +358,7 @@ export function commitHookEffectListUnmount(
358
setIsRunningInsertionEffect(true);
359
}
360
}
361
- if (enableUseResourceEffectHook) {
361
+ if (enableUseEffectCRUDOverload) {
362
if (
363
effect.resourceKind === ResourceEffectIdentityKind &&
364
effect.inst.resource != null
packages/react-reconciler/src/ReactFiberHooks.js
+12
-12
@@ -38,7 +38,7 @@ import {
38
enableSchedulingProfiler,
39
enableTransitionTracing,
40
enableUseEffectEventHook,
41
- enableUseResourceEffectHook,
41
+ enableUseEffectCRUDOverload,
42
enableLegacyCache,
43
disableLegacyMode,
44
enableNoCloningMemoCache,
@@ -3938,7 +3938,7 @@ export const ContextOnlyDispatcher: Dispatcher = {
3938
if (enableUseEffectEventHook) {
3939
(ContextOnlyDispatcher: Dispatcher).useEffectEvent = throwInvalidHookError;
3940
}
3941
-if (enableUseResourceEffectHook) {
3941
+if (enableUseEffectCRUDOverload) {
3942
(ContextOnlyDispatcher: Dispatcher).useResourceEffect = throwInvalidHookError;
3943
}
3944
@@ -3971,7 +3971,7 @@ const HooksDispatcherOnMount: Dispatcher = {
3971
if (enableUseEffectEventHook) {
3972
(HooksDispatcherOnMount: Dispatcher).useEffectEvent = mountEvent;
3973
}
3974
-if (enableUseResourceEffectHook) {
3974
+if (enableUseEffectCRUDOverload) {
3975
(HooksDispatcherOnMount: Dispatcher).useResourceEffect = mountResourceEffect;
3976
}
3977
@@ -4004,7 +4004,7 @@ const HooksDispatcherOnUpdate: Dispatcher = {
4004
if (enableUseEffectEventHook) {
4005
(HooksDispatcherOnUpdate: Dispatcher).useEffectEvent = updateEvent;
4006
}
4007
-if (enableUseResourceEffectHook) {
4007
+if (enableUseEffectCRUDOverload) {
4008
(HooksDispatcherOnUpdate: Dispatcher).useResourceEffect =
4009
updateResourceEffect;
4010
}
@@ -4038,7 +4038,7 @@ const HooksDispatcherOnRerender: Dispatcher = {
4038
if (enableUseEffectEventHook) {
4039
(HooksDispatcherOnRerender: Dispatcher).useEffectEvent = updateEvent;
4040
}
4041
-if (enableUseResourceEffectHook) {
4041
+if (enableUseEffectCRUDOverload) {
4042
(HooksDispatcherOnRerender: Dispatcher).useResourceEffect =
4043
updateResourceEffect;
4044
}
@@ -4242,7 +4242,7 @@ if (__DEV__) {
4242
return mountEvent(callback);
4243
};
4244
}
4245
- if (enableUseResourceEffectHook) {
4245
+ if (enableUseEffectCRUDOverload) {
4246
(HooksDispatcherOnMountInDEV: Dispatcher).useResourceEffect =
4247
function useResourceEffect(
4248
create: () => {...} | void | null,
@@ -4430,7 +4430,7 @@ if (__DEV__) {
4430
return mountEvent(callback);
4431
};
4432
}
4433
- if (enableUseResourceEffectHook) {
4433
+ if (enableUseEffectCRUDOverload) {
4434
(HooksDispatcherOnMountWithHookTypesInDEV: Dispatcher).useResourceEffect =
4435
function useResourceEffect(
4436
create: () => {...} | void | null,
@@ -4617,7 +4617,7 @@ if (__DEV__) {
4617
return updateEvent(callback);
4618
};
4619
}
4620
- if (enableUseResourceEffectHook) {
4620
+ if (enableUseEffectCRUDOverload) {
4621
(HooksDispatcherOnUpdateInDEV: Dispatcher).useResourceEffect =
4622
function useResourceEffect(
4623
create: () => {...} | void | null,
@@ -4804,7 +4804,7 @@ if (__DEV__) {
4804
return updateEvent(callback);
4805
};
4806
}
4807
- if (enableUseResourceEffectHook) {
4807
+ if (enableUseEffectCRUDOverload) {
4808
(HooksDispatcherOnRerenderInDEV: Dispatcher).useResourceEffect =
4809
function useResourceEffect(
4810
create: () => {...} | void | null,
@@ -5016,7 +5016,7 @@ if (__DEV__) {
5016
return mountEvent(callback);
5017
};
5018
}
5019
- if (enableUseResourceEffectHook) {
5019
+ if (enableUseEffectCRUDOverload) {
5020
(InvalidNestedHooksDispatcherOnMountInDEV: Dispatcher).useResourceEffect =
5021
function useResourceEffect(
5022
create: () => {...} | void | null,
@@ -5229,7 +5229,7 @@ if (__DEV__) {
5229
return updateEvent(callback);
5230
};
5231
}
5232
- if (enableUseResourceEffectHook) {
5232
+ if (enableUseEffectCRUDOverload) {
5233
(InvalidNestedHooksDispatcherOnUpdateInDEV: Dispatcher).useResourceEffect =
5234
function useResourceEffect(
5235
create: () => {...} | void | null,
@@ -5442,7 +5442,7 @@ if (__DEV__) {
5442
return updateEvent(callback);
5443
};
5444
}
5445
- if (enableUseResourceEffectHook) {
5445
+ if (enableUseEffectCRUDOverload) {
5446
(InvalidNestedHooksDispatcherOnRerenderInDEV: Dispatcher).useResourceEffect =
5447
function useResourceEffect(
5448
create: () => {...} | void | null,
packages/react-reconciler/src/ReactInternalTypes.js
+1
-1
@@ -396,7 +396,7 @@ export type Dispatcher = {
396
): void,
397
// TODO: Non-nullable once `enableUseEffectEventHook` is on everywhere.
398
useEffectEvent?: <Args, F: (...Array<Args>) => mixed>(callback: F) => F,
399
- // TODO: Non-nullable once `enableUseResourceEffectHook` is on everywhere.
399
+ // TODO: Non-nullable once `enableUseEffectCRUDOverload` is on everywhere.
400
useResourceEffect?: (
401
create: () => {...} | void | null,
402
createDeps: Array<mixed> | void | null,
packages/react-reconciler/src/__tests__/ReactHooksWithNoopRenderer-test.js
+16
-16
@@ -3311,7 +3311,7 @@ describe('ReactHooksWithNoopRenderer', () => {
3311
});
3312
});
3313
3314
- // @gate enableUseResourceEffectHook
3314
+ // @gate enableUseEffectCRUDOverload
3315
describe('useResourceEffect', () => {
3316
class Resource {
3317
isDeleted: false;
@@ -3333,12 +3333,12 @@ describe('ReactHooksWithNoopRenderer', () => {
3333
}
3334
}
3335
3336
- // @gate !enableUseResourceEffectHook
3336
+ // @gate !enableUseEffectCRUDOverload
3337
it('is null when flag is disabled', async () => {
3338
expect(useResourceEffect).toBeUndefined();
3339
});
3340
3341
- // @gate enableUseResourceEffectHook
3341
+ // @gate enableUseEffectCRUDOverload
3342
it('validates create return value', async () => {
3343
function App({id}) {
3344
useResourceEffect(() => {
@@ -3359,7 +3359,7 @@ describe('ReactHooksWithNoopRenderer', () => {
3359
);
3360
});
3361
3362
- // @gate enableUseResourceEffectHook
3362
+ // @gate enableUseEffectCRUDOverload
3363
it('validates non-empty update deps', async () => {
3364
function App({id}) {
3365
useResourceEffect(
@@ -3386,7 +3386,7 @@ describe('ReactHooksWithNoopRenderer', () => {
3386
]);
3387
});
3388
3389
- // @gate enableUseResourceEffectHook
3389
+ // @gate enableUseEffectCRUDOverload
3390
it('simple mount and update', async () => {
3391
function App({id, username}) {
3392
const opts = useMemo(() => {
@@ -3443,7 +3443,7 @@ describe('ReactHooksWithNoopRenderer', () => {
3443
assertLog(['destroy(2, Jack)']);
3444
});
3445
3446
- // @gate enableUseResourceEffectHook
3446
+ // @gate enableUseEffectCRUDOverload
3447
it('simple mount with no update', async () => {
3448
function App({id, username}) {
3449
const opts = useMemo(() => {
@@ -3480,7 +3480,7 @@ describe('ReactHooksWithNoopRenderer', () => {
3480
assertLog(['destroy(1, Jack)']);
3481
});
3482
3483
- // @gate enableUseResourceEffectHook
3483
+ // @gate enableUseEffectCRUDOverload
3484
it('calls update on every render if no deps are specified', async () => {
3485
function App({id, username}) {
3486
const opts = useMemo(() => {
@@ -3523,7 +3523,7 @@ describe('ReactHooksWithNoopRenderer', () => {
3523
assertLog(['update(2, Lauren)']);
3524
});
3525
3526
- // @gate enableUseResourceEffectHook
3526
+ // @gate enableUseEffectCRUDOverload
3527
it('does not unmount previous useResourceEffect between updates', async () => {
3528
function App({id}) {
3529
useResourceEffect(
@@ -3562,7 +3562,7 @@ describe('ReactHooksWithNoopRenderer', () => {
3562
assertLog(['update(0)']);
3563
});
3564
3565
- // @gate enableUseResourceEffectHook
3565
+ // @gate enableUseEffectCRUDOverload
3566
it('unmounts only on deletion', async () => {
3567
function App({id}) {
3568
useResourceEffect(
@@ -3596,7 +3596,7 @@ describe('ReactHooksWithNoopRenderer', () => {
3596
expect(ReactNoop).toMatchRenderedOutput(null);
3597
});
3598
3599
- // @gate enableUseResourceEffectHook
3599
+ // @gate enableUseEffectCRUDOverload
3600
it('unmounts on deletion', async () => {
3601
function Wrapper(props) {
3602
return <App {...props} />;
@@ -3650,7 +3650,7 @@ describe('ReactHooksWithNoopRenderer', () => {
3650
expect(ReactNoop).toMatchRenderedOutput(null);
3651
});
3652
3653
- // @gate enableUseResourceEffectHook
3653
+ // @gate enableUseEffectCRUDOverload
3654
it('handles errors in create on mount', async () => {
3655
function App({id}) {
3656
useResourceEffect(
@@ -3700,7 +3700,7 @@ describe('ReactHooksWithNoopRenderer', () => {
3700
expect(ReactNoop).toMatchRenderedOutput(null);
3701
});
3702
3703
- // @gate enableUseResourceEffectHook
3703
+ // @gate enableUseEffectCRUDOverload
3704
it('handles errors in create on update', async () => {
3705
function App({id}) {
3706
useResourceEffect(
@@ -3744,7 +3744,7 @@ describe('ReactHooksWithNoopRenderer', () => {
3744
}).rejects.toThrow('Oops error!');
3745
});
3746
3747
- // @gate enableUseResourceEffectHook
3747
+ // @gate enableUseEffectCRUDOverload
3748
it('handles errors in destroy on update', async () => {
3749
function App({id, username}) {
3750
const opts = useMemo(() => {
@@ -3800,7 +3800,7 @@ describe('ReactHooksWithNoopRenderer', () => {
3800
expect(ReactNoop).toMatchRenderedOutput(null);
3801
});
3802
3803
- // @gate enableUseResourceEffectHook && enableActivity
3803
+ // @gate enableUseEffectCRUDOverload && enableActivity
3804
it('composes with activity', async () => {
3805
function App({id, username}) {
3806
const opts = useMemo(() => {
@@ -3873,7 +3873,7 @@ describe('ReactHooksWithNoopRenderer', () => {
3873
assertLog(['destroy(0, Lauren)']);
3874
});
3875
3876
- // @gate enableUseResourceEffectHook
3876
+ // @gate enableUseEffectCRUDOverload
3877
it('composes with suspense', async () => {
3878
function TextBox({text}) {
3879
return <AsyncText text={text} ms={0} />;
@@ -3991,7 +3991,7 @@ describe('ReactHooksWithNoopRenderer', () => {
3991
);
3992
});
3993
3994
- // @gate enableUseResourceEffectHook
3994
+ // @gate enableUseEffectCRUDOverload
3995
it('composes with other kinds of effects', async () => {
3996
let rerender;
3997
function App({id, username}) {
packages/react-server/src/ReactFizzHooks.js
+2
-2
@@ -40,7 +40,7 @@ import {createFastHash} from './ReactServerStreamConfig';
40
41
import {
42
enableUseEffectEventHook,
43
- enableUseResourceEffectHook,
43
+ enableUseEffectCRUDOverload,
44
} from 'shared/ReactFeatureFlags';
45
import is from 'shared/objectIs';
46
import {
@@ -866,7 +866,7 @@ export const HooksDispatcher: Dispatcher = supportsClientAPIs
866
if (enableUseEffectEventHook) {
867
HooksDispatcher.useEffectEvent = useEffectEvent;
868
}
869
-if (enableUseResourceEffectHook) {
869
+if (enableUseEffectCRUDOverload) {
870
HooksDispatcher.useResourceEffect = supportsClientAPIs
871
? noop
872
: clientHookNotSupported;
packages/react/src/ReactClient.js
+2
-2
@@ -65,7 +65,7 @@ import {addTransitionType} from './ReactTransitionType';
65
import {act} from './ReactAct';
66
import {captureOwnerStack} from './ReactOwnerStack';
67
import * as ReactCompilerRuntime from './ReactCompilerRuntime';
68
-import {enableUseResourceEffectHook} from 'shared/ReactFeatureFlags';
68
+import {enableUseEffectCRUDOverload} from 'shared/ReactFeatureFlags';
69
70
const Children = {
71
map,
@@ -134,4 +134,4 @@ export {
134
};
135
136
export const experimental_useResourceEffect: typeof useResourceEffect | void =
137
- enableUseResourceEffectHook ? useResourceEffect : undefined;
137
+ enableUseEffectCRUDOverload ? useResourceEffect : undefined;
packages/react/src/ReactHooks.js
+2
-2
@@ -18,7 +18,7 @@ import {REACT_CONSUMER_TYPE} from 'shared/ReactSymbols';
18
19
import ReactSharedInternals from 'shared/ReactSharedInternals';
20
21
-import {enableUseResourceEffectHook} from 'shared/ReactFeatureFlags';
21
+import {enableUseEffectCRUDOverload} from 'shared/ReactFeatureFlags';
22
23
type BasicStateAction<S> = (S => S) | S;
24
type Dispatch<A> = A => void;
@@ -208,7 +208,7 @@ export function useResourceEffect(
208
updateDeps: Array<mixed> | void | null,
209
destroy: ((resource: {...} | void | null) => void) | void,
210
): void {
211
- if (!enableUseResourceEffectHook) {
211
+ if (!enableUseEffectCRUDOverload) {
212
throw new Error('Not implemented.');
213
}
214
const dispatcher = resolveDispatcher();
packages/shared/ReactFeatureFlags.js
+1
-1
@@ -150,7 +150,7 @@ export const enableInfiniteRenderLoopDetection = false;
150
/**
151
* Experimental new hook for better managing resources in effects.
152
*/
153
-export const enableUseResourceEffectHook = false;
153
+export const enableUseEffectCRUDOverload = false;
154
155
export const enableFastAddPropertiesInDiffing = true;
156
packages/shared/forks/ReactFeatureFlags.native-fb-dynamic.js
+1
-1
@@ -24,7 +24,7 @@ export const enablePersistedModeClonedFlag = __VARIANT__;
24
export const enableShallowPropDiffing = __VARIANT__;
25
export const passChildrenWhenCloningPersistedNodes = __VARIANT__;
26
export const enableSiblingPrerendering = __VARIANT__;
27
-export const enableUseResourceEffectHook = __VARIANT__;
27
+export const enableUseEffectCRUDOverload = __VARIANT__;
28
export const enableOwnerStacks = __VARIANT__;
29
export const enableRemoveConsolePatches = __VARIANT__;
30
export const enableFastAddPropertiesInDiffing = __VARIANT__;
packages/shared/forks/ReactFeatureFlags.native-fb.js
+1
-1
@@ -24,7 +24,7 @@ export const {
24
enableObjectFiber,
25
enablePersistedModeClonedFlag,
26
enableShallowPropDiffing,
27
- enableUseResourceEffectHook,
27
+ enableUseEffectCRUDOverload,
28
passChildrenWhenCloningPersistedNodes,
29
enableSiblingPrerendering,
30
enableOwnerStacks,
packages/shared/forks/ReactFeatureFlags.native-oss.js
+1
-1
@@ -63,7 +63,7 @@ export const retryLaneExpirationMs = 5000;
63
export const syncLaneExpirationMs = 250;
64
export const transitionLaneExpirationMs = 5000;
65
export const enableSiblingPrerendering = true;
66
-export const enableUseResourceEffectHook = false;
66
+export const enableUseEffectCRUDOverload = false;
67
68
export const enableHydrationLaneScheduling = true;
69
packages/shared/forks/ReactFeatureFlags.test-renderer.js
+1
-1
@@ -64,7 +64,7 @@ export const renameElementSymbol = true;
64
export const enableShallowPropDiffing = false;
65
export const enableSiblingPrerendering = true;
66
67
-export const enableUseResourceEffectHook = false;
67
+export const enableUseEffectCRUDOverload = false;
68
69
export const enableYieldingBeforePassive = true;
70
packages/shared/forks/ReactFeatureFlags.test-renderer.native-fb.js
+1
-1
@@ -62,7 +62,7 @@ export const retryLaneExpirationMs = 5000;
62
export const syncLaneExpirationMs = 250;
63
export const transitionLaneExpirationMs = 5000;
64
export const enableSiblingPrerendering = true;
65
-export const enableUseResourceEffectHook = true;
65
+export const enableUseEffectCRUDOverload = true;
66
export const enableHydrationLaneScheduling = true;
67
export const enableYieldingBeforePassive = false;
68
export const enableThrottledScheduling = false;
packages/shared/forks/ReactFeatureFlags.test-renderer.www.js
+1
-1
@@ -74,7 +74,7 @@ export const enableOwnerStacks = false;
74
export const enableShallowPropDiffing = false;
75
export const enableSiblingPrerendering = true;
76
77
-export const enableUseResourceEffectHook = false;
77
+export const enableUseEffectCRUDOverload = false;
78
79
export const enableHydrationLaneScheduling = true;
80
packages/shared/forks/ReactFeatureFlags.www-dynamic.js
+1
-1
@@ -36,7 +36,7 @@ export const enableSchedulingProfiler = __VARIANT__;
36
export const enableInfiniteRenderLoopDetection = __VARIANT__;
37
export const enableSiblingPrerendering = __VARIANT__;
38
39
-export const enableUseResourceEffectHook = __VARIANT__;
39
+export const enableUseEffectCRUDOverload = __VARIANT__;
40
export const enableRemoveConsolePatches = __VARIANT__;
41
export const enableFastAddPropertiesInDiffing = __VARIANT__;
42
export const enableViewTransition = __VARIANT__;
packages/shared/forks/ReactFeatureFlags.www.js
+1
-1
@@ -29,7 +29,7 @@ export const {
29
enableSiblingPrerendering,
30
enableTransitionTracing,
31
enableTrustedTypesIntegration,
32
- enableUseResourceEffectHook,
32
+ enableUseEffectCRUDOverload,
33
favorSafetyOverHydrationPerf,
34
renameElementSymbol,
35
retryLaneExpirationMs,