Pro RSC migration 1/3: Swap gem and npm to react_on_rails_pro

Gemfile

@@ -5,8 +5,8 @@ git_source(:github) { |repo| "https://github.com/#{repo}.git" }
 
 ruby "3.4.6"
 
-gem "react_on_rails", "16.6.0.rc.0"
-gem "shakapacker", "10.0.0.rc.0"
+gem "react_on_rails_pro", "16.6.0"
+gem "shakapacker", "10.0.0"
 
 # Bundle edge Rails instead: gem "rails", github: "rails/rails"
 gem "rails", "~> 8.1.2"

Gemfile.lock

@@ -78,6 +78,12 @@ GEM
     addressable (2.8.7)
       public_suffix (>= 2.0.2, < 7.0)
     ast (2.4.3)
+    async (2.39.0)
+      console (~> 1.29)
+      fiber-annotation
+      io-event (~> 1.11)
+      metrics (~> 0.12)
+      traces (~> 0.18)
     autoprefixer-rails (10.4.16.0)
       execjs (~> 2)
     awesome_print (1.9.2)
@@ -115,6 +121,10 @@ GEM
     coffee-script-source (1.12.2)
     concurrent-ruby (1.3.6)
     connection_pool (3.0.2)
+    console (1.34.3)
+      fiber-annotation
+      fiber-local (~> 1.1)
+      json
     coveralls_reborn (0.25.0)
       simplecov (>= 0.18.1, < 0.22.0)
       term-ansicolor (~> 1.6)
@@ -146,16 +156,24 @@ GEM
       railties (>= 5.0.0)
     ffi (1.17.2-arm64-darwin)
     ffi (1.17.2-x86_64-linux-gnu)
+    fiber-annotation (0.2.0)
+    fiber-local (1.1.0)
+      fiber-storage
+    fiber-storage (1.0.1)
     foreman (0.88.1)
     generator_spec (0.10.0)
       activesupport (>= 3.0.0)
       railties (>= 3.0.0)
     globalid (1.3.0)
       activesupport (>= 6.1)
+    http-2 (1.1.3)
+    httpx (1.7.6)
+      http-2 (>= 1.1.3)
     i18n (1.14.8)
       concurrent-ruby (~> 1.0)
     interception (0.5)
     io-console (0.8.2)
+    io-event (1.15.1)
     irb (1.17.0)
       pp (>= 0.6.0)
       prism (>= 1.3.0)
@@ -165,6 +183,8 @@ GEM
       actionview (>= 5.0.0)
       activesupport (>= 5.0.0)
     json (2.19.1)
+    jwt (2.10.2)
+      base64
     language_server-protocol (3.17.0.5)
     launchy (3.0.1)
       addressable (~> 2.8)
@@ -182,6 +202,7 @@ GEM
     marcel (1.1.0)
     matrix (0.4.2)
     method_source (1.1.0)
+    metrics (0.15.0)
     mini_mime (1.1.5)
     minitest (6.0.2)
       drb (~> 2.0)
@@ -296,13 +317,23 @@ GEM
       erb
       psych (>= 4.0.0)
       tsort
-    react_on_rails (16.6.0.rc.0)
+    react_on_rails (16.6.0)
       addressable
       connection_pool
       execjs (~> 2.5)
       rails (>= 5.2)
       rainbow (~> 3.0)
       shakapacker (>= 6.0)
+    react_on_rails_pro (16.6.0)
+      addressable
+      async (>= 2.29)
+      connection_pool
+      execjs (~> 2.9)
+      http-2 (>= 1.1.1)
+      httpx (~> 1.5)
+      jwt (~> 2.7)
+      rainbow
+      react_on_rails (= 16.6.0)
     redcarpet (3.6.0)
     redis (5.3.0)
       redis-client (>= 0.22.0)
@@ -387,7 +418,7 @@ GEM
       websocket (~> 1.0)
     semantic_range (3.1.1)
     sexp_processor (4.17.1)
-    shakapacker (10.0.0.rc.0)
+    shakapacker (10.0.0)
       activesupport (>= 5.2)
       package_json
       rack-proxy (>= 0.6.1)
@@ -425,6 +456,7 @@ GEM
     tins (1.33.0)
       bigdecimal
       sync
+    traces (0.18.2)
     tsort (0.2.0)
     turbo-rails (2.0.11)
       actionpack (>= 6.0.0)
@@ -486,7 +518,7 @@ DEPENDENCIES
   rails-html-sanitizer
   rails_best_practices
   rainbow
-  react_on_rails (= 16.6.0.rc.0)
+  react_on_rails_pro (= 16.6.0)
   redcarpet
   redis (~> 5.0)
   rspec-rails (~> 6.0.0)
@@ -498,7 +530,7 @@ DEPENDENCIES
   scss_lint
   sdoc
   selenium-webdriver (~> 4)
-  shakapacker (= 10.0.0.rc.0)
+  shakapacker (= 10.0.0)
   spring
   spring-commands-rspec
   stimulus-rails (~> 1.3)

client/app/bundles/comments/components/SimpleCommentScreen/ror_components/SimpleCommentScreen.jsx

@@ -3,7 +3,7 @@ import React from 'react';
 import request from 'axios';
 import Immutable from 'immutable';
 import _ from 'lodash';
-import ReactOnRails from 'react-on-rails';
+import ReactOnRails from 'react-on-rails-pro';
 import { IntlProvider, injectIntl } from 'react-intl';
 import BaseComponent from 'libs/components/BaseComponent';
 import SelectLanguage from 'libs/i18n/selectLanguage';

client/app/bundles/comments/startup/App/ror_components/App.jsx

@@ -1,6 +1,6 @@
 import { Provider } from 'react-redux';
 import React from 'react';
-import ReactOnRails from 'react-on-rails';
+import ReactOnRails from 'react-on-rails-pro';
 
 import NonRouterCommentsContainer from '../../../containers/NonRouterCommentsContainer.jsx';
 import 'intl/locale-data/jsonp/en';

client/app/bundles/comments/startup/ClientRouterAppExpress.jsx

@@ -1,7 +1,7 @@
 // Compare to ../ServerRouterApp.jsx
 import { Provider } from 'react-redux';
 import React from 'react';
-import ReactOnRails from 'react-on-rails';
+import ReactOnRails from 'react-on-rails-pro';
 import { Router, browserHistory } from 'react-router';
 import { syncHistoryWithStore } from 'react-router-redux';
 

client/app/bundles/comments/startup/NavigationBarApp/ror_components/NavigationBarApp.jsx

@@ -3,7 +3,7 @@
 
 import { Provider } from 'react-redux';
 import React from 'react';
-import ReactOnRails from 'react-on-rails';
+import ReactOnRails from 'react-on-rails-pro';
 
 import NavigationBar from '../../../components/NavigationBar/NavigationBar.jsx';
 import NavigationBarContainer from '../../../containers/NavigationBarContainer.jsx';

client/app/bundles/comments/startup/RouterApp/ror_components/RouterApp.client.jsx

@@ -1,7 +1,7 @@
 // Compare to ./RouterApp.server.jsx
 import { Provider } from 'react-redux';
 import React from 'react';
-import ReactOnRails from 'react-on-rails';
+import ReactOnRails from 'react-on-rails-pro';
 import { BrowserRouter } from 'react-router-dom';
 import routes from '../../../routes/routes.jsx';
 

client/app/bundles/comments/startup/RouterApp/ror_components/RouterApp.server.jsx

@@ -2,7 +2,7 @@
 import { Provider } from 'react-redux';
 import React from 'react';
 import { StaticRouter } from 'react-router-dom/server';
-import ReactOnRails from 'react-on-rails';
+import ReactOnRails from 'react-on-rails-pro';
 import routes from '../../../routes/routes.jsx';
 
 function ServerRouterApp(_props, railsContext) {

client/app/bundles/comments/startup/serverRegistration.jsx

@@ -1,5 +1,5 @@
 // Example of React + Redux
-import ReactOnRails from 'react-on-rails';
+import ReactOnRails from 'react-on-rails-pro';
 
 import App from './App/ror_components/App';
 import RouterApp from './RouterApp/ror_components/RouterApp.server';

client/app/libs/requestsManager.js

@@ -1,5 +1,5 @@
 import request from 'axios';
-import ReactOnRails from 'react-on-rails';
+import ReactOnRails from 'react-on-rails-pro';
 
 const API_URL = 'comments.json';
 

client/app/packs/stimulus-bundle.js

@@ -1,4 +1,4 @@
-import ReactOnRails from 'react-on-rails';
+import ReactOnRails from 'react-on-rails-pro';
 import 'jquery-ujs';
 import { Turbo } from '@hotwired/turbo-rails';
 

client/app/packs/stores-registration.js

@@ -1,4 +1,4 @@
-import ReactOnRails from 'react-on-rails';
+import ReactOnRails from 'react-on-rails-pro';
 import routerCommentsStore from '../bundles/comments/store/routerCommentsStore';
 import commentsStore from '../bundles/comments/store/commentsStore';
 

config/webpack/commonWebpackConfig.js

@@ -8,6 +8,16 @@ const commonOptions = {
   resolve: {
     // Add .res.js extension for ReScript-compiled modules (modern ReScript convention)
     extensions: ['.css', '.ts', '.tsx', '.res.js'],
+    // Shim for third-party packages (notably rescript-react-on-rails) that import
+    // 'react-on-rails' directly and can't be source-rewritten to react-on-rails-pro.
+    // Without this, Pro and core coexist in the bundle and trigger the runtime error
+    // "Cannot mix react-on-rails (core) with react-on-rails-pro".
+    // First-party code imports 'react-on-rails-pro' directly, so this alias is only
+    // needed for the third-party exact-specifier case — hence the `$` suffix (no
+    // sub-path rewrites, since Pro's package exports differ from core's).
+    alias: {
+      'react-on-rails$': 'react-on-rails-pro',
+    },
   },
 };
 

package.json

@@ -80,7 +80,7 @@
     "react": "^19.0.0",
     "react-dom": "^19.0.0",
     "react-intl": "^6.4.4",
-    "react-on-rails": "16.6.0-rc.0",
+    "react-on-rails-pro": "16.6.0",
     "react-redux": "^8.1.0",
     "react-router": "^6.13.0",
     "react-router-dom": "^6.13.0",
@@ -95,7 +95,7 @@
     "sass": "^1.58.3",
     "sass-loader": "^13.3.2",
     "sass-resources-loader": "^2.2.5",
-    "shakapacker": "10.0.0-rc.0",
+    "shakapacker": "10.0.0",
     "stimulus": "^3.0.1",
     "style-loader": "^3.3.1",
     "swc-loader": "^0.2.6",

yarn.lock

@@ -7455,6 +7455,13 @@ p-try@^2.0.0:
   resolved "https://registry.npmjs.org/p-try/-/p-try-2.2.0.tgz"
   integrity sha512-R4nPAVTAU0B9D35/Gk3uJf/7XYbQcyohSKdvAxIRSNghFl4e71hVoGnBNQz9cWaXxO2I10KTC+3jMdvvoKw6dQ==
 
+pack-config-diff@^0.1.0:
+  version "0.1.0"
+  resolved "https://registry.npmjs.org/pack-config-diff/-/pack-config-diff-0.1.0.tgz#c15025e196ff85009806890cca0841e96aaa6a1b"
+  integrity sha512-gx60G4pnT4GFQ7WECdf7SCq9vdsvBhodLXXzwisy37/t0zkAZ3hMgLCdOGivudF1l0gcLZhIWVYreS89be15QA==
+  dependencies:
+    js-yaml "^4.1.0"
+
 package-json-from-dist@^1.0.0:
   version "1.0.1"
   resolved "https://registry.npmjs.org/package-json-from-dist/-/package-json-from-dist-1.0.1.tgz"
@@ -8403,10 +8410,17 @@ react-is@^18.0.0, react-is@^18.3.1:
   resolved "https://registry.npmjs.org/react-is/-/react-is-18.3.1.tgz"
   integrity sha512-/LLMVyas0ljjAtoYiPqYiL8VWXzUUdThrmU5+n20DZv+a+ClRoevUzw5JxU+Ieh5/c87ytoTBV9G1FiKfNJdmg==
 
-react-on-rails@16.6.0-rc.0:
-  version "16.6.0-rc.0"
-  resolved "https://registry.npmjs.org/react-on-rails/-/react-on-rails-16.6.0-rc.0.tgz#ed0ed7085133905ad1e243cc97233e97d10a1c99"
-  integrity sha512-fSEomzwojgWob6uTWSfkbpP+XE++8kQBjNFpTT7V419QOON1daIHypQwA9gc8L8uX1If5r8hmAs57iWyGWmJuQ==
+react-on-rails-pro@16.6.0:
+  version "16.6.0"
+  resolved "https://registry.npmjs.org/react-on-rails-pro/-/react-on-rails-pro-16.6.0.tgz#19a5ea99d7b397dd56f14cff1f31955211b4d0a2"
+  integrity sha512-Uc8o3gdHyIETvY5J9wVUyONKOhnkw9kGJDREMHQb/IuXoB5/Vo51UK487Rcep2Z+Dzz/bEvNoF+GuZohORZ7Zw==
+  dependencies:
+    react-on-rails "16.6.0"
+
+react-on-rails@16.6.0:
+  version "16.6.0"
+  resolved "https://registry.npmjs.org/react-on-rails/-/react-on-rails-16.6.0.tgz#da7f117fec14f420f7f6ffe6bdb34b7fc2e01b3a"
+  integrity sha512-LqLi7A0n0Tv5c3yMYlwS9s6rE82gvXNMj3sscmK2LOgIJ+mLQlOX65n0Jq5ZJ4Nsl9SRgxEOOQmcrfvDeB9F1g==
 
 react-proxy@^1.1.7:
   version "1.1.8"
@@ -9059,12 +9073,13 @@ setprototypeof@1.2.0, setprototypeof@~1.2.0:
   resolved "https://registry.npmjs.org/setprototypeof/-/setprototypeof-1.2.0.tgz"
   integrity sha512-E5LDX7Wrp85Kil5bhZv46j8jOeboKq5JMmYM3gVGdGH8xFpPWXUMsNrlODCrkoxMEeNi/XZIwuRvY4XNwYMJpw==
 
-shakapacker@10.0.0-rc.0:
-  version "10.0.0-rc.0"
-  resolved "https://registry.npmjs.org/shakapacker/-/shakapacker-10.0.0-rc.0.tgz#472258e85c7aef3f705d36b6e06f303e680df8fa"
-  integrity sha512-Sv58iSE+z1N73o0ksAHPE2BrMjynTySttsc9EmiAdsqeW5U5KYC/N0CdCEXQxQoT5ybAYA2t0j+NJHdWIM/PCg==
+shakapacker@10.0.0:
+  version "10.0.0"
+  resolved "https://registry.npmjs.org/shakapacker/-/shakapacker-10.0.0.tgz#870f823531c7362836975ab9bb16732234a580a0"
+  integrity sha512-bLKU/xGxIpC/oXvTBRLnpH6bjVK/wyYeWiwE35zd3xxbcg6WfbbQxls0L/AmO8p560RR2PgfR3QtHb7klBmu0A==
   dependencies:
     js-yaml "^4.1.0"
+    pack-config-diff "^0.1.0"
     path-complete-extname "^1.0.0"
     webpack-merge "^5.8.0"
     yargs "^17.7.2"