Add a user friendly maintenance page

dutow · dutow · commit ef871b7f5dab · 2026-01-17T21:15:19.000+01:00
So that we don't simply display "Internal server error" when migrations
are pending.
diff --git a/app/middleware/pending_migration_catcher.rb b/app/middleware/pending_migration_catcher.rb
@@ -0,0 +1,98 @@
+# frozen_string_literal: true
+
+class PendingMigrationCatcher
+  def initialize(app)
+    @app = app
+  end
+
+  def call(env)
+    @app.call(env)
+  rescue ActiveRecord::PendingMigrationError, ActiveRecord::NoDatabaseError => e
+    render_maintenance_page(e)
+  end
+
+  private
+
+  def render_maintenance_page(_error)
+    html = <<~HTML
+      <!DOCTYPE html>
+      <html>
+      <head>
+        <title>Upgrade in Progress</title>
+        <meta name="viewport" content="width=device-width, initial-scale=1">
+        <meta http-equiv="refresh" content="30">
+        <style>
+          * { margin: 0; padding: 0; box-sizing: border-box; }
+          body {
+            font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
+            background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
+            min-height: 100vh;
+            display: flex;
+            align-items: center;
+            justify-content: center;
+            padding: 20px;
+          }
+          .container {
+            background: white;
+            border-radius: 16px;
+            padding: 48px;
+            max-width: 500px;
+            text-align: center;
+            box-shadow: 0 25px 50px -12px rgba(0, 0, 0, 0.25);
+          }
+          .icon {
+            font-size: 64px;
+            margin-bottom: 24px;
+          }
+          h1 {
+            color: #1a202c;
+            font-size: 28px;
+            margin-bottom: 16px;
+          }
+          p {
+            color: #4a5568;
+            font-size: 16px;
+            line-height: 1.6;
+            margin-bottom: 24px;
+          }
+          .spinner {
+            width: 40px;
+            height: 40px;
+            border: 4px solid #e2e8f0;
+            border-top-color: #667eea;
+            border-radius: 50%;
+            animation: spin 1s linear infinite;
+            margin: 0 auto;
+          }
+          @keyframes spin {
+            to { transform: rotate(360deg); }
+          }
+          .note {
+            color: #718096;
+            font-size: 14px;
+            margin-top: 24px;
+          }
+        </style>
+      </head>
+      <body>
+        <div class="container">
+          <div class="icon">🚀</div>
+          <h1>Upgrade in Progress</h1>
+          <p>We're currently upgrading the system to bring you new features and improvements. This should only take a moment.</p>
+          <div class="spinner"></div>
+          <p class="note">This page will automatically refresh.</p>
+        </div>
+      </body>
+      </html>
+    HTML
+
+    [
+      503,
+      {
+        "Content-Type" => "text/html; charset=utf-8",
+        "Retry-After" => "30"
+      },
+      [html]
+    ]
+  end
+end
diff --git a/config/application.rb b/config/application.rb
@@ -16,12 +16,7 @@ class Application < Rails::Application
     # Common ones are `templates`, `generators`, or `middleware`, for example.
     config.autoload_lib(ignore: %w[assets tasks])
 
-    # Configuration for the application, engines, and railties goes here.
-    #
-    # These settings can be overridden in specific environments using the files
-    # in config/environments, which are processed later.
-    #
-    # config.time_zone = "Central Time (US & Canada)"
-    # config.eager_load_paths << Rails.root.join("extras")
+    require_relative "../app/middleware/pending_migration_catcher"
+    config.middleware.insert_before ActionDispatch::ShowExceptions, PendingMigrationCatcher
   end
 end
diff --git a/config/routes.rb b/config/routes.rb
@@ -4,9 +4,13 @@
   end
   # Define your application routes per the DSL in https://guides.rubyonrails.org/routing.html
 
-  # Reveal health status on /up that returns 200 if the app boots with no exceptions, otherwise 500.
-  # Can be used by load balancers and uptime monitors to verify that the app is live.
   get "up" => "rails/health#show", as: :rails_health_check
+
+  if Rails.env.development?
+    get "preview/maintenance" => ->(env) {
+      PendingMigrationCatcher.new(nil).send(:render_maintenance_page, nil)
+    }
+  end
   get "messages/by-id/*message_id", to: "messages#by_message_id", as: :message_by_id, format: false
 
   # Render dynamic PWA files from app/views/pwa/* (remember to link manifest in application.html.erb)
