Upgrade inertia to v3 (#258)

* Upgrade inertia to v3

* CI updates

* Update brakeman from 8.0.2 to 8.0.4 (required by scan_ruby step)
* Add void to createInertiaApp on ssr entrypoint (required by lint_js step)

* Update gem versions

Required by scan_ruby ci step due to vulnerabilities

* Drop ssr.tsx and pass entrypoint to vite

* Address ssr error in use-mobile hook

This addresses the error:

SSR ERROR  window is not defined
Source: hooks/use-mobile.ts:5:13

Author: nerlichman

Gemfile

@@ -3,7 +3,7 @@
 source "https://rubygems.org"
 
 # Bundle edge Rails instead: gem "rails", github: "rails/rails", branch: "main"
-gem "rails", "~> 8.1.1"
+gem "rails", "~> 8.1.3"
 # The modern asset pipeline for Rails [https://github.com/rails/propshaft]
 gem "propshaft"
 # Use sqlite3 as the database for Active Record
@@ -40,7 +40,7 @@ gem "thruster", require: false
 gem "vite_rails", "~> 3.0"
 
 # The Rails adapter for Inertia.js [https://inertia-rails.dev]
-gem "inertia_rails", "~> 3.6"
+gem "inertia_rails", "~> 3.19"
 
 # An authentication system generator for Rails applications
 # we leave gem here to watch for security updates

Gemfile.lock

@@ -1,68 +1,68 @@
 GEM
   remote: https://rubygems.org/
   specs:
-    action_text-trix (2.1.16)
+    action_text-trix (2.1.17)
       railties
-    actioncable (8.1.2)
-      actionpack (= 8.1.2)
-      activesupport (= 8.1.2)
+    actioncable (8.1.3)
+      actionpack (= 8.1.3)
+      activesupport (= 8.1.3)
       nio4r (~> 2.0)
       websocket-driver (>= 0.6.1)
       zeitwerk (~> 2.6)
-    actionmailbox (8.1.2)
-      actionpack (= 8.1.2)
-      activejob (= 8.1.2)
-      activerecord (= 8.1.2)
-      activestorage (= 8.1.2)
-      activesupport (= 8.1.2)
+    actionmailbox (8.1.3)
+      actionpack (= 8.1.3)
+      activejob (= 8.1.3)
+      activerecord (= 8.1.3)
+      activestorage (= 8.1.3)
+      activesupport (= 8.1.3)
       mail (>= 2.8.0)
-    actionmailer (8.1.2)
-      actionpack (= 8.1.2)
-      actionview (= 8.1.2)
-      activejob (= 8.1.2)
-      activesupport (= 8.1.2)
+    actionmailer (8.1.3)
+      actionpack (= 8.1.3)
+      actionview (= 8.1.3)
+      activejob (= 8.1.3)
+      activesupport (= 8.1.3)
       mail (>= 2.8.0)
       rails-dom-testing (~> 2.2)
-    actionpack (8.1.2)
-      actionview (= 8.1.2)
-      activesupport (= 8.1.2)
+    actionpack (8.1.3)
+      actionview (= 8.1.3)
+      activesupport (= 8.1.3)
       nokogiri (>= 1.8.5)
       rack (>= 2.2.4)
       rack-session (>= 1.0.1)
       rack-test (>= 0.6.3)
       rails-dom-testing (~> 2.2)
       rails-html-sanitizer (~> 1.6)
       useragent (~> 0.16)
-    actiontext (8.1.2)
+    actiontext (8.1.3)
       action_text-trix (~> 2.1.15)
-      actionpack (= 8.1.2)
-      activerecord (= 8.1.2)
-      activestorage (= 8.1.2)
-      activesupport (= 8.1.2)
+      actionpack (= 8.1.3)
+      activerecord (= 8.1.3)
+      activestorage (= 8.1.3)
+      activesupport (= 8.1.3)
       globalid (>= 0.6.0)
       nokogiri (>= 1.8.5)
-    actionview (8.1.2)
-      activesupport (= 8.1.2)
+    actionview (8.1.3)
+      activesupport (= 8.1.3)
       builder (~> 3.1)
       erubi (~> 1.11)
       rails-dom-testing (~> 2.2)
       rails-html-sanitizer (~> 1.6)
-    activejob (8.1.2)
-      activesupport (= 8.1.2)
+    activejob (8.1.3)
+      activesupport (= 8.1.3)
       globalid (>= 0.3.6)
-    activemodel (8.1.2)
-      activesupport (= 8.1.2)
-    activerecord (8.1.2)
-      activemodel (= 8.1.2)
-      activesupport (= 8.1.2)
+    activemodel (8.1.3)
+      activesupport (= 8.1.3)
+    activerecord (8.1.3)
+      activemodel (= 8.1.3)
+      activesupport (= 8.1.3)
       timeout (>= 0.4.0)
-    activestorage (8.1.2)
-      actionpack (= 8.1.2)
-      activejob (= 8.1.2)
-      activerecord (= 8.1.2)
-      activesupport (= 8.1.2)
+    activestorage (8.1.3)
+      actionpack (= 8.1.3)
+      activejob (= 8.1.3)
+      activerecord (= 8.1.3)
+      activesupport (= 8.1.3)
       marcel (~> 1.0)
-    activesupport (8.1.2)
+    activesupport (8.1.3)
       base64
       bigdecimal
       concurrent-ruby (~> 1.0, >= 1.3.1)
@@ -80,13 +80,13 @@ GEM
     ast (2.4.3)
     authentication-zero (4.0.3)
     base64 (0.3.0)
-    bcrypt (3.1.21)
+    bcrypt (3.1.22)
     bcrypt_pbkdf (1.1.2)
     bigdecimal (4.0.1)
     bindex (0.8.1)
     bootsnap (1.23.0)
       msgpack (~> 1.2)
-    brakeman (8.0.2)
+    brakeman (8.0.4)
       racc
     builder (3.3.0)
     bundler-audit (0.9.3)
@@ -135,7 +135,7 @@ GEM
       activesupport (>= 6.1)
     i18n (1.14.8)
       concurrent-ruby (~> 1.0)
-    inertia_rails (3.17.0)
+    inertia_rails (3.19.0)
       railties (>= 6)
     io-console (0.8.2)
     irb (1.17.0)
@@ -149,7 +149,7 @@ GEM
     js-routes (2.3.6)
       railties (>= 5)
       sorbet-runtime
-    json (2.18.1)
+    json (2.19.2)
     kamal (2.10.1)
       activesupport (>= 7.0)
       base64 (~> 0.2)
@@ -170,7 +170,7 @@ GEM
       launchy (>= 2.2, < 4)
     lint_roller (1.1.0)
     logger (1.7.0)
-    loofah (2.25.0)
+    loofah (2.25.1)
       crass (~> 1.0.2)
       nokogiri (>= 1.12.0)
     mail (2.9.0)
@@ -201,19 +201,19 @@ GEM
       net-protocol
     net-ssh (7.3.0)
     nio4r (2.7.5)
-    nokogiri (1.19.0-aarch64-linux-gnu)
+    nokogiri (1.19.1-aarch64-linux-gnu)
       racc (~> 1.4)
-    nokogiri (1.19.0-aarch64-linux-musl)
+    nokogiri (1.19.1-aarch64-linux-musl)
       racc (~> 1.4)
-    nokogiri (1.19.0-arm-linux-gnu)
+    nokogiri (1.19.1-arm-linux-gnu)
       racc (~> 1.4)
-    nokogiri (1.19.0-arm-linux-musl)
+    nokogiri (1.19.1-arm-linux-musl)
       racc (~> 1.4)
-    nokogiri (1.19.0-arm64-darwin)
+    nokogiri (1.19.1-arm64-darwin)
       racc (~> 1.4)
-    nokogiri (1.19.0-x86_64-linux-gnu)
+    nokogiri (1.19.1-x86_64-linux-gnu)
       racc (~> 1.4)
-    nokogiri (1.19.0-x86_64-linux-musl)
+    nokogiri (1.19.1-x86_64-linux-musl)
       racc (~> 1.4)
     ostruct (0.6.3)
     parallel (1.27.0)
@@ -236,7 +236,7 @@ GEM
       nio4r (~> 2.0)
     raabro (1.4.0)
     racc (1.8.1)
-    rack (3.2.4)
+    rack (3.2.5)
     rack-proxy (0.7.7)
       rack
     rack-session (2.1.1)
@@ -246,30 +246,30 @@ GEM
       rack (>= 1.3)
     rackup (2.3.1)
       rack (>= 3)
-    rails (8.1.2)
-      actioncable (= 8.1.2)
-      actionmailbox (= 8.1.2)
-      actionmailer (= 8.1.2)
-      actionpack (= 8.1.2)
-      actiontext (= 8.1.2)
-      actionview (= 8.1.2)
-      activejob (= 8.1.2)
-      activemodel (= 8.1.2)
-      activerecord (= 8.1.2)
-      activestorage (= 8.1.2)
-      activesupport (= 8.1.2)
+    rails (8.1.3)
+      actioncable (= 8.1.3)
+      actionmailbox (= 8.1.3)
+      actionmailer (= 8.1.3)
+      actionpack (= 8.1.3)
+      actiontext (= 8.1.3)
+      actionview (= 8.1.3)
+      activejob (= 8.1.3)
+      activemodel (= 8.1.3)
+      activerecord (= 8.1.3)
+      activestorage (= 8.1.3)
+      activesupport (= 8.1.3)
       bundler (>= 1.15.0)
-      railties (= 8.1.2)
+      railties (= 8.1.3)
     rails-dom-testing (2.3.0)
       activesupport (>= 5.0.0)
       minitest
       nokogiri (>= 1.6)
     rails-html-sanitizer (1.6.2)
       loofah (~> 2.21)
       nokogiri (>= 1.15.7, != 1.16.7, != 1.16.6, != 1.16.5, != 1.16.4, != 1.16.3, != 1.16.2, != 1.16.1, != 1.16.0.rc1, != 1.16.0)
-    railties (8.1.2)
-      actionpack (= 8.1.2)
-      activesupport (= 8.1.2)
+    railties (8.1.3)
+      actionpack (= 8.1.3)
+      activesupport (= 8.1.3)
       irb (~> 1.13)
       rackup (>= 1.0.0)
       rake (>= 12.2)
@@ -431,14 +431,14 @@ DEPENDENCIES
   capybara-lockstep
   debug
   factory_bot_rails
-  inertia_rails (~> 3.6)
+  inertia_rails (~> 3.19)
   jbuilder
   js-routes
   kamal
   letter_opener
   propshaft
   puma (>= 5.0)
-  rails (~> 8.1.1)
+  rails (~> 8.1.3)
   rspec-rails (~> 8.0)
   rubocop-rails-omakase
   selenium-webdriver

app/frontend/entrypoints/inertia.tsx

@@ -1,7 +1,4 @@
-import type { ResolvedComponent } from "@inertiajs/react"
 import { createInertiaApp } from "@inertiajs/react"
-import { StrictMode } from "react"
-import { createRoot } from "react-dom/client"
 
 import { initializeTheme } from "@/hooks/use-appearance"
 import PersistentLayout from "@/layouts/persistent-layout"
@@ -14,51 +11,17 @@ void createInertiaApp({
   //
   title: (title) => (title ? `${title} - ${appName}` : appName),
 
-  resolve: (name) => {
-    const pages = import.meta.glob<{ default: ResolvedComponent }>(
-      "../pages/**/*.tsx",
-      {
-        eager: true,
-      },
-    )
-    const page = pages[`../pages/${name}.tsx`]
-    if (!page) {
-      console.error(`Missing Inertia page component: '${name}.tsx'`)
-    }
-
-    // To use a default layout, import the Layout component
-    // and use the following line.
-    // see https://inertia-rails.dev/guide/pages#default-layouts
-    //
-    page.default.layout ??= [PersistentLayout]
+  pages: "../pages",
 
-    return page
-  },
+  layout: () => [PersistentLayout],
 
-  setup({ el, App, props }) {
-    // Uncomment the following to enable SSR hydration:
-    // if (el.hasChildNodes()) {
-    //   hydrateRoot(el, <App {...props} />)
-    //   return
-    // }
-    createRoot(el).render(
-      <StrictMode>
-        <App {...props} />
-      </StrictMode>,
-    )
-  },
+  strictMode: true,
 
   defaults: {
     form: {
       forceIndicesArrayFormatInFormData: false,
       withAllErrors: true,
     },
-    future: {
-      useScriptElementForInitialPage: true,
-      useDataInertiaHeadAttribute: true,
-      useDialogForErrorModal: true,
-      preserveEqualProps: true,
-    },
   },
 
   progress: {
@@ -80,4 +43,6 @@ void createInertiaApp({
 })
 
 // This will set light / dark mode on load...
-initializeTheme()
+if (typeof localStorage !== "undefined") {
+  initializeTheme()
+}

app/frontend/hooks/use-mobile.ts

@@ -2,20 +2,27 @@ import { useSyncExternalStore } from "react"
 
 const MOBILE_BREAKPOINT = 768
 
-const mql = window.matchMedia(`(max-width: ${MOBILE_BREAKPOINT - 1}px)`)
+const mql =
+  typeof window !== "undefined"
+    ? window.matchMedia(`(max-width: ${MOBILE_BREAKPOINT - 1}px)`)
+    : null
 
 function mediaQueryListener(callback: (event: MediaQueryListEvent) => void) {
-  mql.addEventListener("change", callback)
+  mql?.addEventListener("change", callback)
 
   return () => {
-    mql.removeEventListener("change", callback)
+    mql?.removeEventListener("change", callback)
   }
 }
 
 function isSmallerThanBreakpoint() {
-  return mql.matches
+  return mql!.matches
 }
 
 export function useIsMobile() {
-  return useSyncExternalStore(mediaQueryListener, isSmallerThanBreakpoint)
+  return useSyncExternalStore(
+    mediaQueryListener,
+    isSmallerThanBreakpoint,
+    () => false,
+  )
 }

app/frontend/routes/index.d.ts

@@ -1,5 +1,5 @@
 /**
- * @file Generated by js-routes 2.3.6. Based on Rails 8.1.2 routes of ReactStarterKit::Application.
+ * @file Generated by js-routes 2.3.6. Based on Rails 8.1.3 routes of ReactStarterKit::Application.
  * @version 743c630cafd479b5d9ad42a7803e8be1fdeb9448419ce21d215b267e2b0ae749
  * @see https://github.com/railsware/js-routes
  */

app/frontend/routes/index.js

@@ -1,5 +1,5 @@
 /**
- * @file Generated by js-routes 2.3.6. Based on Rails 8.1.2 routes of ReactStarterKit::Application.
+ * @file Generated by js-routes 2.3.6. Based on Rails 8.1.3 routes of ReactStarterKit::Application.
  * @version 743c630cafd479b5d9ad42a7803e8be1fdeb9448419ce21d215b267e2b0ae749
  * @see https://github.com/railsware/js-routes
  */