var KEYS = [];
var currentWorkspaceId = null;
var selectedScopes = new Set(['read']);
var search = '';

var SCOPES = ['read', 'write', 'deploy'];
var SCOPE_DESC = {
  read: 'apikeys.scope.read',
  write: 'apikeys.scope.write',
  deploy: 'apikeys.scope.deploy',
};

function tKey(key) {
  return window.t ? t(key) : key;
}

function tfKey(key, vars) {
  return window.tf ? tf(key, vars) : tKey(key);
}

function buildIconSvg(href, width, height) {
  var svg = document.createElementNS('http://www.w3.org/2000/svg', 'svg');
  svg.setAttribute('width', String(width));
  svg.setAttribute('height', String(height));
  var use = document.createElementNS('http://www.w3.org/2000/svg', 'use');
  use.setAttribute('href', href);
  svg.appendChild(use);
  return svg;
}

function mapKeyRecord(record) {
  var apiKey = record.api_key || {};
  return {
    id: apiKey.id,
    name: apiKey.name,
    prefix: apiKey.prefix || '',
    scopes: apiKey.scopes || [],
    created: apiKey.created_at ? apiKey.created_at.slice(0, 10) : '—',
    lastUsed: apiKey.last_used_at ? apiKey.last_used_at.slice(0, 10) : tKey('apikeys.last_used.never'),
    status: apiKey.status || 'active',
  };
}

function currentWorkspace() {
  return window.getCurrentWorkspace ? window.getCurrentWorkspace() : null;
}

async function loadKeys() {
  var workspace = currentWorkspace();
  currentWorkspaceId = workspace ? workspace.id : null;

  setTableLoading(true);

  if (!currentWorkspaceId || !window.CrankApi) {
    KEYS = [];
    setTableLoading(false);
    renderTable(tKey('apikeys.error.api'));
    return;
  }

  try {
    var response = await window.CrankApi.listPlatformApiKeys(currentWorkspaceId);
    KEYS = ((response && response.items) || []).map(mapKeyRecord);
    setTableLoading(false);
    renderTable();
  } catch (error) {
    KEYS = [];
    setTableLoading(false);
    renderTable(error.message || tKey('apikeys.error.load'));
  }
}

function setTableLoading(on) {
  var tbody = document.getElementById('keys-tbody');
  if (!on) return;
  tbody.innerHTML = '';
  var tr = document.createElement('tr');
  var td = document.createElement('td');
  td.colSpan = 7;
  td.style.cssText = 'text-align:center;padding:36px;color:var(--text-muted);';
  td.textContent = tKey('apikeys.loading');
  tr.appendChild(td);
  tbody.appendChild(tr);
}

async function revokeKey(id) {
  if (!confirm(tKey('apikeys.confirm.revoke'))) return;

  try {
    var key = KEYS.find(function(item) { return item.id === id; });
    await window.CrankApi.revokePlatformApiKey(currentWorkspaceId, id);
    await loadKeys();
    if (window.CrankUi) {
      window.CrankUi.success(
        tfKey('apikeys.toast.revoke_message', { name: key ? key.name : '' }),
        tKey('apikeys.toast.revoke_title')
      );
    }
  } catch (error) {
    if (window.CrankUi) {
      window.CrankUi.error(
        error.message || tKey('apikeys.toast.revoke_error_message'),
        tKey('apikeys.toast.revoke_error_title')
      );
    }
  }
}

async function deleteKey(id) {
  if (!confirm(tKey('apikeys.confirm.delete'))) return;

  try {
    var key = KEYS.find(function(item) { return item.id === id; });
    await window.CrankApi.deletePlatformApiKey(currentWorkspaceId, id);
    await loadKeys();
    if (window.CrankUi) {
      window.CrankUi.success(
        tfKey('apikeys.toast.delete_message', { name: key ? key.name : '' }),
        tKey('apikeys.toast.delete_title')
      );
    }
  } catch (error) {
    if (window.CrankUi) {
      window.CrankUi.error(
        error.message || tKey('apikeys.toast.delete_error_message'),
        tKey('apikeys.toast.delete_error_title')
      );
    }
  }
}

async function createKey(name, scopes) {
  var created = await window.CrankApi.createPlatformApiKey(currentWorkspaceId, {
    name: name,
    scopes: scopes,
  });
  return {
    rawKey: created.secret,
    record: mapKeyRecord(created.api_key),
  };
}

function renderScopes() {
  var el = document.getElementById('scope-checkboxes');
  var tmpl = document.getElementById('tmpl-scope-checkbox');
  el.innerHTML = '';
  SCOPES.forEach(function(scope) {
    var node = tmpl.content.cloneNode(true);
    var input = node.querySelector('input');
    input.dataset.scope = scope;
    if (selectedScopes.has(scope)) input.checked = true;
    node.querySelector('.scope-checkbox-name').textContent = scope;
    node.querySelector('.scope-checkbox-desc').textContent = tKey(SCOPE_DESC[scope]);
    input.addEventListener('change', function() {
      if (this.checked) selectedScopes.add(this.dataset.scope);
      else selectedScopes.delete(this.dataset.scope);
    });
    el.appendChild(node);
  });
}

function renderTable(errorMessage) {
  var q = search.toLowerCase();
  var tbody = document.getElementById('keys-tbody');
  var rows = KEYS.filter(function(key) {
    return !q || key.name.toLowerCase().includes(q) || key.prefix.toLowerCase().includes(q);
  });
  var subtitle = document.querySelector('.section-card-subtitle');

  tbody.innerHTML = '';

  if (subtitle) {
    var active = KEYS.filter(function(key) { return key.status === 'active'; }).length;
    var revoked = KEYS.filter(function(key) { return key.status === 'revoked'; }).length;
    subtitle.textContent = tfKey('apikeys.active.subtitle', { active: active, revoked: revoked });
  }

  if (errorMessage) {
    var errorRow = document.createElement('tr');
    var errorCell = document.createElement('td');
    errorCell.colSpan = 7;
    errorCell.style.cssText = 'text-align:center;padding:36px;color:var(--danger,#f85149);';
    errorCell.textContent = errorMessage;
    errorRow.appendChild(errorCell);
    tbody.appendChild(errorRow);
    return;
  }

  if (!rows.length) {
    var empty = document.createElement('tr');
    var td = document.createElement('td');
    td.colSpan = 7;
    td.style.cssText = 'text-align:center;padding:36px;color:var(--text-muted);';
    td.textContent = KEYS.length ? tKey('apikeys.empty.search') : tKey('apikeys.empty.none');
    empty.appendChild(td);
    tbody.appendChild(empty);
    return;
  }

  var tmpl = document.getElementById('tmpl-key-row');
  rows.forEach(function(key) {
    var node = tmpl.content.cloneNode(true);
    node.querySelector('.col-name').textContent = key.name;
    node.querySelector('.col-mono').textContent = key.prefix;
    node.querySelector('.col-created').textContent = key.created;
    node.querySelector('.col-last-used').textContent = key.lastUsed;

    var scopesEl = node.querySelector('.col-scopes');
    key.scopes.forEach(function(scope) {
      var span = document.createElement('span');
      span.className = 'badge badge-scope';
      span.textContent = scope;
      scopesEl.appendChild(span);
    });

    var badge = document.createElement('span');
    badge.className = key.status === 'active' ? 'badge badge-active' : 'badge badge-revoked';
    badge.textContent = key.status === 'active' ? tKey('apikeys.status.active') : tKey('apikeys.status.revoked');
    node.querySelector('.col-status').appendChild(badge);

    var actionsActive = node.querySelector('.actions-active');
    var actionsRevoked = node.querySelector('.actions-revoked');
    if (key.status === 'active') {
      actionsActive.querySelector('[title=\"Copy key prefix\"]').addEventListener('click', function() {
        copyPrefix(key.prefix);
      });
      actionsActive.querySelector('[title=\"Revoke key\"]').addEventListener('click', function() {
        revokeKey(key.id);
      });
    } else {
      actionsActive.style.display = 'none';
      actionsRevoked.style.display = '';
      actionsRevoked.querySelector('[title=\"Delete\"]').addEventListener('click', function() {
        deleteKey(key.id);
      });
    }

    tbody.appendChild(node);
  });
}

var modal = document.getElementById('modal-create');

function openModal() {
  document.getElementById('modal-form-body').style.display = '';
  document.getElementById('modal-reveal-body').style.display = 'none';
  document.getElementById('modal-footer-create').style.display = '';
  document.getElementById('modal-footer-done').style.display = 'none';
  document.getElementById('new-key-name').value = '';
  selectedScopes = new Set(['read']);
  renderScopes();
  modal.classList.add('open');
  setTimeout(function() {
    document.getElementById('new-key-name').focus();
  }, 50);
}

function closeModal() {
  modal.classList.remove('open');
}

document.getElementById('btn-create-key').addEventListener('click', openModal);
document.getElementById('modal-close-btn').addEventListener('click', closeModal);
document.getElementById('modal-cancel-btn').addEventListener('click', closeModal);
modal.addEventListener('click', function(event) {
  if (event.target === modal) closeModal();
});

document.getElementById('modal-confirm-btn').addEventListener('click', async function() {
  var button = this;
  var name = document.getElementById('new-key-name').value.trim();
  if (!name) {
    document.getElementById('new-key-name').focus();
    return;
  }
  if (!selectedScopes.size) {
    if (window.CrankUi) {
      window.CrankUi.info(
        tKey('apikeys.toast.scope_missing_message'),
        tKey('apikeys.toast.scope_missing_title')
      );
    }
    return;
  }

  try {
    button.disabled = true;
    button.textContent = tKey('apikeys.creating');
    var created = await createKey(name, Array.from(selectedScopes));
    KEYS.unshift(created.record);
    document.getElementById('reveal-key-value').textContent = created.rawKey;
    document.getElementById('modal-form-body').style.display = 'none';
    document.getElementById('modal-reveal-body').style.display = '';
    document.getElementById('modal-footer-create').style.display = 'none';
    document.getElementById('modal-footer-done').style.display = '';
    renderTable();
    if (window.CrankUi) {
      window.CrankUi.success(
        tKey('apikeys.toast.create_message'),
        tKey('apikeys.toast.create_title')
      );
    }
  } catch (error) {
    if (window.CrankUi) {
      window.CrankUi.error(
        error.message || tKey('apikeys.toast.create_error_message'),
        tKey('apikeys.toast.create_error_title')
      );
    }
  } finally {
    button.disabled = false;
    button.textContent = tKey('apikeys.modal.create');
  }
});

document.getElementById('modal-done-btn').addEventListener('click', closeModal);

document.getElementById('copy-key-btn').addEventListener('click', function() {
  var value = document.getElementById('reveal-key-value').textContent;
  if (navigator.clipboard) {
    navigator.clipboard.writeText(value).catch(function() {});
  }
  this.replaceChildren(
    buildIconSvg(
      (window.APP_BASE || '') + 'icons/general/check.svg#icon',
      13,
      13
    )
  );
  if (window.CrankUi) {
    window.CrankUi.info(
      tKey('apikeys.toast.copy_message'),
      tKey('apikeys.toast.copy_title')
    );
  }
});

document.getElementById('key-search').addEventListener('input', function() {
  search = this.value;
  renderTable();
});

function copyPrefix(prefix) {
  if (navigator.clipboard) {
    navigator.clipboard.writeText(prefix).catch(function() {});
  }
  if (window.CrankUi) {
    window.CrankUi.info(prefix, tKey('apikeys.toast.prefix_title'));
  }
}

document.addEventListener('DOMContentLoaded', async function() {
  await (window.whenWorkspacesReady ? window.whenWorkspacesReady() : Promise.resolve());
  await loadKeys();
  window.addEventListener('crank:workspacechange', function() {
    loadKeys();
  });
});