admindb 2.1.0 → 2.1.1

package/dist/public/js/schema.js

@@ -1,447 +1 @@
-/* Table schema editor: rename table, add/rename/drop columns, drop table. */
-(function () {
-  'use strict';
-  const cfgEl = document.getElementById('schema-config');
-  if (!cfgEl) return;
-  const cfg = JSON.parse(cfgEl.textContent);
-  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') || (cfg && cfg.dialect === 'postgres');
-  const DESIGNER_TYPES = isPostgres ? POSTGRES_TYPES : SQLITE_TYPES;
-
-  const NAME_RE = /^[A-Za-z_][A-Za-z0-9_$]*$/;
-  const t = encodeURIComponent(cfg.table);
-
-  function escapeHtml(s) {
-    return (window.UI && UI.escapeHtml) ? UI.escapeHtml(s) : String(s == null ? '' : s);
-  }
-
-  function showError(el, msg) {
-    el.classList.remove('hidden');
-    el.innerHTML = '<div class="flex items-start gap-2.5 rounded-xl border border-error/40 bg-error/10 px-4 py-3 text-sm font-medium text-error"><span>' + escapeHtml(msg) + '</span></div>';
-  }
-
-  // ---- Rename table ------------------------------------------------------
-
-  const renameInput = document.getElementById('table-rename-input');
-  const renameBtn = document.getElementById('rename-table');
-
-  async function renameTable() {
-    const name = (renameInput.value || '').trim();
-    if (!name) return UI.showError('Table name is required.');
-    if (name === cfg.table) return UI.showToast('Name unchanged.', 'info');
-    try {
-      const data = await Api.post('/api/tables/' + t + '/rename', { name });
-      UI.showToast(data.message || 'Table renamed.', 'success');
-      setTimeout(() => {
-        window.location.href = Api.basePath + '/tables/' + encodeURIComponent(name) + '/schema';
-      }, 400);
-    } catch (e) {
-      UI.showError(e.message);
-    }
-  }
-  if (renameBtn) renameBtn.addEventListener('click', renameTable);
-  if (renameInput) renameInput.addEventListener('keydown', (e) => { if (e.key === 'Enter') renameTable(); });
-
-  // ---- Add column ---------------------------------------------------------
-
-  const addBtn = document.getElementById('add-column');
-  const panel = document.getElementById('add-column-panel');
-  const formEl = document.getElementById('add-column-form');
-  const errEl = document.getElementById('add-column-error');
-  const submitBtn = document.getElementById('add-column-submit');
-  const cancelBtn = document.getElementById('add-column-cancel');
-  let fkTables = [];
-
-  async function loadFkTables() {
-    try {
-      const tables = await Api.get('/api/tables');
-      fkTables = tables.map((x) => x.name).filter((n) => n.charAt(0) !== '_');
-    } catch (e) {
-      fkTables = [];
-    }
-  }
-
-  function renderTypeOptions(selectedType) {
-    const upper = (selectedType || 'TEXT').toUpperCase();
-    const all = [...DESIGNER_TYPES];
-    if (selectedType && !all.map((x) => x.toUpperCase()).includes(upper)) {
-      all.unshift(selectedType);
-    }
-    return all.map((x) => '<option value="' + escapeHtml(x) + '"' + (x.toUpperCase() === upper ? ' selected' : '') + '>' + escapeHtml(x) + '</option>').join('');
-  }
-
-  async function buildAddForm() {
-    if (!fkTables.length) await loadFkTables();
-    formEl.innerHTML = '';
-    formEl.innerHTML = [
-      '<div class="col-span-2 sm:col-span-3"><label class="field-label">Name</label><input class="field-input ac-name" placeholder="column_name" autocomplete="off" spellcheck="false"></div>',
-      '<div class="col-span-1 sm:col-span-2"><label class="field-label">Type</label><select class="field-select ac-type">' + renderTypeOptions('TEXT') + '</select></div>',
-      '<div class="col-span-1 sm:col-span-2"><label class="field-label">FK table</label><select class="field-select ac-fk-table"><option value="">— none —</option>' + fkTables.map((x) => '<option>' + escapeHtml(x) + '</option>').join('') + '</select></div>',
-      '<div class="col-span-1 sm:col-span-2"><label class="field-label">FK column</label><select class="field-select ac-fk-col"><option value="">—</option></select></div>',
-      '<div class="col-span-1 sm:col-span-2"><label class="field-label">Default</label><input class="field-input ac-default" placeholder="0, CURRENT_TIMESTAMP" autocomplete="off" spellcheck="false"></div>',
-      '<div class="col-span-2 flex items-end gap-1.5 pb-0.5 sm:col-span-1">',
-      '<label class="flex cursor-pointer flex-col items-center gap-1" title="Primary key"><input type="checkbox" class="checkbox checkbox-xs ac-pk"><span class="text-[10px] font-semibold uppercase text-base-content/50">PK</span></label>',
-      '<label class="flex cursor-pointer flex-col items-center gap-1" title="Not null"><input type="checkbox" class="checkbox checkbox-xs ac-notnull"><span class="text-[10px] font-semibold uppercase text-base-content/50">NN</span></label>',
-      '<label class="flex cursor-pointer flex-col items-center gap-1" title="Unique"><input type="checkbox" class="checkbox checkbox-xs ac-unique"><span class="text-[10px] font-semibold uppercase text-base-content/50">UQ</span></label>',
-      '</div>',
-    ].join('');
-
-    const fkTableSel = formEl.querySelector('.ac-fk-table');
-    const fkColSel = formEl.querySelector('.ac-fk-col');
-    fkTableSel.addEventListener('change', async () => {
-      fkColSel.innerHTML = '<option value="">—</option>';
-      const target = fkTableSel.value;
-      if (!target) return;
-      try {
-        const info = await Api.get('/api/tables/' + encodeURIComponent(target) + '/info');
-        fkColSel.innerHTML = '<option value="">—</option>' + info.columns.map((c) => '<option>' + escapeHtml(c.name) + '</option>').join('');
-      } catch (e) { /* ignore */ }
-    });
-  }
-
-  async function addColumn() {
-    errEl.classList.add('hidden');
-    const name = (formEl.querySelector('.ac-name').value || '').trim();
-    if (!name) return showError(errEl, 'Column name is required.');
-    if (!NAME_RE.test(name)) return showError(errEl, 'Invalid column name: "' + name + '". Use letters, digits and underscores.');
-    const fkTable = formEl.querySelector('.ac-fk-table').value;
-    const fkCol = formEl.querySelector('.ac-fk-col').value;
-    const column = {
-      name,
-      type: formEl.querySelector('.ac-type').value,
-      primaryKey: formEl.querySelector('.ac-pk').checked,
-      notNull: formEl.querySelector('.ac-notnull').checked,
-      unique: formEl.querySelector('.ac-unique').checked,
-      defaultValue: formEl.querySelector('.ac-default').value.trim() || null,
-      foreignKey: fkTable && fkCol ? { table: fkTable, column: fkCol } : null,
-    };
-    try {
-      const data = await Api.post('/api/tables/' + t + '/columns', { column });
-      UI.showToast(data.message || 'Column added.', 'success');
-      window.location.reload();
-    } catch (e) {
-      showError(errEl, e.message);
-    }
-  }
-
-  if (addBtn) {
-    addBtn.addEventListener('click', async () => {
-      if (editPanel) editPanel.classList.add('hidden');
-      panel.classList.toggle('hidden');
-      if (!panel.classList.contains('hidden')) {
-        errEl.classList.add('hidden');
-        await buildAddForm();
-      }
-    });
-  }
-  if (cancelBtn) cancelBtn.addEventListener('click', () => { panel.classList.add('hidden'); formEl.innerHTML = ''; });
-  if (submitBtn) submitBtn.addEventListener('click', addColumn);
-
-  // ---- Edit column (type & constraints) ------------------------------------
-
-  const editPanel = document.getElementById('edit-column-panel');
-  const editFormEl = document.getElementById('edit-column-form');
-  const editErrEl = document.getElementById('edit-column-error');
-  const editSubmitBtn = document.getElementById('edit-column-submit');
-  const editCancelBtn = document.getElementById('edit-column-cancel');
-  const editTargetSpan = document.getElementById('edit-column-target');
-  let currentEditingCol = null;
-
-  async function openEditColumn(colData) {
-    if (!editPanel || !editFormEl) return;
-    if (panel) panel.classList.add('hidden');
-    if (!fkTables.length) await loadFkTables();
-    currentEditingCol = colData.name;
-    if (editTargetSpan) editTargetSpan.textContent = '"' + colData.name + '"';
-    editErrEl.classList.add('hidden');
-
-    editFormEl.innerHTML = [
-      '<div class="col-span-2 sm:col-span-3"><label class="field-label">Name</label><input class="field-input ec-name" value="' + escapeHtml(colData.name) + '" autocomplete="off" spellcheck="false"></div>',
-      '<div class="col-span-1 sm:col-span-2"><label class="field-label">Type</label><select class="field-select ec-type">' + renderTypeOptions(colData.type) + '</select></div>',
-      '<div class="col-span-1 sm:col-span-2"><label class="field-label">FK table</label><select class="field-select ec-fk-table"><option value="">— none —</option>' + fkTables.map((x) => '<option value="' + escapeHtml(x) + '"' + (colData.fkTable === x ? ' selected' : '') + '>' + escapeHtml(x) + '</option>').join('') + '</select></div>',
-      '<div class="col-span-1 sm:col-span-2"><label class="field-label">FK column</label><select class="field-select ec-fk-col"><option value="">—</option></select></div>',
-      '<div class="col-span-1 sm:col-span-2"><label class="field-label">Default</label><input class="field-input ec-default" value="' + escapeHtml(colData.defaultValue || '') + '" placeholder="0, CURRENT_TIMESTAMP" autocomplete="off" spellcheck="false"></div>',
-      '<div class="col-span-2 flex items-end gap-1.5 pb-0.5 sm:col-span-1">',
-      '<label class="flex cursor-pointer flex-col items-center gap-1" title="Primary key"><input type="checkbox" class="checkbox checkbox-xs ec-pk"' + (colData.primaryKey ? ' checked' : '') + '><span class="text-[10px] font-semibold uppercase text-base-content/50">PK</span></label>',
-      '<label class="flex cursor-pointer flex-col items-center gap-1" title="Not null"><input type="checkbox" class="checkbox checkbox-xs ec-notnull"' + (colData.notNull ? ' checked' : '') + '><span class="text-[10px] font-semibold uppercase text-base-content/50">NN</span></label>',
-      '<label class="flex cursor-pointer flex-col items-center gap-1" title="Unique"><input type="checkbox" class="checkbox checkbox-xs ec-unique"' + (colData.unique ? ' checked' : '') + '><span class="text-[10px] font-semibold uppercase text-base-content/50">UQ</span></label>',
-      '</div>',
-    ].join('');
-
-    const fkTableSel = editFormEl.querySelector('.ec-fk-table');
-    const fkColSel = editFormEl.querySelector('.ec-fk-col');
-
-    async function updateFkCols(table, selectedCol) {
-      fkColSel.innerHTML = '<option value="">—</option>';
-      if (!table) return;
-      try {
-        const targetInfo = await Api.get('/api/tables/' + encodeURIComponent(table) + '/info');
-        fkColSel.innerHTML = '<option value="">—</option>' + targetInfo.columns.map((c) => '<option value="' + escapeHtml(c.name) + '"' + (c.name === selectedCol ? ' selected' : '') + '>' + escapeHtml(c.name) + '</option>').join('');
-      } catch (e) { /* ignore */ }
-    }
-
-    if (colData.fkTable) {
-      await updateFkCols(colData.fkTable, colData.fkTo);
-    }
-
-    fkTableSel.addEventListener('change', () => updateFkCols(fkTableSel.value, ''));
-
-    editPanel.classList.remove('hidden');
-    editPanel.scrollIntoView({ behavior: 'smooth', block: 'nearest' });
-  }
-
-  async function saveEditedColumn() {
-    if (!currentEditingCol) return;
-    editErrEl.classList.add('hidden');
-    const name = (editFormEl.querySelector('.ec-name').value || '').trim();
-    if (!name) return showError(editErrEl, 'Column name is required.');
-    if (!NAME_RE.test(name)) return showError(editErrEl, 'Invalid column name: "' + name + '". Use letters, digits and underscores.');
-    const fkTable = editFormEl.querySelector('.ec-fk-table').value;
-    const fkCol = editFormEl.querySelector('.ec-fk-col').value;
-    const column = {
-      name,
-      type: editFormEl.querySelector('.ec-type').value,
-      primaryKey: editFormEl.querySelector('.ec-pk').checked,
-      notNull: editFormEl.querySelector('.ec-notnull').checked,
-      unique: editFormEl.querySelector('.ec-unique').checked,
-      defaultValue: editFormEl.querySelector('.ec-default').value.trim() || null,
-      foreignKey: fkTable && fkCol ? { table: fkTable, column: fkCol } : null,
-    };
-
-    if (editSubmitBtn) editSubmitBtn.disabled = true;
-    try {
-      const data = await Api.put('/api/tables/' + t + '/columns/' + encodeURIComponent(currentEditingCol), { column });
-      UI.showToast(data.message || 'Column updated.', 'success');
-      window.location.reload();
-    } catch (e) {
-      showError(editErrEl, e.message);
-    } finally {
-      if (editSubmitBtn) editSubmitBtn.disabled = false;
-    }
-  }
-
-  if (editCancelBtn) editCancelBtn.addEventListener('click', () => { editPanel.classList.add('hidden'); editFormEl.innerHTML = ''; currentEditingCol = null; });
-  if (editSubmitBtn) editSubmitBtn.addEventListener('click', saveEditedColumn);
-
-  document.querySelectorAll('.col-edit').forEach((btn) => {
-    btn.addEventListener('click', () => {
-      openEditColumn({
-        name: btn.dataset.column || '',
-        type: btn.dataset.type || 'TEXT',
-        primaryKey: btn.dataset.pk === 'true',
-        notNull: btn.dataset.notnull === 'true',
-        unique: btn.dataset.unique === 'true',
-        defaultValue: btn.dataset.default || '',
-        fkTable: btn.dataset.fkTable || '',
-        fkTo: btn.dataset.fkTo || '',
-      });
-    });
-  });
-
-  // ---- Drop column ---------------------------------------------------------
-
-  document.querySelectorAll('.col-drop').forEach((btn) => {
-    btn.addEventListener('click', async () => {
-      const tr = btn.closest('tr');
-      if (!tr) return;
-      const cell = tr.querySelector('.col-name-cell');
-      const name = cell ? cell.dataset.column : '';
-      if (!name) return;
-      const confirmed = await UI.confirm({
-        title: 'Drop Column',
-        message: 'Dropping column "' + name + '" will permanently delete all data stored in this column for all rows in table "' + cfg.table + '". This action cannot be undone.',
-        item: name,
-        itemType: 'Column',
-        confirmText: 'Drop column',
-        danger: true,
-      });
-      if (!confirmed) return;
-      Api.del('/api/tables/' + t + '/columns/' + encodeURIComponent(name))
-        .then((data) => {
-          UI.showToast(data.message || 'Column dropped.', 'success');
-          window.location.reload();
-        })
-        .catch((e) => UI.showError(e.message));
-    });
-  });
-
-  // ---- Drop table -----------------------------------------------------------
-
-  const dropBtn = document.getElementById('drop-table');
-  if (dropBtn) {
-    dropBtn.addEventListener('click', async () => {
-      const confirmed = await UI.confirm({
-        title: 'Drop Table',
-        message: 'Dropping table "' + cfg.table + '" permanently erases the table schema, all indexes, and all stored records. This action cannot be undone.',
-        item: cfg.table,
-        itemType: 'Table',
-        requireInputMatch: cfg.table,
-        confirmText: 'Drop table',
-        danger: true,
-      });
-      if (!confirmed) return;
-      Api.del('/api/tables/' + t)
-        .then(() => {
-          UI.showToast('Table dropped.', 'success');
-          setTimeout(() => { window.location.href = Api.basePath + '/'; }, 400);
-        })
-        .catch((e) => UI.showError(e.message));
-    });
-  }
-
-  // ---- Index management ------------------------------------------------------
-
-  const addIndexBtn = document.getElementById('add-index');
-  const addIndexPanel = document.getElementById('add-index-panel');
-  const indexNameInput = document.getElementById('index-name');
-  const indexUniqueInput = document.getElementById('index-unique');
-  const indexErrEl = document.getElementById('add-index-error');
-  const addIndexSubmit = document.getElementById('add-index-submit');
-  const addIndexCancel = document.getElementById('add-index-cancel');
-  const indexPreview = document.getElementById('index-preview');
-  const indexPreviewCode = document.getElementById('index-preview-code');
-  const indexColBtns = Array.prototype.slice.call(document.querySelectorAll('.index-col-btn'));
-
-  // Columns selected for the new index, in click order (index order matters!).
-  let indexColumns = [];
-
-  function renderIndexPreview() {
-    if (!indexPreview || !indexPreviewCode) return;
-    const cols = indexColumns.slice();
-    const name = (indexNameInput.value || '').trim();
-    const unique = indexUniqueInput && indexUniqueInput.checked ? 'UNIQUE ' : '';
-    if (!cols.length) {
-      indexPreview.classList.add('hidden');
-      indexPreviewCode.textContent = '';
-      return;
-    }
-    const finalName = name || 'idx_' + cfg.table + '_' + cols.join('_');
-    indexPreviewCode.textContent =
-      'CREATE ' + unique + 'INDEX "' + finalName + '" ON "' + cfg.table + '" (' +
-      cols.map((c) => '"' + c + '"').join(', ') + ');';
-    indexPreview.classList.remove('hidden');
-  }
-
-  function toggleIndexColumn(btn) {
-    const col = btn.dataset.column;
-    const i = indexColumns.indexOf(col);
-    const num = btn.querySelector('.index-col-num');
-    if (i !== -1) {
-      indexColumns.splice(i, 1);
-      btn.classList.remove('border-primary', 'bg-primary/10');
-      if (num) num.classList.add('hidden');
-    } else {
-      indexColumns.push(col);
-      btn.classList.add('border-primary', 'bg-primary/10');
-      if (num) num.classList.remove('hidden');
-    }
-    indexColumns.forEach((c, idx) => {
-      const b = indexColBtns.find((x) => x.dataset.column === c);
-      const n = b && b.querySelector('.index-col-num');
-      if (n) n.textContent = String(idx + 1);
-    });
-    renderIndexPreview();
-  }
-
-  indexColBtns.forEach((btn) => btn.addEventListener('click', () => toggleIndexColumn(btn)));
-  if (indexNameInput) indexNameInput.addEventListener('input', renderIndexPreview);
-  if (indexUniqueInput) indexUniqueInput.addEventListener('change', renderIndexPreview);
-
-  if (addIndexBtn && addIndexPanel) {
-    addIndexBtn.addEventListener('click', () => {
-      addIndexPanel.classList.toggle('hidden');
-      if (!addIndexPanel.classList.contains('hidden')) {
-        indexErrEl.classList.add('hidden');
-        indexNameInput.focus();
-        renderIndexPreview();
-      }
-    });
-  }
-  if (addIndexCancel) {
-    addIndexCancel.addEventListener('click', () => {
-      addIndexPanel.classList.add('hidden');
-      indexErrEl.classList.add('hidden');
-    });
-  }
-  if (addIndexSubmit) {
-    addIndexSubmit.addEventListener('click', async () => {
-      indexErrEl.classList.add('hidden');
-      const columns = indexColumns.slice();
-      if (!columns.length) return showError(indexErrEl, 'Select at least one column for the index.');
-      const body = { columns, unique: !!(indexUniqueInput && indexUniqueInput.checked) };
-      const name = (indexNameInput.value || '').trim();
-      if (name) body.name = name;
-      addIndexSubmit.disabled = true;
-      try {
-        const data = await Api.post('/api/tables/' + t + '/indexes', body);
-        UI.showToast(data.message || 'Index created.', 'success');
-        window.location.reload();
-      } catch (e) {
-        showError(indexErrEl, e.message);
-      } finally {
-        addIndexSubmit.disabled = false;
-      }
-    });
-  }
-
-  document.querySelectorAll('.index-drop').forEach((btn) => {
-    btn.addEventListener('click', async () => {
-      const name = btn.dataset.index;
-      if (!name) return;
-      const confirmed = await UI.confirm({
-        title: 'Drop Index',
-        message: 'Are you sure you want to permanently drop index "' + name + '" on table "' + cfg.table + '"?',
-        item: name,
-        itemType: 'Index',
-        confirmText: 'Drop index',
-        danger: true,
-      });
-      if (!confirmed) return;
-      Api.del('/api/tables/' + t + '/indexes/' + encodeURIComponent(name))
-        .then((data) => {
-          UI.showToast(data.message || 'Index dropped.', 'success');
-          window.location.reload();
-        })
-        .catch((e) => UI.showError(e.message));
-    });
-  });
-
-  loadFkTables();
-})();
+!function(){"use strict";const e=document.getElementById("schema-config");if(!e)return;const t=JSON.parse(e.textContent),l=window.APP&&"postgres"===window.APP.dialect||t&&"postgres"===t.dialect?["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"]:["TEXT","INTEGER","REAL","BLOB","BOOLEAN","DATE","DATETIME","NUMERIC","VARCHAR(255)","JSON"],n=/^[A-Za-z_][A-Za-z0-9_$]*$/,a=encodeURIComponent(t.table);function c(e){return window.UI&&UI.escapeHtml?UI.escapeHtml(e):String(null==e?"":e)}function s(e,t){e.classList.remove("hidden"),e.innerHTML='<div class="flex items-start gap-2.5 rounded-xl border border-error/40 bg-error/10 px-4 py-3 text-sm font-medium text-error"><span>'+c(t)+"</span></div>"}const o=document.getElementById("table-rename-input"),i=document.getElementById("rename-table");async function d(){const e=(o.value||"").trim();if(!e)return UI.showError("Table name is required.");if(e===t.table)return UI.showToast("Name unchanged.","info");try{const t=await Api.post("/api/tables/"+a+"/rename",{name:e});UI.showToast(t.message||"Table renamed.","success"),setTimeout(()=>{window.location.href=Api.basePath+"/tables/"+encodeURIComponent(e)+"/schema"},400)}catch(e){UI.showError(e.message)}}i&&i.addEventListener("click",d),o&&o.addEventListener("keydown",e=>{"Enter"===e.key&&d()});const r=document.getElementById("add-column"),u=document.getElementById("add-column-panel"),p=document.getElementById("add-column-form"),m=document.getElementById("add-column-error"),f=document.getElementById("add-column-submit"),b=document.getElementById("add-column-cancel");let y=[];async function h(){try{const e=await Api.get("/api/tables");y=e.map(e=>e.name).filter(e=>"_"!==e.charAt(0))}catch(e){y=[]}}function x(e){const t=(e||"TEXT").toUpperCase(),n=[...l];return e&&!n.map(e=>e.toUpperCase()).includes(t)&&n.unshift(e),n.map(e=>'<option value="'+c(e)+'"'+(e.toUpperCase()===t?" selected":"")+">"+c(e)+"</option>").join("")}r&&r.addEventListener("click",async()=>{E&&E.classList.add("hidden"),u.classList.toggle("hidden"),u.classList.contains("hidden")||(m.classList.add("hidden"),await async function(){y.length||await h(),p.innerHTML="",p.innerHTML=['<div class="col-span-2 sm:col-span-3"><label class="field-label">Name</label><input class="field-input ac-name" placeholder="column_name" autocomplete="off" spellcheck="false"></div>','<div class="col-span-1 sm:col-span-2"><label class="field-label">Type</label><select class="field-select ac-type">'+x("TEXT")+"</select></div>",'<div class="col-span-1 sm:col-span-2"><label class="field-label">FK table</label><select class="field-select ac-fk-table"><option value="">— none —</option>'+y.map(e=>"<option>"+c(e)+"</option>").join("")+"</select></div>",'<div class="col-span-1 sm:col-span-2"><label class="field-label">FK column</label><select class="field-select ac-fk-col"><option value="">—</option></select></div>','<div class="col-span-1 sm:col-span-2"><label class="field-label">Default</label><input class="field-input ac-default" placeholder="0, CURRENT_TIMESTAMP" autocomplete="off" spellcheck="false"></div>','<div class="col-span-2 flex items-end gap-1.5 pb-0.5 sm:col-span-1">','<label class="flex cursor-pointer flex-col items-center gap-1" title="Primary key"><input type="checkbox" class="checkbox checkbox-xs ac-pk"><span class="text-[10px] font-semibold uppercase text-base-content/50">PK</span></label>','<label class="flex cursor-pointer flex-col items-center gap-1" title="Not null"><input type="checkbox" class="checkbox checkbox-xs ac-notnull"><span class="text-[10px] font-semibold uppercase text-base-content/50">NN</span></label>','<label class="flex cursor-pointer flex-col items-center gap-1" title="Unique"><input type="checkbox" class="checkbox checkbox-xs ac-unique"><span class="text-[10px] font-semibold uppercase text-base-content/50">UQ</span></label>',"</div>"].join("");const e=p.querySelector(".ac-fk-table"),t=p.querySelector(".ac-fk-col");e.addEventListener("change",async()=>{t.innerHTML='<option value="">—</option>';const l=e.value;if(l)try{const e=await Api.get("/api/tables/"+encodeURIComponent(l)+"/info");t.innerHTML='<option value="">—</option>'+e.columns.map(e=>"<option>"+c(e.name)+"</option>").join("")}catch(e){}})}())}),b&&b.addEventListener("click",()=>{u.classList.add("hidden"),p.innerHTML=""}),f&&f.addEventListener("click",async function(){m.classList.add("hidden");const e=(p.querySelector(".ac-name").value||"").trim();if(!e)return s(m,"Column name is required.");if(!n.test(e))return s(m,'Invalid column name: "'+e+'". Use letters, digits and underscores.');const t=p.querySelector(".ac-fk-table").value,l=p.querySelector(".ac-fk-col").value,c={name:e,type:p.querySelector(".ac-type").value,primaryKey:p.querySelector(".ac-pk").checked,notNull:p.querySelector(".ac-notnull").checked,unique:p.querySelector(".ac-unique").checked,defaultValue:p.querySelector(".ac-default").value.trim()||null,foreignKey:t&&l?{table:t,column:l}:null};try{const e=await Api.post("/api/tables/"+a+"/columns",{column:c});UI.showToast(e.message||"Column added.","success"),window.location.reload()}catch(e){s(m,e.message)}});const E=document.getElementById("edit-column-panel"),v=document.getElementById("edit-column-form"),g=document.getElementById("edit-column-error"),I=document.getElementById("edit-column-submit"),T=document.getElementById("edit-column-cancel"),k=document.getElementById("edit-column-target");let L=null;T&&T.addEventListener("click",()=>{E.classList.add("hidden"),v.innerHTML="",L=null}),I&&I.addEventListener("click",async function(){if(!L)return;g.classList.add("hidden");const e=(v.querySelector(".ec-name").value||"").trim();if(!e)return s(g,"Column name is required.");if(!n.test(e))return s(g,'Invalid column name: "'+e+'". Use letters, digits and underscores.');const t=v.querySelector(".ec-fk-table").value,l=v.querySelector(".ec-fk-col").value,c={name:e,type:v.querySelector(".ec-type").value,primaryKey:v.querySelector(".ec-pk").checked,notNull:v.querySelector(".ec-notnull").checked,unique:v.querySelector(".ec-unique").checked,defaultValue:v.querySelector(".ec-default").value.trim()||null,foreignKey:t&&l?{table:t,column:l}:null};I&&(I.disabled=!0);try{const e=await Api.put("/api/tables/"+a+"/columns/"+encodeURIComponent(L),{column:c});UI.showToast(e.message||"Column updated.","success"),window.location.reload()}catch(e){s(g,e.message)}finally{I&&(I.disabled=!1)}}),document.querySelectorAll(".col-edit").forEach(e=>{e.addEventListener("click",()=>{!async function(e){if(!E||!v)return;u&&u.classList.add("hidden"),y.length||await h(),L=e.name,k&&(k.textContent='"'+e.name+'"'),g.classList.add("hidden"),v.innerHTML=['<div class="col-span-2 sm:col-span-3"><label class="field-label">Name</label><input class="field-input ec-name" value="'+c(e.name)+'" autocomplete="off" spellcheck="false"></div>','<div class="col-span-1 sm:col-span-2"><label class="field-label">Type</label><select class="field-select ec-type">'+x(e.type)+"</select></div>",'<div class="col-span-1 sm:col-span-2"><label class="field-label">FK table</label><select class="field-select ec-fk-table"><option value="">— none —</option>'+y.map(t=>'<option value="'+c(t)+'"'+(e.fkTable===t?" selected":"")+">"+c(t)+"</option>").join("")+"</select></div>",'<div class="col-span-1 sm:col-span-2"><label class="field-label">FK column</label><select class="field-select ec-fk-col"><option value="">—</option></select></div>','<div class="col-span-1 sm:col-span-2"><label class="field-label">Default</label><input class="field-input ec-default" value="'+c(e.defaultValue||"")+'" placeholder="0, CURRENT_TIMESTAMP" autocomplete="off" spellcheck="false"></div>','<div class="col-span-2 flex items-end gap-1.5 pb-0.5 sm:col-span-1">','<label class="flex cursor-pointer flex-col items-center gap-1" title="Primary key"><input type="checkbox" class="checkbox checkbox-xs ec-pk"'+(e.primaryKey?" checked":"")+'><span class="text-[10px] font-semibold uppercase text-base-content/50">PK</span></label>','<label class="flex cursor-pointer flex-col items-center gap-1" title="Not null"><input type="checkbox" class="checkbox checkbox-xs ec-notnull"'+(e.notNull?" checked":"")+'><span class="text-[10px] font-semibold uppercase text-base-content/50">NN</span></label>','<label class="flex cursor-pointer flex-col items-center gap-1" title="Unique"><input type="checkbox" class="checkbox checkbox-xs ec-unique"'+(e.unique?" checked":"")+'><span class="text-[10px] font-semibold uppercase text-base-content/50">UQ</span></label>',"</div>"].join("");const t=v.querySelector(".ec-fk-table"),l=v.querySelector(".ec-fk-col");async function n(e,t){if(l.innerHTML='<option value="">—</option>',e)try{const n=await Api.get("/api/tables/"+encodeURIComponent(e)+"/info");l.innerHTML='<option value="">—</option>'+n.columns.map(e=>'<option value="'+c(e.name)+'"'+(e.name===t?" selected":"")+">"+c(e.name)+"</option>").join("")}catch(e){}}e.fkTable&&await n(e.fkTable,e.fkTo),t.addEventListener("change",()=>n(t.value,"")),E.classList.remove("hidden"),E.scrollIntoView({behavior:"smooth",block:"nearest"})}({name:e.dataset.column||"",type:e.dataset.type||"TEXT",primaryKey:"true"===e.dataset.pk,notNull:"true"===e.dataset.notnull,unique:"true"===e.dataset.unique,defaultValue:e.dataset.default||"",fkTable:e.dataset.fkTable||"",fkTo:e.dataset.fkTo||""})})}),document.querySelectorAll(".col-drop").forEach(e=>{e.addEventListener("click",async()=>{const l=e.closest("tr");if(!l)return;const n=l.querySelector(".col-name-cell"),c=n?n.dataset.column:"";if(!c)return;await UI.confirm({title:"Drop Column",message:'Dropping column "'+c+'" will permanently delete all data stored in this column for all rows in table "'+t.table+'". This action cannot be undone.',item:c,itemType:"Column",confirmText:"Drop column",danger:!0})&&Api.del("/api/tables/"+a+"/columns/"+encodeURIComponent(c)).then(e=>{UI.showToast(e.message||"Column dropped.","success"),window.location.reload()}).catch(e=>UI.showError(e.message))})});const w=document.getElementById("drop-table");w&&w.addEventListener("click",async()=>{await UI.confirm({title:"Drop Table",message:'Dropping table "'+t.table+'" permanently erases the table schema, all indexes, and all stored records. This action cannot be undone.',item:t.table,itemType:"Table",requireInputMatch:t.table,confirmText:"Drop table",danger:!0})&&Api.del("/api/tables/"+a).then(()=>{UI.showToast("Table dropped.","success"),setTimeout(()=>{window.location.href=Api.basePath+"/"},400)}).catch(e=>UI.showError(e.message))});const A=document.getElementById("add-index"),q=document.getElementById("add-index-panel"),U=document.getElementById("index-name"),S=document.getElementById("index-unique"),B=document.getElementById("add-index-error"),N=document.getElementById("add-index-submit"),C=document.getElementById("add-index-cancel"),M=document.getElementById("index-preview"),R=document.getElementById("index-preview-code"),D=Array.prototype.slice.call(document.querySelectorAll(".index-col-btn"));let H=[];function P(){if(!M||!R)return;const e=H.slice(),l=(U.value||"").trim(),n=S&&S.checked?"UNIQUE ":"";if(!e.length)return M.classList.add("hidden"),void(R.textContent="");const a=l||"idx_"+t.table+"_"+e.join("_");R.textContent="CREATE "+n+'INDEX "'+a+'" ON "'+t.table+'" ('+e.map(e=>'"'+e+'"').join(", ")+");",M.classList.remove("hidden")}D.forEach(e=>e.addEventListener("click",()=>function(e){const t=e.dataset.column,l=H.indexOf(t),n=e.querySelector(".index-col-num");-1!==l?(H.splice(l,1),e.classList.remove("border-primary","bg-primary/10"),n&&n.classList.add("hidden")):(H.push(t),e.classList.add("border-primary","bg-primary/10"),n&&n.classList.remove("hidden")),H.forEach((e,t)=>{const l=D.find(t=>t.dataset.column===e),n=l&&l.querySelector(".index-col-num");n&&(n.textContent=String(t+1))}),P()}(e))),U&&U.addEventListener("input",P),S&&S.addEventListener("change",P),A&&q&&A.addEventListener("click",()=>{q.classList.toggle("hidden"),q.classList.contains("hidden")||(B.classList.add("hidden"),U.focus(),P())}),C&&C.addEventListener("click",()=>{q.classList.add("hidden"),B.classList.add("hidden")}),N&&N.addEventListener("click",async()=>{B.classList.add("hidden");const e=H.slice();if(!e.length)return s(B,"Select at least one column for the index.");const t={columns:e,unique:!(!S||!S.checked)},l=(U.value||"").trim();l&&(t.name=l),N.disabled=!0;try{const e=await Api.post("/api/tables/"+a+"/indexes",t);UI.showToast(e.message||"Index created.","success"),window.location.reload()}catch(e){s(B,e.message)}finally{N.disabled=!1}}),document.querySelectorAll(".index-drop").forEach(e=>{e.addEventListener("click",async()=>{const l=e.dataset.index;if(!l)return;await UI.confirm({title:"Drop Index",message:'Are you sure you want to permanently drop index "'+l+'" on table "'+t.table+'"?',item:l,itemType:"Index",confirmText:"Drop index",danger:!0})&&Api.del("/api/tables/"+a+"/indexes/"+encodeURIComponent(l)).then(e=>{UI.showToast(e.message||"Index dropped.","success"),window.location.reload()}).catch(e=>UI.showError(e.message))})}),h()}();