Browse Source

migrate to new react 19 context api (#4849)

benedikt-bartscher 3 months ago
parent
commit
836e8f8ce9

+ 8 - 8
reflex/.templates/jinja/web/utils/context.js.jinja2

@@ -78,9 +78,9 @@ export function UploadFilesProvider({ children }) {
     return newFilesById
   })
   return (
-    <UploadFilesContext.Provider value={[filesById, setFilesById]}>
+    <UploadFilesContext value={[filesById, setFilesById]}>
       {children}
-    </UploadFilesContext.Provider>
+    </UploadFilesContext>
   )
 }
 
@@ -92,9 +92,9 @@ export function EventLoopProvider({ children }) {
     clientStorage,
   )
   return (
-    <EventLoopContext.Provider value={[addEvents, connectErrors]}>
+    <EventLoopContext value={[addEvents, connectErrors]}>
       {children}
-    </EventLoopContext.Provider>
+    </EventLoopContext>
   )
 }
 
@@ -112,13 +112,13 @@ export function StateProvider({ children }) {
 
   return (
     {% for state_name in initial_state %}
-    <StateContexts.{{state_name|var_name}}.Provider value={ {{state_name|var_name}} }>
+    <StateContexts.{{state_name|var_name}} value={ {{state_name|var_name}} }>
     {% endfor %}
-      <DispatchContext.Provider value={dispatchers}>
+      <DispatchContext value={dispatchers}>
         {children}
-      </DispatchContext.Provider>
+      </DispatchContext>
     {% for state_name in initial_state|reverse %}
-    </StateContexts.{{state_name|var_name}}.Provider>
+    </StateContexts.{{state_name|var_name}}>
     {% endfor %}
   )
 }

+ 3 - 3
reflex/.templates/web/components/reflex/radix_themes_color_mode_provider.js

@@ -36,17 +36,17 @@ export default function RadixThemesColorModeProvider({ children }) {
     const allowedModes = ["light", "dark", "system"];
     if (!allowedModes.includes(mode)) {
       console.error(
-        `Invalid color mode "${mode}". Defaulting to "${defaultColorMode}".`
+        `Invalid color mode "${mode}". Defaulting to "${defaultColorMode}".`,
       );
       mode = defaultColorMode;
     }
     setTheme(mode);
   };
   return (
-    <ColorModeContext.Provider
+    <ColorModeContext
       value={{ rawColorMode, resolvedColorMode, toggleColorMode, setColorMode }}
     >
       {children}
-    </ColorModeContext.Provider>
+    </ColorModeContext>
   );
 }