import React from "react" import { callAI } from "call-ai" import { useFireproof } from "use-fireproof" import { useViewer } from "use-vibes" export default function App() { const { viewer, can } = useViewer(); const { useDocument, useLiveQuery, database } = useFireproof("chore-slab"); const { doc: newMember, merge: mergeMember, submit: submitMember } = useDocument({ type: "member", name: "", createdAt: Date.now() }); const { doc: newChore, merge: mergeChore, submit: submitChore } = useDocument({ type: "chore", name: "", assignee: "", createdAt: Date.now() }); const { docs: members } = useLiveQuery("type", { key: "member" }); const { docs: chores } = useLiveQuery("type", { key: "chore" }); const { docs: completions } = useLiveQuery("type", { key: "completion" }); const { docs: swaps } = useLiveQuery("type", { key: "swap" }); const [isLoading, setIsLoading] = React.useState(false); const weekKey = (() => { const d = new Date(); const onejan = new Date(d.getFullYear(), 0, 1); const week = Math.ceil(((d - onejan) / 86400000 + onejan.getDay() + 1) / 7); return `${d.getFullYear()}-W${week}`; })(); async function suggestRotation() { if (members.length === 0 || chores.length === 0) return; setIsLoading(true); try { const prompt = `Assign chores fairly. Members: ${members.map(m => m.name).join(", ")}. Chores: ${chores.map(c => c.name).join(", ")}. Return assignments.`; const res = await callAI(prompt, { schema: { properties: { assignments: { type: "array", items: { type: "object", properties: { chore: { type: "string" }, member: { type: "string" } } } } } } }); const { assignments } = JSON.parse(res); for (const a of assignments) { const chore = chores.find(c => c.name === a.chore); if (chore) await database.put({ ...chore, assignee: a.member }); } } finally { setIsLoading(false); } } const c = { page: "min-h-screen bg-[#e0dfdb] text-[#000000] font-[Inter,sans-serif]", header: "bg-[#0a0a0a] text-[#e0dfdb] px-5 py-6 border-b-4 border-[#e8f547]", title: "text-3xl font-bold tracking-tight", tagline: "text-sm text-[#e0dfdb]/70 mt-1 font-mono", main: "max-w-2xl mx-auto p-4 space-y-4", section: "bg-white border-2 border-[#0a0a0a] rounded-lg p-4 shadow-[4px_4px_0_#0a0a0a]", h2: "text-xl font-bold mb-3 uppercase tracking-wide", btn: "bg-[#e8f547] text-[#0a0a0a] border-2 border-[#0a0a0a] px-4 py-3 rounded font-bold min-h-[44px] active:translate-y-0.5 active:shadow-none shadow-[2px_2px_0_#0a0a0a]", btnGhost: "bg-white text-[#0a0a0a] border-2 border-[#0a0a0a] px-4 py-3 rounded font-bold min-h-[44px]", input: "w-full border-2 border-[#0a0a0a] rounded px-3 py-3 bg-white text-[#0a0a0a] min-h-[44px]", row: "flex items-center justify-between gap-3 py-3 border-b border-[#0a0a0a]/20 last:border-0", pill: "inline-block bg-[#e8f547] border-2 border-[#0a0a0a] text-[#0a0a0a] text-xs px-2 py-0.5 rounded font-mono font-bold", readonly: "text-sm italic text-[#0a0a0a]/60 font-mono", }; return (

Household

No members yet.
{m.name} {can("write") && }

{can("write") ? ( ) :

Read-only view.

}

Chores

No chores yet.
{ch.name}

→ {ch.assignee || "unassigned"}

{can("write") && }

{can("write") && ( <> )}

This Week {weekKey}

No assignments yet. Add chores and assign them above.
{ if (done) database.del(done._id); else database.put({ type: "completion", choreId: ch._id, week: weekKey, by: ch.assignee, at: Date.now() }); }} />

{ch.name}

{ch.assignee} · streak: {streak}

Swap Requests

No pending swaps.
{ch.name}

{s.from} → {s.to}

{can("write") && (

)}

{can("write") && chores.filter(ch => ch.assignee).length > 0 && members.length > 1 && ( )}

); }

Household

Chores

This Week 2026-W44

Swap Requests