Add Adminer login hint

public/app.js

@@ -51,6 +51,9 @@ const localDbInputs = document.querySelectorAll("#localDbFields input");
 const testLocalDbButton = document.querySelector("#testLocalDbButton");
 const localDbTestResult = document.querySelector("#localDbTestResult");
 const openDbGateButton = document.querySelector("#openDbGateButton");
+const adminerServerValue = document.querySelector("#adminerServerValue");
+const adminerUserValue = document.querySelector("#adminerUserValue");
+const adminerDatabaseValue = document.querySelector("#adminerDatabaseValue");
 const lightContrastSelect = document.querySelector("#lightContrastSelect");
 const darkContrastSelect = document.querySelector("#darkContrastSelect");
 const catalogScreen = document.querySelector(".catalog-screen");
@@ -1012,6 +1015,7 @@ function loadDatabaseMode() {
     }
     syncDatabasePermissions(mode);
     syncLocalDbFields(mode);
+    syncAdminerLoginHint();
     renderDatabaseModeNote(mode);
     refreshDatabaseStatusLabel();
 }
@@ -1029,6 +1033,16 @@ function saveLocalDbSettings() {
     for (const input of localDbInputs)
         settings[input.id] = input.value;
     localStorage.setItem("catalog-maker:local-db-settings", JSON.stringify(settings));
+    syncAdminerLoginHint();
+}
+function syncAdminerLoginHint() {
+    const host = document.querySelector("#localDbHost")?.value || "127.0.0.1";
+    const port = document.querySelector("#localDbPort")?.value || "3306";
+    const user = document.querySelector("#localDbUser")?.value || "root";
+    const catalogDb = document.querySelector("#localDbName")?.value || "9bplus";
+    adminerServerValue.textContent = `${host}:${port}`;
+    adminerUserValue.textContent = user;
+    adminerDatabaseValue.textContent = `${catalogDb} / catalog_scrape`;
 }
 async function testLocalDbConnection() {
     saveLocalDbSettings();

public/app.ts

@@ -51,6 +51,9 @@ const localDbInputs = document.querySelectorAll("#localDbFields input");
 const testLocalDbButton = document.querySelector("#testLocalDbButton");
 const localDbTestResult = document.querySelector("#localDbTestResult");
 const openDbGateButton = document.querySelector("#openDbGateButton");
+const adminerServerValue = document.querySelector("#adminerServerValue");
+const adminerUserValue = document.querySelector("#adminerUserValue");
+const adminerDatabaseValue = document.querySelector("#adminerDatabaseValue");
 const lightContrastSelect = document.querySelector("#lightContrastSelect");
 const darkContrastSelect = document.querySelector("#darkContrastSelect");
 const catalogScreen = document.querySelector(".catalog-screen");
@@ -1105,6 +1108,7 @@ function loadDatabaseMode() {
   }
   syncDatabasePermissions(mode);
   syncLocalDbFields(mode);
+  syncAdminerLoginHint();
   renderDatabaseModeNote(mode);
   refreshDatabaseStatusLabel();
 }
@@ -1123,6 +1127,17 @@ function saveLocalDbSettings() {
   const settings = {};
   for (const input of localDbInputs) settings[input.id] = input.value;
   localStorage.setItem("catalog-maker:local-db-settings", JSON.stringify(settings));
+  syncAdminerLoginHint();
+}
+
+function syncAdminerLoginHint() {
+  const host = document.querySelector("#localDbHost")?.value || "127.0.0.1";
+  const port = document.querySelector("#localDbPort")?.value || "3306";
+  const user = document.querySelector("#localDbUser")?.value || "root";
+  const catalogDb = document.querySelector("#localDbName")?.value || "9bplus";
+  adminerServerValue.textContent = `${host}:${port}`;
+  adminerUserValue.textContent = user;
+  adminerDatabaseValue.textContent = `${catalogDb} / catalog_scrape`;
 }
 
 async function testLocalDbConnection() {

public/index.html

@@ -205,6 +205,13 @@
               <p class="settings-note" id="localDbTestResult">Connection not tested.</p>
             </div>
             <p class="settings-note" id="databaseModeNote">Local 9bplus database selected.</p>
+            <div class="adminer-login-hint" id="adminerLoginHint" aria-label="Adminer login details">
+              <div class="adminer-login-row"><span>System</span><strong>MySQL</strong></div>
+              <div class="adminer-login-row"><span>Server</span><strong id="adminerServerValue">127.0.0.1:3306</strong></div>
+              <div class="adminer-login-row"><span>User</span><strong id="adminerUserValue">root</strong></div>
+              <div class="adminer-login-row"><span>Password</span><strong>DB_PASSWORD in .env</strong></div>
+              <div class="adminer-login-row"><span>Database</span><strong id="adminerDatabaseValue">9bplus / catalog_scrape</strong></div>
+            </div>
           </fieldset>
 
           <fieldset class="settings-group">