admindb 1.2.1 → 2.1.0

package/dist/public/js/databases.js

@@ -1,9 +1,14 @@
-/* Databases landing page: create/delete database files, and a filesystem
- * browser for opening existing SQLite files. */
+/* Databases landing page: create SQLite databases, connect PostgreSQL databases,
+ * toggle readonly mode, delete/disconnect databases, and browse filesystem. */
 (function () {
   'use strict';
   const nameInput = document.getElementById('new-db-name');
   const createBtn = document.getElementById('create-db');
+  const pgNameInput = document.getElementById('pg-conn-name');
+  const pgUriInput = document.getElementById('pg-conn-uri');
+  const pgRoInput = document.getElementById('pg-conn-readonly');
+  const connectPgBtn = document.getElementById('connect-pg');
+  const fsRoInput = document.getElementById('fs-readonly');
 
   function escapeHtml(s) {
     return (window.UI && UI.escapeHtml) ? UI.escapeHtml(s) : String(s == null ? '' : s);
@@ -21,6 +26,8 @@
     return (u === 0 ? Math.round(v) : v.toFixed(1)) + ' ' + units[u];
   }
 
+  // ---- Create SQLite DB ----------------------------------------------------
+
   async function createDb() {
     const name = (nameInput.value || '').trim();
     if (!name) return UI.showError('Enter a database name.');
@@ -42,11 +49,75 @@
     });
   }
 
+  // ---- Connect PostgreSQL DB -----------------------------------------------
+
+  async function connectPg() {
+    const name = (pgNameInput ? pgNameInput.value : '').trim();
+    const connectionString = (pgUriInput ? pgUriInput.value : '').trim();
+    const readonly = pgRoInput ? pgRoInput.checked : false;
+    if (!connectionString) {
+      return UI.showError('Enter a PostgreSQL connection URI (e.g. postgresql://user:password@localhost:5432/dbname).');
+    }
+    if (connectPgBtn) {
+      connectPgBtn.disabled = true;
+      connectPgBtn.textContent = 'Connecting…';
+    }
+    try {
+      const data = await Api.post('/api/databases/connect-postgres', { name, connectionString, readonly });
+      UI.showToast(data.message || 'PostgreSQL connected.', 'success');
+      setTimeout(() => {
+        window.location.href = Api.basePath + '/' + encodeURIComponent(data.id);
+      }, 400);
+    } catch (e) {
+      UI.showError(e.message);
+      if (connectPgBtn) {
+        connectPgBtn.disabled = false;
+        connectPgBtn.innerHTML = (window.AdminIcons ? AdminIcons.get('plus', 'h-4 w-4') : '') + ' Connect PostgreSQL';
+      }
+    }
+  }
+
+  if (connectPgBtn) connectPgBtn.addEventListener('click', connectPg);
+  if (pgUriInput) {
+    pgUriInput.addEventListener('keydown', (e) => {
+      if (e.key === 'Enter') connectPg();
+    });
+  }
+
+  // ---- Toggle Read-only / Writable Mode ------------------------------------
+
+  document.querySelectorAll('.js-toggle-db-mode').forEach((btn) => {
+    btn.addEventListener('click', async () => {
+      const id = btn.dataset.id;
+      if (!id) return;
+      const currentRo = btn.dataset.readonly === 'true';
+      const targetRo = !currentRo;
+      try {
+        const data = await Api.post('/api/databases/' + encodeURIComponent(id) + '/mode', { readonly: targetRo });
+        UI.showToast(data.message || `Mode updated to ${targetRo ? 'Read-only' : 'Writable'}.`, 'success');
+        window.location.reload();
+      } catch (e) {
+        UI.showError(e.message);
+      }
+    });
+  });
+
+  // ---- Delete SQLite DB ----------------------------------------------------
+
   document.querySelectorAll('.js-delete-db').forEach((btn) => {
-    btn.addEventListener('click', () => {
+    btn.addEventListener('click', async () => {
       const id = btn.dataset.id;
       if (!id) return;
-      if (!window.confirm('Delete database "' + id + '" permanently? This removes the file and all of its data.')) return;
+      const confirmed = await UI.confirm({
+        title: 'Delete Database',
+        message: 'Are you sure you want to permanently delete database "' + id + '"? This will remove the SQLite database file and all stored tables and records from the disk.',
+        item: id,
+        itemType: 'Database',
+        requireInputMatch: id,
+        confirmText: 'Delete database',
+        danger: true,
+      });
+      if (!confirmed) return;
       Api.del('/api/databases/' + encodeURIComponent(id))
         .then((data) => {
           UI.showToast(data.message || 'Database deleted.', 'success');
@@ -56,6 +127,29 @@
     });
   });
 
+  // ---- Disconnect PostgreSQL DB --------------------------------------------
+
+  document.querySelectorAll('.js-disconnect-db').forEach((btn) => {
+    btn.addEventListener('click', async () => {
+      const id = btn.dataset.id;
+      const name = btn.dataset.name || id;
+      if (!id) return;
+      const confirmed = await UI.confirm({
+        title: 'Disconnect PostgreSQL Database',
+        message: 'Are you sure you want to disconnect database "' + name + '" from AdminDB? This closes the connection pool in AdminDB; your remote database and data are untouched.',
+        confirmText: 'Disconnect database',
+        danger: false,
+      });
+      if (!confirmed) return;
+      Api.del('/api/databases/' + encodeURIComponent(id))
+        .then((data) => {
+          UI.showToast(data.message || 'Database disconnected.', 'success');
+          window.location.reload();
+        })
+        .catch((e) => UI.showError(e.message));
+    });
+  });
+
   // ---- Filesystem browser --------------------------------------------------
 
   const fsPathInput = document.getElementById('fs-path');
@@ -64,11 +158,6 @@
   const fsCurrent = document.getElementById('fs-current');
   const fsListing = document.getElementById('fs-listing');
 
-  const FOLDER_ICON =
-    '<svg xmlns="http://www.w3.org/2000/svg" class="h-3.5 w-3.5" fill="none" viewBox="0 0 24 24" stroke="currentColor" stroke-width="2"><path stroke-linecap="round" stroke-linejoin="round" d="M3 7a2 2 0 012-2h4l2 2h8a2 2 0 012 2v8a2 2 0 01-2 2H5a2 2 0 01-2-2V7z" /></svg>';
-  const DB_ICON =
-    '<svg xmlns="http://www.w3.org/2000/svg" class="h-3.5 w-3.5" fill="none" viewBox="0 0 24 24" stroke="currentColor" stroke-width="2"><path stroke-linecap="round" stroke-linejoin="round" d="M4 7v10c0 1.1.9 2 2 2h12a2 2 0 002-2V7M4 7c0-1.1.9-2 2-2h12a2 2 0 012 2M4 7c0 1.1.9 2 2 2h12a2 2 0 002-2" /></svg>';
-
   let fsState = { path: '', parent: null };
 
   function renderFs(data) {
@@ -82,6 +171,9 @@
       fsListing.innerHTML = '<div class="px-4 py-6 text-center text-sm text-base-content/40">No folders or database files here.</div>';
       return;
     }
+    const folderIcon = window.AdminIcons ? AdminIcons.get('folder', 'h-3.5 w-3.5') : '📁';
+    const dbIcon = window.AdminIcons ? AdminIcons.get('database', 'h-3.5 w-3.5') : '🗄️';
+
     data.entries.forEach((e) => {
       const row = document.createElement('button');
       row.type = 'button';
@@ -89,13 +181,13 @@
       row.title = e.path;
       if (e.isDir) {
         row.innerHTML =
-          '<span class="grid h-6 w-6 shrink-0 place-items-center rounded-md bg-base-200 text-base-content/50">' + FOLDER_ICON + '</span>' +
+          '<span class="grid h-6 w-6 shrink-0 place-items-center rounded-md bg-base-200 text-base-content/50">' + folderIcon + '</span>' +
           '<span class="min-w-0 flex-1 truncate font-medium text-base-content/80">' + escapeHtml(e.name) + '</span>' +
           '<span class="text-xs text-base-content/35">folder</span>';
         row.addEventListener('click', () => loadFs(e.path));
       } else {
         row.innerHTML =
-          '<span class="grid h-6 w-6 shrink-0 place-items-center rounded-md bg-primary/10 text-primary">' + DB_ICON + '</span>' +
+          '<span class="grid h-6 w-6 shrink-0 place-items-center rounded-md bg-primary/10 text-primary">' + dbIcon + '</span>' +
           '<span class="min-w-0 flex-1 truncate font-mono text-[13px] text-base-content/85">' + escapeHtml(e.name) + '</span>' +
           '<span class="text-xs text-base-content/40">' + fmtSize(e.size) + '</span>';
         row.addEventListener('click', () => openDb(e.path));
@@ -118,8 +210,9 @@
   }
 
   async function openDb(p) {
+    const readonly = fsRoInput ? fsRoInput.checked : false;
     try {
-      const data = await Api.post('/api/databases/open', { path: p });
+      const data = await Api.post('/api/databases/open', { path: p, readonly });
       UI.showToast(data.message || 'Database opened.', 'success');
       window.location.href = Api.basePath + '/' + encodeURIComponent(data.id);
     } catch (e) {
@@ -140,4 +233,3 @@
     if (fsUpBtn) fsUpBtn.addEventListener('click', goUp);
   }
 })();
-

package/dist/public/js/designer.js

@@ -2,7 +2,47 @@
  * and preview the generated CREATE TABLE live. Create executes; Copy copies. */
 (function () {
   'use strict';
-  const DESIGNER_TYPES = ['TEXT', 'INTEGER', 'REAL', 'BLOB', 'BOOLEAN', 'DATE', 'DATETIME'];
+  const SQLITE_TYPES = [
+    'TEXT',
+    'INTEGER',
+    'REAL',
+    'BLOB',
+    'BOOLEAN',
+    'DATE',
+    'DATETIME',
+    'NUMERIC',
+    'VARCHAR(255)',
+    'JSON',
+  ];
+
+  const POSTGRES_TYPES = [
+    'TEXT',
+    'VARCHAR(255)',
+    'INTEGER',
+    'BIGINT',
+    'SMALLINT',
+    'SERIAL',
+    'BIGSERIAL',
+    'REAL',
+    'DECIMAL(10,2)',
+    'NUMERIC',
+    'BOOLEAN',
+    'DATE',
+    'DATETIME',
+    'TIMESTAMP',
+    'TIMESTAMPTZ',
+    'TIME',
+    'INTERVAL',
+    'JSON',
+    'JSONB',
+    'UUID',
+    'BYTEA',
+    'INET',
+  ];
+
+  const isPostgres = window.APP && window.APP.dialect === 'postgres';
+  const DESIGNER_TYPES = isPostgres ? POSTGRES_TYPES : SQLITE_TYPES;
+
   const NAME_RE = /^[A-Za-z_][A-Za-z0-9_$]*$/;
 
   const columnsEl = document.getElementById('columns');
@@ -67,7 +107,20 @@
         })
         .catch(() => {});
     });
-    row.querySelector('.remove-col').addEventListener('click', () => row.remove());
+    row.querySelector('.remove-col').addEventListener('click', async () => {
+      const colName = row.querySelector('.col-name').value.trim();
+      if (colName) {
+        const confirmed = await UI.confirm({
+          title: 'Remove Column',
+          message: 'Remove column "' + colName + '" from the table definition?',
+          confirmText: 'Remove',
+          danger: true,
+        });
+        if (!confirmed) return;
+      }
+      row.remove();
+      schedulePreview();
+    });
 
     row.querySelectorAll('input, select').forEach((el) => {
       el.addEventListener('input', schedulePreview);