pg_reports 0.5.4 → 0.6.1

data/app/controllers/pg_reports/dashboard_controller.rb

@@ -19,7 +19,7 @@ module PgReports
 
     def reset_statistics
       PgReports.reset_statistics!
-      render json: {success: true, message: "Statistics have been reset successfully"}
+      render json: {success: true, message: I18n.t("pg_reports.ui.success.statistics_reset")}
     rescue => e
       render json: {success: false, error: e.message}, status: :unprocessable_entity
     end
@@ -35,7 +35,7 @@ module PgReports
         if data[:connections][:total].nil? && data[:transactions][:total].nil?
           render json: {
             success: false,
-            error: "Unable to fetch database statistics. Check database permissions.",
+            error: I18n.t("pg_reports.ui.errors.fetch_metrics_check_perms"),
             available: false
           }, status: :service_unavailable
           return
@@ -50,7 +50,7 @@ module PgReports
       rescue PG::InsufficientPrivilege
         render json: {
           success: false,
-          error: "Insufficient database permissions to access statistics views",
+          error: I18n.t("pg_reports.ui.errors.insufficient_database_perms"),
           available: false
         }, status: :forbidden
       rescue => e
@@ -68,7 +68,7 @@ module PgReports
       @report_info = Dashboard::ReportsRegistry.find(@category, @report_key)
 
       if @report_info.nil?
-        redirect_to root_path, alert: "Report not found"
+        redirect_to root_path, alert: I18n.t("pg_reports.ui.errors.report_not_found")
         return
       end
 
@@ -138,7 +138,7 @@ module PgReports
         report.send_to_telegram
       end
 
-      render json: {success: true, message: "Report sent to Telegram"}
+      render json: {success: true, message: I18n.t("pg_reports.ui.success.telegram_sent")}
     rescue => e
       render json: {success: false, error: e.message}, status: :unprocessable_entity
     end
@@ -177,7 +177,7 @@ module PgReports
       query_params = params[:params] || {}
 
       if query_hash.blank?
-        render json: {success: false, error: "Query hash is required"}, status: :unprocessable_entity
+        render json: {success: false, error: I18n.t("pg_reports.ui.errors.query_hash_required")}, status: :unprocessable_entity
         return
       end
 
@@ -185,7 +185,7 @@ module PgReports
       unless PgReports.config.allow_raw_query_execution
         render json: {
           success: false,
-          error: "Query execution from dashboard is disabled. Enable it in configuration with 'config.allow_raw_query_execution = true'"
+          error: I18n.t("pg_reports.ui.errors.query_execution_disabled")
         }, status: :forbidden
         return
       end
@@ -195,11 +195,11 @@ module PgReports
         query = retrieve_query_by_hash(query_hash)
 
         if query.nil?
-          render json: {success: false, error: "Query not found or expired. Please refresh the page."}, status: :not_found
+          render json: {success: false, error: I18n.t("pg_reports.ui.errors.query_not_found_expired")}, status: :not_found
           return
         end
       rescue SecurityError => e
-        render json: {success: false, error: "Security violation: #{e.message}"}, status: :forbidden
+        render json: {success: false, error: "#{I18n.t("pg_reports.ui.errors.security_violation_prefix")} #{e.message}"}, status: :forbidden
         return
       end
 
@@ -207,7 +207,7 @@ module PgReports
       if query.match?(/\b(NEW|OLD)\./i)
         render json: {
           success: false,
-          error: "Cannot EXPLAIN ANALYZE queries with trigger variables (NEW, OLD). These are only available within trigger functions."
+          error: I18n.t("pg_reports.ui.errors.trigger_variables_not_allowed")
         }, status: :unprocessable_entity
         return
       end
@@ -219,7 +219,7 @@ module PgReports
       if final_query.match?(/\$\d+/)
         render json: {
           success: false,
-          error: "Please provide values for all parameter placeholders ($1, $2, etc.)"
+          error: I18n.t("pg_reports.ui.errors.missing_parameter_values")
         }, status: :unprocessable_entity
         return
       end
@@ -248,7 +248,7 @@ module PgReports
       query_params = params[:params] || {}
 
       if query_hash.blank?
-        render json: {success: false, error: "Query hash is required"}, status: :unprocessable_entity
+        render json: {success: false, error: I18n.t("pg_reports.ui.errors.query_hash_required")}, status: :unprocessable_entity
         return
       end
 
@@ -256,7 +256,7 @@ module PgReports
       unless PgReports.config.allow_raw_query_execution
         render json: {
           success: false,
-          error: "Query execution from dashboard is disabled. Enable it in configuration with 'config.allow_raw_query_execution = true'"
+          error: I18n.t("pg_reports.ui.errors.query_execution_disabled")
         }, status: :forbidden
         return
       end
@@ -266,11 +266,11 @@ module PgReports
         query = retrieve_query_by_hash(query_hash)
 
         if query.nil?
-          render json: {success: false, error: "Query not found or expired. Please refresh the page."}, status: :not_found
+          render json: {success: false, error: I18n.t("pg_reports.ui.errors.query_not_found_expired")}, status: :not_found
           return
         end
       rescue SecurityError => e
-        render json: {success: false, error: "Security violation: #{e.message}"}, status: :forbidden
+        render json: {success: false, error: "#{I18n.t("pg_reports.ui.errors.security_violation_prefix")} #{e.message}"}, status: :forbidden
         return
       end
 
@@ -281,7 +281,7 @@ module PgReports
       if final_query.match?(/\$\d+/)
         render json: {
           success: false,
-          error: "Please provide values for all parameter placeholders ($1, $2, etc.)"
+          error: I18n.t("pg_reports.ui.errors.missing_parameter_values")
         }, status: :unprocessable_entity
         return
       end
@@ -326,7 +326,7 @@ module PgReports
       unless Rails.env.development?
         render json: {
           success: false,
-          error: "Migration creation is only allowed in development environment"
+          error: I18n.t("pg_reports.ui.errors.migration_dev_only")
         }, status: :forbidden
         return
       end
@@ -335,28 +335,28 @@ module PgReports
       code = params[:code]
 
       if file_name.blank? || code.blank?
-        render json: {success: false, error: "File name and code are required"}, status: :unprocessable_entity
+        render json: {success: false, error: I18n.t("pg_reports.ui.errors.filename_code_required")}, status: :unprocessable_entity
         return
       end
 
       # Sanitize file name
       safe_file_name = file_name.gsub(/[^a-z0-9_.]/, "")
       unless safe_file_name.match?(/\A\d{14}_\w+\.rb\z/)
-        render json: {success: false, error: "Invalid migration file name format"}, status: :unprocessable_entity
+        render json: {success: false, error: I18n.t("pg_reports.ui.errors.invalid_filename_format")}, status: :unprocessable_entity
         return
       end
 
       # Find migrations directory
       migrations_path = Rails.root.join("db", "migrate")
       unless migrations_path.exist?
-        render json: {success: false, error: "Migrations directory not found"}, status: :unprocessable_entity
+        render json: {success: false, error: I18n.t("pg_reports.ui.errors.migrations_dir_not_found")}, status: :unprocessable_entity
         return
       end
 
       file_path = migrations_path.join(safe_file_name)
       File.write(file_path, code)
 
-      render json: {success: true, file_path: file_path.to_s, message: "Migration created successfully"}
+      render json: {success: true, file_path: file_path.to_s, message: I18n.t("pg_reports.ui.success.migration_created")}
     rescue => e
       render json: {success: false, error: e.message}, status: :unprocessable_entity
     end

data/app/views/layouts/pg_reports/application.html.erb

@@ -1,10 +1,10 @@
 <!DOCTYPE html>
-<html lang="en">
+<html lang="<%= I18n.locale %>">
 <head>
   <meta charset="UTF-8">
   <meta name="viewport" content="width=device-width, initial-scale=1.0">
   <meta name="pg-reports-root" content="<%= request.script_name.presence || PgReports::Engine.routes.url_helpers.root_path %>">
-  <title>PgReports Dashboard</title>
+  <title><%= t("pg_reports.ui.branding.page_title") %></title>
   <link rel="icon" type="image/svg+xml" href="data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32'%3E%3Crect width='32' height='32' rx='6' fill='%234f46e5'/%3E%3Crect x='5' y='18' width='5' height='9' rx='1' fill='%23fff'/%3E%3Crect x='13.5' y='12' width='5' height='15' rx='1' fill='%23fff'/%3E%3Crect x='22' y='6' width='5' height='21' rx='1' fill='%23fff'/%3E%3C/svg%3E">
   <% if PgReports.config.load_external_fonts %>
     <link rel="preconnect" href="https://fonts.googleapis.com">
@@ -13,22 +13,22 @@
   <% end %>
   <style>
     :root {
-      --bg-primary: #0f1114;
-      --bg-secondary: #161a1e;
-      --bg-tertiary: #1e2328;
-      --bg-card: #1a1e23;
-      --border-color: #2d3339;
-      --text-primary: #d4d7dc;
-      --text-secondary: #9ca3ab;
-      --text-muted: #6b7280;
-      --accent-purple: #9d8cd6;
-      --accent-blue: #6b9fe8;
-      --accent-green: #5fb89a;
-      --accent-amber: #d4a056;
-      --accent-rose: #d97084;
-      --accent-indigo: #8b8fd9;
-      --gradient-start: #6b9fe8;
-      --gradient-end: #8b8fd9;
+      --bg-primary: #151719;
+      --bg-secondary: #1c1f22;
+      --bg-tertiary: #232629;
+      --bg-card: #1c1f22;
+      --border-color: #2e3235;
+      --text-primary: #c9cbcd;
+      --text-secondary: #888d93;
+      --text-muted: #5e6369;
+      --accent-purple: #7c8af6;
+      --accent-blue: #5c9eed;
+      --accent-green: #45a87a;
+      --accent-amber: #c89030;
+      --accent-rose: #d45d6e;
+      --accent-indigo: #7c8af6;
+      --gradient-start: #7c8af6;
+      --gradient-end: #7c8af6;
     }
 
     * {
@@ -68,27 +68,45 @@
     }
 
     .logo-icon {
-      width: 44px;
-      height: 44px;
-      background: linear-gradient(135deg, var(--gradient-start), var(--gradient-end));
+      width: 32px;
+      height: 32px;
+      background: var(--accent-purple);
       border-radius: 6px;
       display: flex;
       align-items: center;
       justify-content: center;
-      font-size: 1.4rem;
+      font-size: 1rem;
+    }
+
+    .logo-text {
+      display: flex;
+      flex-direction: column;
+      gap: 5px;
+      line-height: 1.15;
     }
 
     .logo-text h1 {
-      font-size: 1.25rem;
-      font-weight: 700;
-      background: linear-gradient(135deg, var(--text-primary), var(--text-secondary));
-      -webkit-background-clip: text;
-      -webkit-text-fill-color: transparent;
+      font-size: 1.1rem;
+      font-weight: 600;
+      color: var(--text-primary);
+      line-height: 1.15;
+      margin-top: -3px;
+      display: flex;
+      align-items: baseline;
+      gap: 0.5rem;
     }
 
-    .logo-text span {
-      font-size: 0.75rem;
+    .logo-version {
+      font-size: 0.7rem;
+      font-weight: 500;
+      color: var(--text-muted);
+      letter-spacing: 0.02em;
+    }
+
+    .logo-subtitle {
+      font-size: 0.7rem;
       color: var(--text-muted);
+      line-height: 1.15;
     }
 
     .header-badge {
@@ -130,14 +148,12 @@
     .category-card {
       background: var(--bg-card);
       border: 1px solid var(--border-color);
-      border-radius: 8px;
+      border-radius: 6px;
       padding: 1rem;
-      transition: all 0.2s ease;
     }
 
     .category-card:hover {
-      border-color: var(--accent-purple);
-      transform: translateY(-1px);
+      border-color: #3e4347;
     }
 
     .category-header {
@@ -148,13 +164,15 @@
     }
 
     .category-icon {
-      width: 36px;
-      height: 36px;
-      border-radius: 6px;
+      width: 28px;
+      height: 28px;
+      border-radius: 4px;
       display: flex;
       align-items: center;
       justify-content: center;
-      font-size: 1.125rem;
+      font-size: 0.95rem;
+      background: transparent !important;
+      color: var(--text-secondary) !important;
     }
 
     .category-title {
@@ -181,19 +199,18 @@
       display: flex;
       align-items: center;
       justify-content: space-between;
-      padding: 0.6rem 0.875rem;
-      background: var(--bg-tertiary);
+      padding: 0.45rem 0.7rem;
+      background: transparent;
       border: 1px solid transparent;
-      border-radius: 6px;
+      border-radius: 4px;
       color: var(--text-secondary);
       text-decoration: none;
-      font-size: 0.85rem;
-      transition: all 0.15s ease;
+      font-size: 0.82rem;
+      transition: background 0.1s, color 0.1s;
     }
 
     .report-link:hover {
-      background: var(--bg-secondary);
-      border-color: var(--border-color);
+      background: var(--bg-tertiary);
       color: var(--text-primary);
     }
 
@@ -208,6 +225,20 @@
       transform: translateX(0);
     }
 
+    .report-badge-new {
+      display: inline-block;
+      margin-left: 0.4rem;
+      padding: 0.1rem 0.35rem;
+      font-size: 0.55rem;
+      font-weight: 600;
+      letter-spacing: 0.04em;
+      line-height: 1.2;
+      color: var(--accent-green);
+      background: rgba(69, 168, 122, 0.12);
+      border-radius: 3px;
+      vertical-align: middle;
+    }
+
     /* Report Detail Page */
     .report-page {
       display: flex;
@@ -230,7 +261,7 @@
     }
 
     .breadcrumb a:hover {
-      color: var(--accent-purple);
+      color: var(--text-primary);
     }
 
     .report-header {
@@ -264,25 +295,24 @@
       height: 36px;
       padding: 0 1rem;
       border: 1px solid transparent;
-      border-radius: 6px;
+      border-radius: 4px;
       font-family: inherit;
       font-size: 0.8rem;
       font-weight: 500;
       cursor: pointer;
-      transition: all 0.15s ease;
+      transition: background 0.1s;
       white-space: nowrap;
       text-decoration: none;
     }
 
     .btn-primary {
-      background: linear-gradient(135deg, var(--gradient-start), var(--gradient-end));
-      color: white;
-      border-color: transparent;
+      background: var(--accent-purple);
+      color: #fff;
+      border-color: var(--accent-purple);
     }
 
     .btn-primary:hover {
-      opacity: 0.9;
-      transform: translateY(-1px);
+      background: #6b79e4;
     }
 
     .btn-secondary {
@@ -292,19 +322,19 @@
     }
 
     .btn-secondary:hover {
-      background: var(--bg-secondary);
+      background: #2a2d31;
       color: var(--text-primary);
     }
 
     .btn-telegram {
-      background: #4a9ebe;
-      color: white;
-      border-color: #4a9ebe;
+      background: var(--bg-tertiary);
+      color: var(--text-secondary);
+      border: 1px solid var(--border-color);
     }
 
     .btn-telegram:hover {
-      background: #5aaccc;
-      border-color: #5aaccc;
+      background: #2a2d31;
+      color: var(--text-primary);
     }
 
     .btn:disabled {
@@ -316,7 +346,7 @@
     .results-container {
       background: var(--bg-card);
       border: 1px solid var(--border-color);
-      border-radius: 8px;
+      border-radius: 6px;
       overflow: hidden;
     }
 
@@ -462,22 +492,51 @@
     .modal {
       position: fixed;
       inset: 0;
-      background: rgba(0, 0, 0, 0.7);
+      background: rgba(0, 0, 0, 0.6);
       display: flex;
       align-items: center;
       justify-content: center;
       z-index: 1000;
-      backdrop-filter: blur(4px);
     }
 
     .modal-content {
       background: var(--bg-card);
       border: 1px solid var(--border-color);
-      border-radius: 8px;
+      border-radius: 6px;
       max-width: 900px;
       width: 90%;
       max-height: 90vh;
       overflow: auto;
+      scrollbar-width: thin;
+      scrollbar-color: var(--border-color) var(--bg-secondary);
+    }
+
+    .modal-content::-webkit-scrollbar,
+    .modal-body::-webkit-scrollbar {
+      width: 8px;
+      height: 8px;
+    }
+
+    .modal-content::-webkit-scrollbar-track,
+    .modal-body::-webkit-scrollbar-track {
+      background: var(--bg-secondary);
+      border-radius: 4px;
+    }
+
+    .modal-content::-webkit-scrollbar-thumb,
+    .modal-body::-webkit-scrollbar-thumb {
+      background: var(--border-color);
+      border-radius: 4px;
+    }
+
+    .modal-content::-webkit-scrollbar-thumb:hover,
+    .modal-body::-webkit-scrollbar-thumb:hover {
+      background: var(--text-muted);
+    }
+
+    .modal-content::-webkit-scrollbar-corner,
+    .modal-body::-webkit-scrollbar-corner {
+      background: var(--bg-secondary);
     }
 
     .modal-large {
@@ -553,7 +612,7 @@
       margin-bottom: 1.5rem;
       background: var(--bg-card);
       border: 1px solid var(--border-color);
-      border-radius: 8px;
+      border-radius: 6px;
       padding: 0.875rem 1rem;
     }
 
@@ -899,7 +958,7 @@
       padding: 0.75rem 1rem;
       background: var(--bg-tertiary);
       border: 1px solid var(--border-color);
-      border-radius: 8px;
+      border-radius: 6px;
       cursor: pointer;
       transition: all 0.15s;
     }
@@ -945,6 +1004,13 @@
 
   <script>
     const pgReportsRoot = document.querySelector('meta[name="pg-reports-root"]')?.content || '/pg_reports';
+    window.PG_REPORTS_I18N = <%= raw I18n.t("pg_reports.ui").to_json %>;
+
+    // Format strings with %{var} placeholders
+    window.pgReportsFormat = function(template, vars) {
+      if (!template) return '';
+      return template.replace(/%\{(\w+)\}/g, function(_, k) { return vars[k] != null ? vars[k] : ''; });
+    };
 
     function showToast(message, type = 'success') {
       const toast = document.getElementById('toast');
@@ -958,7 +1024,7 @@
     async function sendToTelegram(category, report, button) {
       if (button) {
         button.disabled = true;
-        button.innerHTML = '<span class="spinner" style="width:16px;height:16px;border-width:2px;display:inline-block;vertical-align:middle;"></span> Sending...';
+        button.innerHTML = '<span class="spinner" style="width:16px;height:16px;border-width:2px;display:inline-block;vertical-align:middle;"></span> ' + PG_REPORTS_I18N.actions.sending;
       }
 
       try {
@@ -973,17 +1039,17 @@
         const data = await response.json();
 
         if (data.success) {
-          showToast('Report sent to Telegram');
+          showToast(PG_REPORTS_I18N.success.telegram_sent);
         } else {
-          showToast(data.error || 'Failed to send to Telegram', 'error');
+          showToast(data.error || PG_REPORTS_I18N.errors.send_telegram_failed, 'error');
         }
       } catch (error) {
-        showToast('Network error: ' + error.message, 'error');
+        showToast(PG_REPORTS_I18N.errors.network_error_prefix + ' ' + error.message, 'error');
       }
 
       if (button) {
         button.disabled = false;
-        button.innerHTML = '📨 Telegram';
+        button.innerHTML = PG_REPORTS_I18N.actions.send_telegram;
       }
     }
   </script>

data/app/views/pg_reports/dashboard/_show_modals.html.erb

@@ -2,39 +2,39 @@
 <div id="ide-settings-modal" class="modal" style="display: none;">
   <div class="modal-content modal-small">
     <div class="modal-header">
-      <h3>⚙️ IDE Settings</h3>
+      <h3><%= t("pg_reports.ui.modals.ide_settings_title") %></h3>
       <button class="modal-close" onclick="closeIdeSettingsModal()">&times;</button>
     </div>
     <div class="modal-body">
-      <p class="settings-label">Default IDE for source links:</p>
+      <p class="settings-label"><%= t("pg_reports.ui.settings.default_ide_label") %></p>
       <div class="ide-options">
         <label class="ide-option">
           <input type="radio" name="default-ide" value="" onchange="setDefaultIde('')">
-          <span>Show menu (default)</span>
+          <span><%= t("pg_reports.ui.settings.ide_show_menu") %></span>
         </label>
         <label class="ide-option">
           <input type="radio" name="default-ide" value="vscode-wsl" onchange="setDefaultIde('vscode-wsl')">
-          <span>VS Code (WSL)</span>
+          <span><%= t("pg_reports.ui.settings.ide_vscode_wsl") %></span>
         </label>
         <label class="ide-option">
           <input type="radio" name="default-ide" value="vscode" onchange="setDefaultIde('vscode')">
-          <span>VS Code</span>
+          <span><%= t("pg_reports.ui.settings.ide_vscode") %></span>
         </label>
         <label class="ide-option">
           <input type="radio" name="default-ide" value="rubymine" onchange="setDefaultIde('rubymine')">
-          <span>RubyMine</span>
+          <span><%= t("pg_reports.ui.settings.ide_rubymine") %></span>
         </label>
         <label class="ide-option">
           <input type="radio" name="default-ide" value="intellij" onchange="setDefaultIde('intellij')">
-          <span>IntelliJ IDEA</span>
+          <span><%= t("pg_reports.ui.settings.ide_intellij") %></span>
         </label>
         <label class="ide-option">
           <input type="radio" name="default-ide" value="cursor-wsl" onchange="setDefaultIde('cursor-wsl')">
-          <span>Cursor (WSL)</span>
+          <span><%= t("pg_reports.ui.settings.ide_cursor_wsl") %></span>
         </label>
         <label class="ide-option">
           <input type="radio" name="default-ide" value="cursor" onchange="setDefaultIde('cursor')">
-          <span>Cursor</span>
+          <span><%= t("pg_reports.ui.settings.ide_cursor") %></span>
         </label>
       </div>
     </div>
@@ -45,7 +45,7 @@
 <div id="problem-modal" class="problem-modal" style="display: none;">
   <div class="problem-modal-content">
     <div class="problem-modal-header">
-      <h3>⚠️ Problem Detected</h3>
+      <h3><%= t("pg_reports.ui.modals.problem_detected_title") %></h3>
       <button class="modal-close" onclick="closeProblemModal()">&times;</button>
     </div>
     <div class="problem-modal-body" id="problem-modal-body">
@@ -58,24 +58,24 @@
 <div id="explain-modal" class="modal" style="display: none;">
   <div class="modal-content modal-wide">
     <div class="modal-header">
-      <h3>📊 Query Analyzer</h3>
+      <h3><%= t("pg_reports.ui.modals.query_analyzer_title") %></h3>
       <button class="modal-close" onclick="closeExplainModal()">&times;</button>
     </div>
     <div class="modal-body" id="explain-modal-body">
       <div class="explain-query-section">
-        <label class="explain-label">Query:</label>
+        <label class="explain-label"><%= t("pg_reports.ui.modals.query_label") %></label>
         <pre class="explain-query" id="explain-query-display"></pre>
       </div>
       <div id="explain-params-section" class="explain-params-section" style="display: none;">
-        <label class="explain-label">Parameters:</label>
+        <label class="explain-label"><%= t("pg_reports.ui.modals.parameters_label") %></label>
         <div id="explain-params-inputs"></div>
       </div>
       <div class="explain-actions">
         <button class="btn btn-secondary" onclick="executeExplainAnalyze()" id="btn-explain">
-          📊 EXPLAIN ANALYZE
+          <%= t("pg_reports.ui.actions.explain_analyze") %>
         </button>
         <button class="btn btn-secondary" onclick="executeQuery()" id="btn-execute">
-          ▶ Execute Query
+          <%= t("pg_reports.ui.actions.execute_query") %>
         </button>
       </div>
       <div id="explain-loading" class="loading" style="display: none;">
@@ -90,22 +90,22 @@
 <div id="migration-modal" class="modal" style="display: none;">
   <div class="modal-content">
     <div class="modal-header">
-      <h3>🗑️ Drop Index Migration</h3>
+      <h3><%= t("pg_reports.ui.modals.migration_title") %></h3>
       <button class="modal-close" onclick="closeMigrationModal()">&times;</button>
     </div>
     <div class="modal-body" id="migration-modal-body">
       <div class="migration-warning" style="background: rgba(255, 152, 0, 0.1); border: 1px solid rgba(255, 152, 0, 0.3); padding: 1rem; border-radius: 8px; margin-bottom: 1rem;">
-        <p style="margin: 0 0 0.5rem 0; font-weight: 600; color: #ffb74d;">⚠️ Warning</p>
+        <p style="margin: 0 0 0.5rem 0; font-weight: 600; color: #ffb74d;"><%= t("pg_reports.ui.documentation.threshold_warning_label").chomp(":") %></p>
         <p style="margin: 0; color: #ffcc80; font-size: 0.875rem; line-height: 1.5;">
-          Creating a migration will generate a migration file in your project. Running this migration will drop the index from the database, which may significantly impact application performance.
-          <strong>This operation should only be performed in a local development environment.</strong>
+          <%= t("pg_reports.ui.modals.migration_warning") %>
+          <strong><%= t("pg_reports.ui.modals.migration_warning_dev_only") %></strong>
         </p>
       </div>
-      <p class="settings-label">Generated migration to remove the index:</p>
+      <p class="settings-label"><%= t("pg_reports.ui.modals.migration_subtitle") %></p>
       <div id="migration-code" class="migration-code"></div>
       <div class="migration-actions">
-        <button class="btn btn-secondary" onclick="copyMigrationCode()">📋 Copy Code</button>
-        <button class="btn btn-primary" id="create-migration-btn" onclick="createMigrationFile()">📁 Create File & Open in IDE</button>
+        <button class="btn btn-secondary" onclick="copyMigrationCode()"><%= t("pg_reports.ui.actions.copy_code") %></button>
+        <button class="btn btn-primary" id="create-migration-btn" onclick="createMigrationFile()"><%= t("pg_reports.ui.actions.create_migration_file") %></button>
       </div>
     </div>
   </div>