\n+ \n+ <\/div>\n+

{children}<\/div>\n+ <\/>\n+ );\n+ }\n+\n+ function Content() {\n+ readText('A');\n+ readText('B');\n+ return ;\n+ }\n+\n+ await ReactNoop.act(async () => {\n+ root.render();\n+ });\n+ expect(Scheduler).toHaveYielded(['Cache miss! [A]', 'Loading shell...']);\n+ expect(root).toMatchRenderedOutput('Loading shell...');\n+\n+ await ReactNoop.act(async () => {\n+ await resolveText('A');\n+ });\n+ expect(Scheduler).toHaveYielded([\n+ 'Shell',\n+ \/\/ There's a cache miss for B, because it hasn't been read yet. But not\n+ \/\/ A, because it was cached when we rendered the shell.\n+ 'Cache miss! [B]',\n+ 'Loading content...',\n+ ]);\n+ expect(root).toMatchRenderedOutput(\n+ <>\n+

Shell<\/div>\n+

Loading content...<\/div>\n+ <\/>,\n+ );\n+\n+ await ReactNoop.act(async () => {\n+ await resolveText('B');\n+ });\n+ expect(Scheduler).toHaveYielded(['Content']);\n+ expect(root).toMatchRenderedOutput(\n+ <>\n+

Shell<\/div>\n+

Content<\/div>\n+ <\/>,\n+ );\n+ });\n+\n+ \/\/ @gate experimental\n+ test('refresh a cache', async () => {\n+ let refresh;\n+ function App() {\n+ refresh = useCacheRefresh();\n+ return ;\n+ }\n+\n+ \/\/ Mount initial data\n+ const root = ReactNoop.createRoot();\n+ await ReactNoop.act(async () => {\n+ root.render(\n+ \n+ }>\n+ \n+ <\/Suspense>\n+ <\/Cache>,\n+ );\n+ });\n+ expect(Scheduler).toHaveYielded(['Cache miss! [A]', 'Loading...']);\n+ expect(root).toMatchRenderedOutput('Loading...');\n+\n+ await ReactNoop.act(async () => {\n+ await resolveText('A');\n+ });\n+ expect(Scheduler).toHaveYielded(['A [v1]']);\n+ expect(root).toMatchRenderedOutput('A [v1]');\n+\n+ \/\/ Mutate the text service, then refresh for new data.\n+ mutateRemoteTextService();\n+ await ReactNoop.act(async () => {\n+ startTransition(() => refresh());\n+ });\n+ expect(Scheduler).toHaveYielded(['Cache miss! [A]', 'Loading...']);\n+ expect(root).toMatchRenderedOutput('A [v1]');\n+\n+ await ReactNoop.act(async () => {\n+ await resolveText('A');\n+ });\n+ \/\/ Note that the version has updated\n+ expect(Scheduler).toHaveYielded(['A [v2]']);\n+ expect(root).toMatchRenderedOutput('A [v2]');\n+ });\n+\n+ \/\/ @gate experimental\n+ test('refresh the root cache', async () => {\n+ let refresh;\n+ function App() {\n+ refresh = useCacheRefresh();\n+ return ;\n+ }\n+\n+ \/\/ Mount initial data\n+ const root = ReactNoop.createRoot();\n+ await ReactNoop.act(async () => {\n+ root.render(\n+ }>\n+ \n+ <\/Suspense>,\n+ );\n+ });\n+ expect(Scheduler).toHaveYielded(['Cache miss! [A]', 'Loading...']);\n+ expect(root).toMatchRenderedOutput('Loading...');\n+\n+ await ReactNoop.act(async () => {\n+ await resolveText('A');\n+ });\n+ expect(Scheduler).toHaveYielded(['A [v1]']);\n+ expect(root).toMatchRenderedOutput('A [v1]');\n+\n+ \/\/ Mutate the text service, then refresh for new data.\n+ mutateRemoteTextService();\n+ await ReactNoop.act(async () => {\n+ startTransition(() => refresh());\n+ });\n+ expect(Scheduler).toHaveYielded(['Cache miss! [A]', 'Loading...']);\n+ expect(root).toMatchRenderedOutput('A [v1]');\n+\n+ await ReactNoop.act(async () => {\n+ await resolveText('A');\n+ });\n+ \/\/ Note that the version has updated\n+ expect(Scheduler).toHaveYielded(['A [v2]']);\n+ expect(root).toMatchRenderedOutput('A [v2]');\n+ });\n+\n+ \/\/ @gate experimental\n+ test('refresh a cache with seed data', async () => {\n+ let refresh;\n+ function App() {\n+ refresh = useCacheRefresh();\n+ return ;\n+ }\n+\n+ \/\/ Mount initial data\n+ const root = ReactNoop.createRoot();\n+ await ReactNoop.act(async () => {\n+ root.render(\n+ \n+ }>\n+ \n+ <\/Suspense>\n+ <\/Cache>,\n+ );\n+ });\n+ expect(Scheduler).toHaveYielded(['Cache miss! [A]', 'Loading...']);\n+ expect(root).toMatchRenderedOutput('Loading...');\n+\n+ await ReactNoop.act(async () => {\n+ await resolveText('A');\n+ });\n+ expect(Scheduler).toHaveYielded(['A [v1]']);\n+ expect(root).toMatchRenderedOutput('A [v1]');\n+\n+ \/\/ Mutate the text service, then refresh for new data.\n+ mutateRemoteTextService();\n+ await ReactNoop.act(async () => {\n+ \/\/ Refresh the cache with seeded data, like you would receive from a\n+ \/\/ server mutation.\n+ \/\/ TODO: Seeding multiple typed caches. Should work by calling `refresh`\n+ \/\/ multiple times with different key\/value pairs\n+ const seededCache = new Map();\n+ seededCache.set('A', {\n+ ping: null,\n+ status: 'resolved',\n+ value: textServiceVersion,\n+ });\n+ startTransition(() => refresh(createTextCache, seededCache));\n+ });\n+ \/\/ The root should re-render without a cache miss.\n+ expect(Scheduler).toHaveYielded(['A [v2]']);\n+ expect(root).toMatchRenderedOutput('A [v2]');\n+ });\n+\n+ \/\/ @gate experimental\n+ test('refreshing a parent cache also refreshes its children', async () => {\n+ let refreshShell;\n+ function RefreshShell() {\n+ refreshShell = useCacheRefresh();\n+ return null;\n+ }\n+\n+ function App({showMore}) {\n+ return (\n+ \n+ \n+ }>\n+ \n+ <\/Suspense>\n+ {showMore ? (\n+ \n+ }>\n+ \n+ <\/Suspense>\n+ <\/Cache>\n+ ) : null}\n+ <\/Cache>\n+ );\n+ }\n+\n+ const root = ReactNoop.createRoot();\n+ await ReactNoop.act(async () => {\n+ await resolveText('A');\n+ root.render();\n+ });\n+ expect(Scheduler).toHaveYielded([\n+ 'Cache miss! [A]',\n+ 'Loading...',\n+ 'A [v1]',\n+ ]);\n+ expect(root).toMatchRenderedOutput('A [v1]');\n+\n+ \/\/ Simulate a server mutation.\n+ mutateRemoteTextService();\n+\n+ \/\/ Add a new cache boundary\n+ await ReactNoop.act(async () => {\n+ await resolveText('A');\n+ root.render();\n+ });\n+ expect(Scheduler).toHaveYielded([\n+ 'A [v1]',\n+ \/\/ New tree should load fresh data.\n+ 'Cache miss! [A]',\n+ 'Loading...',\n+ 'A [v2]',\n+ ]);\n+ expect(root).toMatchRenderedOutput('A [v1]A [v2]');\n+\n+ \/\/ Now refresh the shell. This should also cause the \"Show More\" contents to\n+ \/\/ refresh, since its cache is nested inside the outer one.\n+ mutateRemoteTextService();\n+ await ReactNoop.act(async () => {\n+ startTransition(() => refreshShell());\n+ });\n+ expect(Scheduler).toHaveYielded([\n+ 'Cache miss! [A]',\n+ 'Loading...',\n+ 'Loading...',\n+ ]);\n+ expect(root).toMatchRenderedOutput('A [v1]A [v2]');\n+\n+ await ReactNoop.act(async () => {\n+ await resolveText('A');\n+ });\n+ expect(Scheduler).toHaveYielded(['A [v3]', 'A [v3]']);\n+ expect(root).toMatchRenderedOutput('A [v3]A [v3]');\n+ });\n+\n+ \/\/ @gate experimental\n+ test(\n+ 'refreshing a cache boundary does not refresh the other boundaries ' +\n+ 'that mounted at the same time (i.e. the ones that share the same cache)',\n+ async () => {\n+ let refreshFirstBoundary;\n+ function RefreshFirstBoundary() {\n+ refreshFirstBoundary = useCacheRefresh();\n+ return null;\n+ }\n+\n+ function App({showMore}) {\n+ return showMore ? (\n+ <>\n+ \n+ }>\n+ \n+ \n+ <\/Suspense>\n+ <\/Cache>\n+ \n+ }>\n+ \n+ <\/Suspense>\n+ <\/Cache>\n+ <\/>\n+ ) : null;\n+ }\n+\n+ \/\/ First mount the initial shell without the nested boundaries. This is\n+ \/\/ necessary for this test because we want the two inner boundaries to be\n+ \/\/ treated like sibling providers that happen to share an underlying\n+ \/\/ cache, as opposed to consumers of the root-level cache.\n+ const root = ReactNoop.createRoot();\n+ await ReactNoop.act(async () => {\n+ root.render();\n+ });\n+\n+ \/\/ Now reveal the boundaries. In a real app this would be a navigation.\n+ await ReactNoop.act(async () => {\n+ root.render();\n+ });\n+\n+ \/\/ Even though there are two new trees, they should share the same\n+ \/\/ data cache. So there should be only a single cache miss for A.\n+ expect(Scheduler).toHaveYielded([\n+ 'Cache miss! [A]',\n+ 'Loading...',\n+ 'Loading...',\n+ ]);\n+ expect(root).toMatchRenderedOutput('Loading...Loading...');\n+\n+ await ReactNoop.act(async () => {\n+ await resolveText('A');\n+ });\n+ expect(Scheduler).toHaveYielded(['A [v1]', 'A [v1]']);\n+ expect(root).toMatchRenderedOutput('A [v1]A [v1]');\n+\n+ \/\/ Refresh the first boundary. It should not refresh the second boundary,\n+ \/\/ even though they previously shared the same underlying cache.\n+ mutateRemoteTextService();\n+ await ReactNoop.act(async () => {\n+ await refreshFirstBoundary();\n+ });\n+ expect(Scheduler).toHaveYielded(['Cache miss! [A]', 'Loading...']);\n+\n+ await ReactNoop.act(async () => {\n+ await resolveText('A');\n+ });\n+ expect(Scheduler).toHaveYielded(['A [v2]']);\n+ expect(root).toMatchRenderedOutput('A [v2]A [v1]');\n+ },\n+ );\n+\n+ \/\/ @gate experimental\n+ test(\n+ 'mount a new Cache boundary in a sibling while simultaneously ' +\n+ 'resolving a Suspense boundary',\n+ async () => {\n+ function App({showMore}) {\n+ return (\n+ <>\n+ {showMore ? (\n+ }>\n+ \n+ \n+ <\/Cache>\n+ <\/Suspense>\n+ ) : null}\n+ }>\n+ \n+ {' '}\n+ {' '}\n+ \n+ <\/Cache>\n+ <\/Suspense>\n+ <\/>\n+ );\n+ }\n+\n+ const root = ReactNoop.createRoot();\n+ await ReactNoop.act(async () => {\n+ root.render();\n+ });\n+ expect(Scheduler).toHaveYielded([\n+ 'Cache miss! [A]',\n+ 'Cache miss! [B]',\n+ 'Loading...',\n+ ]);\n+\n+ await ReactNoop.act(async () => {\n+ \/\/ This will resolve the content in the first cache\n+ resolveText('A');\n+ resolveText('B');\n+ \/\/ Now let's simulate a mutation\n+ mutateRemoteTextService();\n+ \/\/ And mount the second tree, which includes new content\n+ root.render();\n+ });\n+ expect(Scheduler).toHaveYielded([\n+ \/\/ The new tree should use a fresh cache\n+ 'Cache miss! [A]',\n+ 'Loading...',\n+ \/\/ The other tree uses the cached responses. This demonstrates that the\n+ \/\/ requests are not dropped.\n+ 'A [v1]',\n+ 'B [v1]',\n+ ]);\n+\n+ \/\/ Now resolve the second tree\n+ await ReactNoop.act(async () => {\n+ resolveText('A');\n+ });\n+ expect(Scheduler).toHaveYielded(['A [v2]']);\n+ expect(root).toMatchRenderedOutput('A [v2] A [v1] B [v1]');\n+ },\n+ );\n+\n+ \/\/ @gate experimental\n+ test('cache pool is cleared once transitions that depend on it commit their shell', async () => {\n+ function Child({text}) {\n+ return (\n+ \n+ \n+ <\/Cache>\n+ );\n+ }\n+\n+ const root = ReactNoop.createRoot();\n+ await ReactNoop.act(async () => {\n+ root.render(\n+ }>(empty)<\/Suspense>,\n+ );\n+ });\n+ expect(Scheduler).toHaveYielded([]);\n+ expect(root).toMatchRenderedOutput('(empty)');\n+\n+ await ReactNoop.act(async () => {\n+ startTransition(() => {\n+ root.render(\n+ }>\n+ \n+ <\/Suspense>,\n+ );\n+ });\n+ });\n+ expect(Scheduler).toHaveYielded(['Cache miss! [A]', 'Loading...']);\n+ expect(root).toMatchRenderedOutput('(empty)');\n+\n+ await ReactNoop.act(async () => {\n+ startTransition(() => {\n+ root.render(\n+ }>\n+ \n+ \n+ <\/Suspense>,\n+ );\n+ });\n+ });\n+ expect(Scheduler).toHaveYielded([\n+ \/\/ No cache miss, because it uses the pooled cache\n+ 'Loading...',\n+ ]);\n+ expect(root).toMatchRenderedOutput('(empty)');\n+\n+ \/\/ Resolve the request\n+ await ReactNoop.act(async () => {\n+ await resolveText('A');\n+ });\n+ expect(Scheduler).toHaveYielded(['A', 'A']);\n+ expect(root).toMatchRenderedOutput('AA');\n+\n+ \/\/ Now do another transition\n+ await ReactNoop.act(async () => {\n+ startTransition(() => {\n+ root.render(\n+ }>\n+ \n+ \n+ \n+ <\/Suspense>,\n+ );\n+ });\n+ });\n+ expect(Scheduler).toHaveYielded([\n+ \/\/ First two children use the old cache because they already finished\n+ 'A',\n+ 'A',\n+ \/\/ The new child uses a fresh cache\n+ 'Cache miss! [A]',\n+ 'Loading...',\n+ 'A',\n+ 'A',\n+ 'A',\n+ ]);\n+ expect(root).toMatchRenderedOutput('AAA');\n+ });\n+\n+ \/\/ @gate experimental\n+ test('cache pool is not cleared by arbitrary commits', async () => {\n+ function App() {\n+ return (\n+ <>\n+ \n+ \n+ <\/>\n+ );\n+ }\n+\n+ let showMore;\n+ function ShowMore() {\n+ const [shouldShow, _showMore] = useState(false);\n+ showMore = () => _showMore(true);\n+ return (\n+ <>\n+ }>\n+ {shouldShow ? (\n+ \n+ \n+ <\/Cache>\n+ ) : null}\n+ <\/Suspense>\n+ <\/>\n+ );\n+ }\n+\n+ let updateUnrelated;\n+ function Unrelated() {\n+ const [count, _updateUnrelated] = useState(0);\n+ updateUnrelated = _updateUnrelated;\n+ return ;\n+ }\n+\n+ const root = ReactNoop.createRoot();\n+ await ReactNoop.act(async () => {\n+ root.render();\n+ });\n+ expect(Scheduler).toHaveYielded(['0']);\n+ expect(root).toMatchRenderedOutput('0');\n+\n+ await ReactNoop.act(async () => {\n+ startTransition(() => {\n+ showMore();\n+ });\n+ });\n+ expect(Scheduler).toHaveYielded(['Cache miss! [A]', 'Loading...']);\n+ expect(root).toMatchRenderedOutput('0');\n+\n+ await ReactNoop.act(async () => {\n+ updateUnrelated(1);\n+ });\n+ expect(Scheduler).toHaveYielded([\n+ '1',\n+\n+ \/\/ Happens to re-render the fallback. Doesn't need to, but not relevant\n+ \/\/ to this test.\n+ 'Loading...',\n+ ]);\n+ expect(root).toMatchRenderedOutput('1');\n+\n+ await ReactNoop.act(async () => {\n+ resolveText('A');\n+ mutateRemoteTextService();\n+ });\n+ expect(Scheduler).toHaveYielded(['A']);\n+ expect(root).toMatchRenderedOutput('A1');\n+ });\n+});\ndiff --git a\/packages\/react-server\/src\/ReactFlightServer.js b\/packages\/react-server\/src\/ReactFlightServer.js\nindex d6717a0830..ffbc13edaf 100644\n--- a\/packages\/react-server\/src\/ReactFlightServer.js\n+++ b\/packages\/react-server\/src\/ReactFlightServer.js\n@@ -758,6 +758,13 @@ function unsupportedHook(): void {\n invariant(false, 'This Hook is not supported in Server Components.');\n }\n \n+function unsupportedRefresh(): void {\n+ invariant(\n+ currentCache,\n+ 'Refreshing the cache is not supported in Server Components.',\n+ );\n+}\n+\n let currentCache: Map | null = null;\n \n const Dispatcher: DispatcherType = {\n@@ -797,4 +804,7 @@ const Dispatcher: DispatcherType = {\n useEffect: (unsupportedHook: any),\n useOpaqueIdentifier: (unsupportedHook: any),\n useMutableSource: (unsupportedHook: any),\n+ useCacheRefresh(): (?() => T, ?T) => void {\n+ return unsupportedRefresh;\n+ },\n };\ndiff --git a\/packages\/react-suspense-test-utils\/src\/ReactSuspenseTestUtils.js b\/packages\/react-suspense-test-utils\/src\/ReactSuspenseTestUtils.js\nindex a58c6cae82..43c6c5184d 100644\n--- a\/packages\/react-suspense-test-utils\/src\/ReactSuspenseTestUtils.js\n+++ b\/packages\/react-suspense-test-utils\/src\/ReactSuspenseTestUtils.js\n@@ -44,6 +44,7 @@ export function waitForSuspense(fn: () => T): Promise {\n useTransition: unsupported,\n useOpaqueIdentifier: unsupported,\n useMutableSource: unsupported,\n+ useCacheRefresh: unsupported,\n };\n \/\/ Not using async\/await because we don't compile it.\n return new Promise((resolve, reject) => {\ndiff --git a\/packages\/react\/index.classic.fb.js b\/packages\/react\/index.classic.fb.js\nindex 04723075de..366e86626f 100644\n--- a\/packages\/react\/index.classic.fb.js\n+++ b\/packages\/react\/index.classic.fb.js\n@@ -51,6 +51,8 @@ export {\n SuspenseList,\n SuspenseList as unstable_SuspenseList,\n unstable_getCacheForType,\n+ unstable_Cache,\n+ unstable_useCacheRefresh,\n \/\/ enableScopeAPI\n unstable_Scope,\n unstable_useOpaqueIdentifier,\ndiff --git a\/packages\/react\/index.experimental.js b\/packages\/react\/index.experimental.js\nindex 5de53908ae..ba0d205f81 100644\n--- a\/packages\/react\/index.experimental.js\n+++ b\/packages\/react\/index.experimental.js\n@@ -46,6 +46,8 @@ export {\n SuspenseList as unstable_SuspenseList,\n unstable_useOpaqueIdentifier,\n unstable_getCacheForType,\n+ unstable_Cache,\n+ unstable_useCacheRefresh,\n \/\/ enableDebugTracing\n unstable_DebugTracingMode,\n } from '.\/src\/React';\ndiff --git a\/packages\/react\/index.js b\/packages\/react\/index.js\nindex 1553bdd9e9..80e6591171 100644\n--- a\/packages\/react\/index.js\n+++ b\/packages\/react\/index.js\n@@ -83,4 +83,6 @@ export {\n unstable_Scope,\n unstable_useOpaqueIdentifier,\n unstable_getCacheForType,\n+ unstable_Cache,\n+ unstable_useCacheRefresh,\n } from '.\/src\/React';\ndiff --git a\/packages\/react\/index.modern.fb.js b\/packages\/react\/index.modern.fb.js\nindex 9a3bb4384c..cf459c0bfb 100644\n--- a\/packages\/react\/index.modern.fb.js\n+++ b\/packages\/react\/index.modern.fb.js\n@@ -50,6 +50,8 @@ export {\n SuspenseList,\n SuspenseList as unstable_SuspenseList,\n unstable_getCacheForType,\n+ unstable_Cache,\n+ unstable_useCacheRefresh,\n \/\/ enableScopeAPI\n unstable_Scope,\n unstable_useOpaqueIdentifier,\ndiff --git a\/packages\/react\/src\/React.js b\/packages\/react\/src\/React.js\nindex aae52b2750..84490ef902 100644\n--- a\/packages\/react\/src\/React.js\n+++ b\/packages\/react\/src\/React.js\n@@ -17,6 +17,7 @@ import {\n REACT_SUSPENSE_LIST_TYPE,\n REACT_LEGACY_HIDDEN_TYPE,\n REACT_SCOPE_TYPE,\n+ REACT_CACHE_TYPE,\n } from 'shared\/ReactSymbols';\n \n import {Component, PureComponent} from '.\/ReactBaseClasses';\n@@ -48,6 +49,7 @@ import {\n useTransition,\n useDeferredValue,\n useOpaqueIdentifier,\n+ useCacheRefresh,\n } from '.\/ReactHooks';\n import {\n createElementWithValidation,\n@@ -112,6 +114,8 @@ export {\n REACT_SUSPENSE_LIST_TYPE as SuspenseList,\n REACT_LEGACY_HIDDEN_TYPE as unstable_LegacyHidden,\n getCacheForType as unstable_getCacheForType,\n+ useCacheRefresh as unstable_useCacheRefresh,\n+ REACT_CACHE_TYPE as unstable_Cache,\n \/\/ enableFundamentalAPI\n createFundamental as unstable_createFundamental,\n \/\/ enableScopeAPI\ndiff --git a\/packages\/react\/src\/ReactHooks.js b\/packages\/react\/src\/ReactHooks.js\nindex 1020efa74c..c1602a9bb5 100644\n--- a\/packages\/react\/src\/ReactHooks.js\n+++ b\/packages\/react\/src\/ReactHooks.js\n@@ -180,3 +180,9 @@ export function useMutableSource(\n const dispatcher = resolveDispatcher();\n return dispatcher.useMutableSource(source, getSnapshot, subscribe);\n }\n+\n+export function useCacheRefresh(): (?() => T, ?T) => void {\n+ const dispatcher = resolveDispatcher();\n+ \/\/ $FlowFixMe This is unstable, thus optional\n+ return dispatcher.useCacheRefresh();\n+}\ndiff --git a\/packages\/shared\/ReactSymbols.js b\/packages\/shared\/ReactSymbols.js\nindex 1870c8c009..d490ab417c 100644\n--- a\/packages\/shared\/ReactSymbols.js\n+++ b\/packages\/shared\/ReactSymbols.js\n@@ -31,6 +31,7 @@ export let REACT_OPAQUE_ID_TYPE = 0xeae0;\n export let REACT_DEBUG_TRACING_MODE_TYPE = 0xeae1;\n export let REACT_OFFSCREEN_TYPE = 0xeae2;\n export let REACT_LEGACY_HIDDEN_TYPE = 0xeae3;\n+export let REACT_CACHE_TYPE = 0xeae4;\n \n if (typeof Symbol === 'function' && Symbol.for) {\n const symbolFor = Symbol.for;\n@@ -52,6 +53,7 @@ if (typeof Symbol === 'function' && Symbol.for) {\n REACT_DEBUG_TRACING_MODE_TYPE = symbolFor('react.debug_trace_mode');\n REACT_OFFSCREEN_TYPE = symbolFor('react.offscreen');\n REACT_LEGACY_HIDDEN_TYPE = symbolFor('react.legacy_hidden');\n+ REACT_CACHE_TYPE = symbolFor('react.cache');\n }\n \n const MAYBE_ITERATOR_SYMBOL = typeof Symbol === 'function' && Symbol.iterator;\ndiff --git a\/packages\/shared\/getComponentName.js b\/packages\/shared\/getComponentName.js\nindex ae74676ed3..a5594f6f64 100644\n--- a\/packages\/shared\/getComponentName.js\n+++ b\/packages\/shared\/getComponentName.js\n@@ -21,6 +21,7 @@ import {\n REACT_SUSPENSE_TYPE,\n REACT_SUSPENSE_LIST_TYPE,\n REACT_LAZY_TYPE,\n+ REACT_CACHE_TYPE,\n } from 'shared\/ReactSymbols';\n import type {ReactContext, ReactProviderType} from 'shared\/ReactTypes';\n \n@@ -72,6 +73,8 @@ function getComponentName(type: mixed): string | null {\n return 'Suspense';\n case REACT_SUSPENSE_LIST_TYPE:\n return 'SuspenseList';\n+ case REACT_CACHE_TYPE:\n+ return 'Cache';\n }\n if (typeof type === 'object') {\n switch (type.$$typeof) {\ndiff --git a\/packages\/shared\/isValidElementType.js b\/packages\/shared\/isValidElementType.js\nindex 35eeae2a30..0a361c4a22 100644\n--- a\/packages\/shared\/isValidElementType.js\n+++ b\/packages\/shared\/isValidElementType.js\n@@ -22,8 +22,9 @@ import {\n REACT_FUNDAMENTAL_TYPE,\n REACT_SCOPE_TYPE,\n REACT_LEGACY_HIDDEN_TYPE,\n+ REACT_CACHE_TYPE,\n } from 'shared\/ReactSymbols';\n-import {enableScopeAPI} from '.\/ReactFeatureFlags';\n+import {enableScopeAPI, enableCache} from '.\/ReactFeatureFlags';\n \n let REACT_MODULE_REFERENCE: number | Symbol = 0;\n if (typeof Symbol === 'function') {\n@@ -44,7 +45,8 @@ export default function isValidElementType(type: mixed) {\n type === REACT_SUSPENSE_TYPE ||\n type === REACT_SUSPENSE_LIST_TYPE ||\n type === REACT_LEGACY_HIDDEN_TYPE ||\n- (enableScopeAPI && type === REACT_SCOPE_TYPE)\n+ (enableScopeAPI && type === REACT_SCOPE_TYPE) ||\n+ (enableCache && type === REACT_CACHE_TYPE)\n ) {\n return true;\n }\ndiff --git a\/scripts\/error-codes\/codes.json b\/scripts\/error-codes\/codes.json\nindex 641901fcab..12a8db733b 100644\n--- a\/scripts\/error-codes\/codes.json\n+++ b\/scripts\/error-codes\/codes.json\n@@ -371,5 +371,6 @@\n \"380\": \"Reading the cache is only supported while rendering.\",\n \"381\": \"This feature is not supported by ReactSuspenseTestUtils.\",\n \"382\": \"This query has received more parameters than the last time the same query was used. Always pass the exact number of parameters that the query needs.\",\n- \"383\": \"This query has received fewer parameters than the last time the same query was used. Always pass the exact number of parameters that the query needs.\"\n+ \"383\": \"This query has received fewer parameters than the last time the same query was used. Always pass the exact number of parameters that the query needs.\",\n+ \"384\": \"Refreshing the cache is not supported in Server Components.\"\n }\n"}

dillon1000/react

Files changed