// Workspace — shared primitives: actors, avatars, badges, buttons, icons
// Legacy seeded actors. Multi-tenant users (post Fase 1+) get registered
// dynamically from data.jsx (loadMe + loadWorkspaceMembers) by writing to
// `ACTORS[user.id] = ...`. Anything keyed by a UUID we never registered
// returns a safe default through the Proxy below — that way components
// reading `ACTORS[someUserId].name` never crash if the lookup misses.
const _ACTORS_DATA = {
founder: { id: 'founder', name: 'Sebastián', role: 'Founder', color: 'var(--founder)', initial: 'S', desc: 'Visión, prioridades, decisiones de producto' },
tlead: { id: 'tlead', name: 'Genaro', role: 'Technical Lead', color: 'var(--tlead)', initial: 'G', desc: 'Validación técnica, revisión de código' },
code: { id: 'code', name: 'Claude Code', role: 'Code Agent', color: 'var(--code)', initial: 'C', desc: 'Implementación autónoma de código' },
claude: { id: 'claude', name: 'Claude', role: 'Strategic Advisor',color: 'var(--claude)', initial: 'A', desc: 'Asesoría estratégica, generación de contenido' },
};
// Build a default actor entry for an unknown id. The id might be a UUID of a
// user we haven't loaded yet, an actor row that was deleted, or null/undef.
// Returning a safe shape (with `.name`, `.color`, etc.) prevents the whole
// app from crashing when a stale assigneeId or authorId is rendered.
function _defaultActor(id) {
const safeId = (id == null || id === '') ? '?' : String(id);
// Short, readable fallback name. Use the first segment of a UUID or the
// raw id if it's already short enough. The real name gets filled when
// loadWorkspaceMembers runs.
const shortName = safeId.length > 12 ? safeId.slice(0, 8) : safeId;
return {
id: safeId,
name: shortName,
role: '',
color: 'var(--text-2)',
initial: (shortName[0] || '?').toUpperCase(),
desc: '',
_isFallback: true,
};
}
const ACTORS = new Proxy(_ACTORS_DATA, {
get(target, prop) {
if (prop in target) return target[prop];
// Symbol props (e.g. Symbol.iterator) — let them pass through untouched
// so spreading / for..of doesn't accidentally hit our fallback.
if (typeof prop === 'symbol') return undefined;
return _defaultActor(prop);
},
// Allow components to register/update entries (used by data.jsx after
// /api/me + /api/workspace/members succeed).
set(target, prop, value) {
target[prop] = value;
return true;
},
has(target, prop) {
// `has` is kept honest so `prop in ACTORS` still returns false for
// unknown ids — only direct property access falls through to the
// default. Code that wants to test "is this a real actor?" can use
// `prop in ACTORS` instead of truthy-check on `.name`.
return prop in target;
},
});
const ACTOR_LIST = ['founder', 'tlead', 'code', 'claude'];
// ── Lucide icon wrapper ─────────────────────────────────────────────
// Uses lucide global from CDN. Returns an inline SVG.
function Icon({ name, size = 16, color, strokeWidth = 1.75, style, className }) {
const ref = React.useRef(null);
React.useEffect(() => {
if (!window.lucide || !ref.current || !name) return;
const node = window.lucide.icons?.[toPascal(name)] || window.lucide.icons?.[name];
if (!node) return;
ref.current.innerHTML = '';
const svg = window.lucide.createElement(node);
svg.setAttribute('width', size);
svg.setAttribute('height', size);
svg.setAttribute('stroke-width', strokeWidth);
if (color) svg.setAttribute('stroke', color);
ref.current.appendChild(svg);
}, [name, size, color, strokeWidth]);
return ;
}
function toPascal(s) {
if (!s || typeof s !== 'string') return '';
return s.split(/[-_]/).map(w => (w[0] ? w[0].toUpperCase() + w.slice(1) : '')).join('');
}
// ── Avatar ──────────────────────────────────────────────────────────
// Fallback chain for the initial: explicit `initial` field on the actor
// catalog entry → first letter of `name` → first letter of `desc` (which
// holds the email for User-derived actors) → "?". Stops the avatar from
// ever rendering "?" for a user we *do* know the name of just because the
// catalog entry was populated before the initial was computed.
function _avatarInitial(a) {
const candidates = [a?.initial, a?.name, a?.desc, a?.id];
for (const c of candidates) {
const s = String(c || '').trim();
if (!s) continue;
const ch = s.charAt(0).toUpperCase();
if (ch && ch !== '?') return ch;
}
return '?';
}
function Avatar({ actor, size = 24, ring = false, style }) {
const a = ACTORS[actor] || ACTORS.founder;
return (
{item(SUPPORT_WHATSAPP_DIRECT, 'message-circle', 'WhatsApp directo', 'Habla con Sebastián 1 a 1')}
{item(SUPPORT_WHATSAPP_GROUP, 'users', 'Grupo de soporte', 'Comunidad de usuarios + equipo')}