Update spec/dummy for React 19 compatibility

react_on_rails/spec/dummy/Gemfile.lock

@@ -345,7 +345,7 @@ GEM
       rubyzip (>= 1.2.2, < 3.0)
       websocket (~> 1.0)
     semantic_range (3.1.0)
-    shakapacker (9.3.0)
+    shakapacker (9.4.0)
       activesupport (>= 5.2)
       package_json
       rack-proxy (>= 0.6.1)
@@ -461,7 +461,7 @@ DEPENDENCIES
   sass-rails (~> 6.0)
   sdoc
   selenium-webdriver (= 4.9.0)
-  shakapacker (= 9.3.0)
+  shakapacker (= 9.4.0)
   spring (~> 4.0)
   sprockets (~> 4.0)
   sqlite3 (~> 1.6)

react_on_rails/spec/dummy/client/app-react16/startup/ReduxApp.client.jsx

@@ -5,7 +5,7 @@
 import React from 'react';
 import { combineReducers, applyMiddleware, createStore } from 'redux';
 import { Provider } from 'react-redux';
-import thunkMiddleware from 'redux-thunk';
+import { thunk } from 'redux-thunk';
 import ReactDOM from 'react-dom';
 
 import reducers from '../../app/reducers/reducersIndex';
@@ -29,7 +29,7 @@ export default (props, railsContext, domNodeId) => {
 
   // This is where we'll put in the middleware for the async function. Placeholder.
   // store will have helloWorldData as a top level property
-  const store = createStore(combinedReducer, combinedProps, applyMiddleware(thunkMiddleware));
+  const store = createStore(combinedReducer, combinedProps, applyMiddleware(thunk));
 
   // renderApp is a function required for hot reloading. see
   // https://github.com/retroalgic/react-on-rails-hot-minimal/blob/master/client/src/entry.js

react_on_rails/spec/dummy/client/app/components/ReactHelmet.jsx

@@ -1,7 +1,10 @@
 import React from 'react';
-import { Helmet } from 'react-helmet';
+import { Helmet } from '@dr.pogodin/react-helmet';
 import HelloWorld from '../startup/HelloWorld';
 
+// Note: This component expects to be wrapped in a HelmetProvider by its parent.
+// For client-side rendering, wrap in HelmetProvider at the app root.
+// For server-side rendering, the server entry point provides the HelmetProvider.
 const ReactHelmet = (props) => (
   <div>
     <Helmet>

react_on_rails/spec/dummy/client/app/startup/ReactHelmetApp.client.jsx

@@ -1,11 +1,17 @@
 // Top level component for simple client side only rendering
 import React from 'react';
+import { HelmetProvider } from '@dr.pogodin/react-helmet';
 import ReactHelmet from '../components/ReactHelmet';
 
 // This works fine, React functional component:
 // export default (props) => <ReactHelmet {...props} />;
 
-export default (props) => <ReactHelmet {...props} />;
+// HelmetProvider is required by @dr.pogodin/react-helmet for both client and server rendering
+export default (props) => (
+  <HelmetProvider>
+    <ReactHelmet {...props} />
+  </HelmetProvider>
+);
 
 // Note, the server side has to be a Render-Function
 

react_on_rails/spec/dummy/client/app/startup/ReactHelmetApp.server.jsx

@@ -1,7 +1,7 @@
 // Top level component for simple client side only rendering
 import React from 'react';
 import { renderToString } from 'react-dom/server';
-import { Helmet } from 'react-helmet';
+import { HelmetProvider } from '@dr.pogodin/react-helmet';
 import ReactHelmet from '../components/ReactHelmet';
 
 /*
@@ -16,12 +16,21 @@ import ReactHelmet from '../components/ReactHelmet';
  *  the function could get the property of `.renderFunction = true` added to it.
  */
 export default (props, _railsContext) => {
-  const componentHtml = renderToString(<ReactHelmet {...props} />);
-  const helmet = Helmet.renderStatic();
+  // For server-side rendering with @dr.pogodin/react-helmet, we pass a context object
+  // to HelmetProvider to capture the helmet data per-request (thread-safe)
+  const helmetContext = {};
+
+  const componentHtml = renderToString(
+    <HelmetProvider context={helmetContext}>
+      <ReactHelmet {...props} />
+    </HelmetProvider>,
+  );
+
+  const { helmet } = helmetContext;
 
   const renderedHtml = {
     componentHtml,
-    title: helmet.title.toString(),
+    title: helmet ? helmet.title.toString() : '',
   };
 
   // Note that this function returns an Object for server rendering.

react_on_rails/spec/dummy/client/app/startup/ReactHelmetAppBroken.client.jsx

@@ -1,11 +1,17 @@
 // Top level component for simple client side only rendering
 import React from 'react';
+import { HelmetProvider } from '@dr.pogodin/react-helmet';
 import ReactHelmet from '../components/ReactHelmet';
 
 // This works fine, React functional component:
 // export default (props) => <ReactHelmet {...props} />;
 
-export default (props) => <ReactHelmet {...props} />;
+// HelmetProvider is required by @dr.pogodin/react-helmet for both client and server rendering
+export default (props) => (
+  <HelmetProvider>
+    <ReactHelmet {...props} />
+  </HelmetProvider>
+);
 
 // Note, the server side has to be a Render-Function
 

react_on_rails/spec/dummy/client/app/startup/ReactHelmetAppBroken.server.jsx

@@ -3,7 +3,7 @@
 // function. The point of this is to provide a good error.
 import React from 'react';
 import { renderToString } from 'react-dom/server';
-import { Helmet } from 'react-helmet';
+import { HelmetProvider } from '@dr.pogodin/react-helmet';
 import ReactHelmet from '../components/ReactHelmet';
 
 /*
@@ -18,12 +18,17 @@ import ReactHelmet from '../components/ReactHelmet';
  *  Alternately, the function could get the property of `.renderFunction = true` added to it.
  */
 export default (props) => {
-  const componentHtml = renderToString(<ReactHelmet {...props} />);
-  const helmet = Helmet.renderStatic();
+  const helmetContext = {};
+  const componentHtml = renderToString(
+    <HelmetProvider context={helmetContext}>
+      <ReactHelmet {...props} />
+    </HelmetProvider>,
+  );
+  const { helmet } = helmetContext;
 
   const renderedHtml = {
     componentHtml,
-    title: helmet.title.toString(),
+    title: helmet ? helmet.title.toString() : '',
   };
   return { renderedHtml };
 };

react_on_rails/spec/dummy/client/app/startup/ReduxApp.client.jsx

@@ -5,7 +5,7 @@
 import React from 'react';
 import { combineReducers, applyMiddleware, createStore } from 'redux';
 import { Provider } from 'react-redux';
-import thunkMiddleware from 'redux-thunk';
+import { thunk } from 'redux-thunk';
 import ReactDOMClient from 'react-dom/client';
 
 import reducers from '../reducers/reducersIndex';
@@ -34,7 +34,7 @@ export default (props, railsContext, domNodeId) => {
 
   // This is where we'll put in the middleware for the async function. Placeholder.
   // store will have helloWorldData as a top level property
-  const store = createStore(combinedReducer, combinedProps, applyMiddleware(thunkMiddleware));
+  const store = createStore(combinedReducer, combinedProps, applyMiddleware(thunk));
 
   // renderApp is a function required for hot reloading. see
   // https://github.com/retroalgic/react-on-rails-hot-minimal/blob/master/client/src/entry.js

react_on_rails/spec/dummy/client/app/startup/ReduxApp.server.jsx

@@ -6,7 +6,7 @@
 import React from 'react';
 import { combineReducers, applyMiddleware, createStore } from 'redux';
 import { Provider } from 'react-redux';
-import middleware from 'redux-thunk';
+import { thunk } from 'redux-thunk';
 
 // Uses the index
 import reducers from '../reducers/reducersIndex';
@@ -28,7 +28,7 @@ export default (props, railsContext) => {
 
   // This is where we'll put in the middleware for the async function. Placeholder.
   // store will have helloWorldData as a top level property
-  const store = applyMiddleware(middleware)(createStore)(combinedReducer, combinedProps);
+  const store = applyMiddleware(thunk)(createStore)(combinedReducer, combinedProps);
 
   // Provider uses the this.props.children, so we're not typical React syntax.
   // This allows redux to add additional props to the HelloWorldContainer.

react_on_rails/spec/dummy/client/app/stores/SharedReduxStore.jsx

@@ -1,5 +1,5 @@
 import { combineReducers, applyMiddleware, createStore } from 'redux';
-import middleware from 'redux-thunk';
+import { thunk } from 'redux-thunk';
 
 import reducers from '../reducers/reducersIndex';
 
@@ -12,5 +12,5 @@ export default (props, railsContext) => {
   delete props.prerender;
   const combinedReducer = combineReducers(reducers);
   const newProps = { ...props, railsContext };
-  return applyMiddleware(middleware)(createStore)(combinedReducer, newProps);
+  return applyMiddleware(thunk)(createStore)(combinedReducer, newProps);
 };

react_on_rails/spec/dummy/package.json

@@ -18,14 +18,14 @@
     "node-libs-browser": "^2.2.1",
     "null-loader": "^4.0.0",
     "prop-types": "^15.7.2",
-    "react": "18.0.0",
-    "react-dom": "18.0.0",
-    "react-helmet": "^6.1.0",
+    "@dr.pogodin/react-helmet": "^3.0.4",
+    "react": "19.0.0",
+    "react-dom": "19.0.0",
     "react-on-rails": "link:.yalc/react-on-rails",
-    "react-redux": "^8.0.2",
+    "react-redux": "^9.2.0",
     "react-router-dom": "^6.0.0",
-    "redux": "^4.0.1",
-    "redux-thunk": "^2.2.0",
+    "redux": "^5.0.1",
+    "redux-thunk": "^3.1.0",
     "regenerator-runtime": "^0.13.4"
   },
   "devDependencies": {
@@ -38,7 +38,6 @@
     "@rescript/react": "^0.13.0",
     "@types/react": "^19.0.0",
     "@types/react-dom": "^19.0.0",
-    "@types/react-helmet": "^6.1.5",
     "babel-loader": "8.2.4",
     "babel-plugin-transform-react-remove-prop-types": "^0.4.24",
     "compression-webpack-plugin": "9",