fix: org cards clickable — store orgs in JS map, pass entry_id to edit modal

This commit is contained in:
James 2026-03-12 03:04:48 -04:00
parent 62ce5266b7
commit d19ce5e8fa
1 changed files with 15 additions and 12 deletions

View File

@ -7,7 +7,7 @@
</div>
<button id="newOrgBtn" class="hidden px-4 py-2 bg-[#c9a84c] hover:bg-[#b8973f] text-[#0a1628] font-semibold rounded-lg text-sm transition">+ New Organization</button>
</div>
<div id="orgGrid" class="flex flex-col divide-y" style="border:1px solid var(--ds-bd);border-radius:6px;overflow:hidden">
<div id="orgGrid" class="grid grid-cols-1 md:grid-cols-2 gap-4">
<div class="text-[#94a3b8] text-sm col-span-2">Loading...</div>
</div>
<div id="emptyState" class="hidden text-center py-20">
@ -93,21 +93,23 @@
document.getElementById('emptyState').classList.remove('hidden');
return;
}
// Store orgs in map for safe click lookup
window._orgsMap = {};
orgs.forEach(o => { window._orgsMap[o.entry_id] = o; });
grid.innerHTML = orgs.map(o => {
const name = o.name || 'Untitled';
const role = o.role || '';
const rc = roleColors[role] || 'bg-gray-500/20 text-gray-300';
const domains = Array.isArray(o.domains) ? o.domains : (o.domains ? [o.domains] : []);
return `<div onclick="openEditModal(${JSON.stringify(JSON.stringify(o))})"
class="flex items-center gap-4 px-5 py-3.5 cursor-pointer transition"
style="background:var(--ds-sf)" onmouseover="this.style.background='var(--ds-hv)'" onmouseout="this.style.background='var(--ds-sf)'">
<div class="w-8 h-8 rounded flex items-center justify-center text-sm font-bold shrink-0"
style="background:var(--ds-ac);color:#fff">${escHtml(name[0]||'?').toUpperCase()}</div>
<div class="flex-1 min-w-0">
<div class="font-semibold text-white">${escHtml(name)}</div>
<div class="text-xs mt-0.5" style="color:var(--ds-tx3)">${domains.map(d=>'@'+escHtml(d)).join(' · ') || (o.website||'')}</div>
return `<div onclick="openEditModal('${o.entry_id}')"
class="card bg-[#0d1f3c] border border-white/[0.08] rounded-xl p-6 cursor-pointer hover:border-white/[0.2] transition">
<div class="flex items-start justify-between mb-3">
<h3 class="text-white font-semibold leading-tight">${escHtml(name)}</h3>
<span class="ml-2 shrink-0 px-2 py-0.5 rounded-full text-xs font-medium capitalize ${rc}">${role || '—'}</span>
</div>
<span class="shrink-0 px-2.5 py-0.5 text-xs font-medium capitalize ${rc}" style="border-radius:3px">${role || '—'}</span>
<div class="flex gap-1.5 flex-wrap">${domains.map(dm => `<span class="text-xs font-mono text-[#94a3b8] bg-white/[0.05] px-2 py-0.5 rounded">@${escHtml(dm)}</span>`).join('')}</div>
${o.website ? `<div class="mt-2 text-xs" style="color:var(--ds-tx3)">${escHtml(o.website)}</div>` : ''}
</div>`;
}).join('');
} catch(e) {
@ -144,8 +146,9 @@
// ---- Edit Org ----
let editingOrgId = null;
function openEditModal(oJson) {
const o = JSON.parse(oJson);
function openEditModal(entryId) {
const o = (window._orgsMap || {})[entryId];
if (!o) return;
editingOrgId = o.entry_id;
document.getElementById('eName').value = o.name || '';
document.getElementById('eRole').value = o.role || 'seller';