setOpen(false)} style={{ position: "fixed", inset: 0, zIndex: 1 }} />
);
}
// ═══════════════════════════════════════════════════════════
// ── 4 ── PERMISOS view (app_grants matrix) ─────────────────
// ═══════════════════════════════════════════════════════════
function PermisosView({ state, dispatch, density, t }) {
const [q, setQ] = useState("");
const compact = density === "compact";
const filtered = useMemo(() => {
const lower = q.toLowerCase();
if (!lower) return state.users;
return state.users.filter(u =>
u.name.toLowerCase().includes(lower) || u.email.toLowerCase().includes(lower)
);
}, [state.users, q]);
return (
{opts.map(o => (
))}
{value && (
<>
)}
)}
One row per person, one column per app. member can sign in.
publisher unlocks per-app powers (e.g. Cocina's recipe-to-Shopify
publish button). admin implies publisher. Click any cell to change.
{/* header */}
{/* rows */}
{filtered.map((u, i) => (
dispatch({ type: "grant.set", userId: u.id, app: app.id, role })}
onRevoke={() => dispatch({ type: "grant.remove", userId: u.id, app: app.id })} />
);
})}
))}
Person
{state.apps.map(app => (
{app.label}
))}
{u.name}
{u.role === "admin" && (
site admin
)}
{open && (
<>
i.status === "sent").length} pending`}
/>
{/* send form */}
setDraft({ ...draft, email: e.target.value })}
placeholder="someone@example.com" style={input()} />
setDraft({ ...draft, name: e.target.value })}
placeholder="leave blank to use email" style={input()} />
{validation && (
{/* invite list */}
);
}
function InviteRow({ invite, state, onResend, onCancel }) {
const fam = familyById(state, invite.familyId);
const expired = invite.status === "expired";
return (
);
}
// ═══════════════════════════════════════════════════════════
// ── 6 ── ACTIVIDAD view ────────────────────────────────────
// ═══════════════════════════════════════════════════════════
function ActividadView({ state, density, t }) {
const [filter, setFilter] = useState("all");
const compact = density === "compact";
const filtered = useMemo(() => {
if (filter === "all") return state.activity;
if (filter === "stale") return [];
return state.activity.filter(a => a.kind.includes(filter));
}, [state.activity, filter]);
// stale users: last_seen > pruneAfterDays
const staleDays = state.settings.pruneAfterDays;
const staleUsers = useMemo(() => state.users.filter(u => {
if (!u.lastSeenAt) return true;
return (Date.now() - u.lastSeenAt) > staleDays * 86400 * 1000;
}), [state.users, staleDays]);
const filters = [
["all", "All"],
["signin", "Sign-ins"],
["grant", "Grant changes"],
["family", "Family moves"],
["invite", "Invites"],
["stale", "Pruning"],
];
return (
{filters.map(([k, l]) => (
))}
}
/>
{filter === "stale" ? (
);
}
function ActivityRow({ a, state, compact, last }) {
const actor = a.actor ? userById(state, a.actor) : null;
const target = a.target && userById(state, a.target);
const app = a.app && appById(state, a.app);
const verb = {
"signin": "signed in to",
"grant": "granted",
"revoke": "revoked",
"invite": "invited",
"invite-expired": "invite expired for",
"family-move": "moved",
"family-create": "created a family",
"family-dissolve": "dissolved a family",
}[a.kind] || a.kind;
const tint = {
"signin": "var(--demos)",
"grant": "var(--gold)",
"revoke": "var(--ember)",
"invite": "var(--gold)",
"invite-expired": "var(--ember)",
"family-move": "var(--gold)",
"family-create": "var(--gold)",
}[a.kind] || "var(--ink-mid)";
return (
setOpen(false)} style={{ position: "fixed", inset: 0, zIndex: 1 }} />
);
}
// ═══════════════════════════════════════════════════════════
// ── 5 ── INVITACIONES view ─────────────────────────────────
// ═══════════════════════════════════════════════════════════
function InvitacionesView({ state, dispatch, density, t }) {
const [draft, setDraft] = useState({
email: "", name: "", familyId: 1,
apps: { cellar: false, cocina: false, demos: false, recuerdas: false },
});
const [validation, setValidation] = useState(null);
function send() {
const email = draft.email.trim().toLowerCase();
if (!/^[^\s@]+@[^\s@]+\.[^\s@]+$/.test(email)) {
setValidation("Email looks malformed.");
return;
}
if (state.users.some(u => u.email.toLowerCase() === email)) {
setValidation("Someone with that email is already in the house.");
return;
}
const appsArr = Object.entries(draft.apps).filter(([,v]) => v).map(([k]) => k);
if (appsArr.length === 0) {
setValidation("Pick at least one app to grant access to.");
return;
}
setValidation(null);
const id = `i${Math.random().toString(36).slice(2, 7)}`;
dispatch({ type: "invite.send", invite: {
id, email, name: draft.name.trim() || email.split("@")[0],
familyId: draft.familyId, sentAt: Date.now(),
sentBy: "mike", apps: appsArr, status: "sent",
}});
setDraft({ email: "", name: "", familyId: 1,
apps: { cellar: false, cocina: false, demos: false, recuerdas: false } });
}
return (
{["member", "publisher", "admin"].map(o => (
))}
{role && (
<>
)}
)}
{t("Enviar un código", "Send a sign-in code")}
{[{ id: null, name: "no family" }, ...state.families].map(f => (
))}
{state.apps.map(app => {
const on = draft.apps[app.id];
return (
);
})}
{validation}
)}
Pending · sent
{state.invites.length === 0 && dispatch({ type: "invite.resend", id: inv.id })}
onCancel={() => dispatch({ type: "invite.cancel", id: inv.id })} />
))}
{invite.name}
{invite.email}
{fam && {fam.name}}
{invite.apps.map(aid => {
const app = appById(state, aid);
return app ?
{expired ? "EXPIRED" : "SENT"}
{relTime(invite.sentAt)} ago
{relTime(invite.sentAt)} ago
{filtered.map((a, i) => (
)}
{actor && (
<>
{a.detail && (
{a.detail}
)}
{t(
`Estos ${users.length} no han iniciado sesión en más de ${staleDays} días. ¿Limpieza?`,
`These ${users.length} haven't signed in in over ${staleDays} days — candidates for pruning.`
)}
{users.map(u => (
{u.name}
{u.email}
{Object.entries(s.feeds).map(([key, on]) => {
const app = appById(state, key) || { id: key, label: key, hex: "var(--gold)" };
return (
{app.label || key}
https://{key}.casam.me/api/today
dispatch({
type: "settings.patch", patch: { feeds: { ...s.feeds, [key]: v } }
})} />
);
})}
Web push enabled
· iOS Home Screen only
dispatch({ type: "settings.patch", patch: { pushEnabled: v } })} />
Accounts not seen in this window show up under Activity → Pruning.
SPEC · M-2026-05-27
Migration · families → identity-db
Move families to where it belongs.
Today the families table lives in
casam_cellar.families — a historical
accident from when the household concept first grew inside
Cellar. Every tenant app now needs to read it. The canonical
home is identity-db.
From casam-cellar/src/schema.sql (v3.0 block):
{`CREATE TABLE IF NOT EXISTS families (
id SERIAL PRIMARY KEY,
name TEXT NOT NULL,
created_at TIMESTAMPTZ NOT NULL DEFAULT NOW(),
created_by UUID -- ref identity-db.users.id
);
-- + user_profiles.family_id`}
Three problems: (a) cellar isn't the owner — families
are a Casa M concept that Cellar happens to consume; (b)
cross-database FKs aren't a real thing in Postgres, so the
created_by UUID is unenforced; (c)
Cocina, Recuerdas, Demos all need this data and currently
have no clean way to read it.
Live in identity-db, beside users:
{`-- migrations/0002_families.sql (in casam-auth/server/migrations)
BEGIN;
CREATE TABLE IF NOT EXISTS families (
id UUID PRIMARY KEY DEFAULT gen_random_uuid(),
name TEXT NOT NULL,
head_of_household UUID REFERENCES users(id) ON DELETE SET NULL,
created_at TIMESTAMPTZ NOT NULL DEFAULT NOW(),
created_by UUID REFERENCES users(id) ON DELETE SET NULL,
dissolved_at TIMESTAMPTZ
);
CREATE INDEX IF NOT EXISTS families_hoh_idx ON families (head_of_household);
ALTER TABLE users
ADD COLUMN IF NOT EXISTS family_id UUID
REFERENCES families(id) ON DELETE SET NULL;
CREATE INDEX IF NOT EXISTS users_family_idx ON users (family_id);
COMMIT;`}
Notes: UUID (consistent with the rest of identity-db, versus the v3.0 SERIAL), family_id on users (not user_profiles — Cellar's user_profiles row is Cellar-specific data; family is identity-level), head_of_household FK (real referential integrity now that it's in the same DB), dissolved_at (soft-delete; audit trail beats hard delete for a household concept).
{`-- 1. dump cellar families to JSON
COPY (SELECT id, name, created_at, created_by FROM casam_cellar.families)
TO '/tmp/families.json';
-- 2. into identity-db, mint a UUID for each old SERIAL id and keep
-- a mapping table for the duration of the migration:
CREATE TEMP TABLE family_id_map (old_id INT, new_id UUID);
INSERT INTO families (id, name, created_at, created_by)
SELECT gen_random_uuid(), name, created_at, created_by
FROM jsonb_populate_recordset(NULL::families_import, :json)
RETURNING id, name INTO family_id_map (new_id, name);
-- 3. backfill users.family_id by joining cellar.user_profiles via
-- the map. The cellar app gets a one-line read shim while it
-- catches up:
-- db.query("SELECT family_id FROM identity.users WHERE id = $1")`}
- casam-auth — ships the new schema + a
/api/familiesCRUD that the landing page (and this panel) reads from. Apps consume via the shared@casa-m-spice-co/authidentity helper. - casam-cellar — drop the local
familiestable, replaceuser_profiles.family_idreads with a call to identity-db. Add a deprecation banner if pre-migration deploys exist. - cocina · recuerdas · demos — already read identity-db for users. Add the family join. No schema change.
- casam.me (this panel) — switch from
seed → real
/api/families.
Soft-delete only on the cellar side until two deploys
have shipped without incident. Keep the cellar
families table around for ≥ 14
days; drop it in 0003_drop_cellar_families.sql
once cellar logs show zero reads against it.
Status
Spec'd · not yet executed. This Consola is rendering against the target shape so the UI ships before the migration does.
{num}
{title}
{children}
{children}
);
}
// ─── shared style helpers ─────────────────────────────────
function cta() {
return {
padding: "11px 18px", borderRadius: 4, cursor: "pointer",
background: "var(--gold)", color: "var(--bg)",
border: "1px solid var(--gold-deep)",
fontFamily: "var(--sans)", fontSize: 10.5, letterSpacing: 2,
fontWeight: 700, textTransform: "uppercase",
transition: "transform 100ms ease, background 100ms ease",
};
}
function ctaSm(bg) {
return {
padding: "6px 12px", borderRadius: 999, cursor: "pointer",
background: bg, color: "var(--ink-soft)",
border: "1px solid var(--line)",
fontFamily: "var(--sans)", fontSize: 9.5, letterSpacing: 1.6,
fontWeight: 700, textTransform: "uppercase",
};
}
function input() {
return {
width: "100%", padding: "9px 12px", borderRadius: 4,
background: "rgba(0,0,0,0.30)", border: "1px solid var(--line)",
color: "var(--ink)", fontFamily: "var(--sans)", fontSize: 13,
outline: 0,
};
}
function lbl() {
return {
fontFamily: "var(--sans)", fontSize: 9, letterSpacing: 1.8,
color: "var(--ink-mid)", fontWeight: 700, textTransform: "uppercase",
display: "inline-block",
};
}
function thStyle() {
return {
fontFamily: "var(--sans)", fontSize: 9, letterSpacing: 1.8,
color: "var(--ink-mid)", fontWeight: 700, textTransform: "uppercase",
};
}
function mono() {
return {
fontFamily: "var(--mono)", fontSize: 12,
background: "rgba(0,0,0,0.22)", color: "var(--gold-hi)",
padding: "1px 6px", borderRadius: 3, letterSpacing: 0.2,
};
}
function Section({ label, children }) {
return (
{label}
{children}
{label}
{children}
{options.map(([k, l]) => (
))}
);
}
function Toggle({ on, onChange }) {
return (
);
}
// ─── export ───────────────────────────────────────────────
Object.assign(window, {
CASAM_VIEWS: {
FamiliasView, PersonasView, PersonaDetail, PermisosView,
InvitacionesView, ActividadView, CasaView, MigrationSpec,
Avatar, RoleChip,
},
});
})();