[{"_1":2,"_3":-5,"_4":-5},"loaderData",{"_5":6,"_7":8},"actionData","errors","root",{"_115":116,"_117":118},"routes/embed.x.$handle.$name.$",{"_9":10,"_11":12,"_13":14,"_15":16,"_17":18,"_19":20,"_21":-5},"handle","alshell7","name","aflabs-pm","path","frontend/components/GrowthSuite.tsx","project",{"_22":49,"_11":12,"_35":50,"_51":-5,"_52":44,"_53":54,"_55":54,"_56":57,"_58":59,"_60":61,"_62":63,"_64":34,"_65":-5,"_66":-5,"_67":68,"_69":70,"_71":72,"_73":74,"_75":76,"_77":-5,"_78":79,"_80":79,"_81":82,"_83":82,"_84":82,"_85":79,"_86":79,"_87":88,"_89":90,"_91":92,"_93":44},"file",{"_22":23,"_11":24,"_25":26,"_27":28,"_29":30,"_31":32,"_33":34,"_35":36,"_37":38,"_39":40,"_41":42,"_43":44,"_45":-5,"_13":46},"permalink","https://www.val.town/x/alshell7/aflabs-pm/code/frontend/components/GrowthSuite.tsx","extension","id","2421f7e7-b11c-429f-91f6-3cfb3a11f55d","GrowthSuite.tsx","fileId","17224988-9756-11f1-bd2f-1607ee4eb77e","parentId","019fada5-614d-738d-bbb2-75aad905c767","branchId","ec297ab1-9bec-46a6-a3e9-7163c0e2fcfa","branchVersion",122,"latest",true,"createdAt",["D",1786662430541],"version",7,"fileType","script","content","/** @jsxImportSource https://esm.sh/react@18.2.0 */\nimport React, { useEffect, useMemo, useRef, useState } from \"https://esm.sh/react@18.2.0\";\nimport { marked } from \"https://esm.sh/marked@15.0.7\";\nimport DOMPurify from \"https://esm.sh/dompurify@3.2.4\";\n\ntype Actor = {\n actorType: \"internal\" | \"partner\" | \"client\";\n actorId: string;\n name: string;\n role: string;\n permissions: Record;\n};\n\nasync function api(path: string, options: RequestInit = {}) {\n const headers = { ...(options.body ? { \"Content-Type\": \"application/json\" } : {}), ...(options.headers || {}) };\n const response = await fetch(path, { ...options, headers, cache: \"no-store\" });\n const type = response.headers.get(\"content-type\") || \"\";\n const data = type.includes(\"application/json\") ? await response.json() : await response.text();\n if (!response.ok) throw new Error(data?.error || data || \"Request failed\");\n return data;\n}\nconst post = (path: string, data: any) => api(path, { method: \"POST\", body: JSON.stringify(data) });\nconst patch = (path: string, data: any) => api(path, { method: \"PATCH\", body: JSON.stringify(data) });\nconst remove = (path: string) => api(path, { method: \"DELETE\" });\nconst formData = (form: HTMLFormElement) => Object.fromEntries(new FormData(form));\nconst titleCase = (value: unknown) => String(value || \"\").replaceAll(\"-\", \" \").replace(/\\b\\w/g, (letter) => letter.toUpperCase());\nconst shortDate = (value?: string) => value ? new Intl.DateTimeFormat(\"en\", { day: \"numeric\", month: \"short\", year: \"numeric\" }).format(new Date(value)) : \"Not set\";\nconst shortDateTime = (value?: string) => value ? new Intl.DateTimeFormat(\"en\", { day: \"numeric\", month: \"short\", hour: \"numeric\", minute: \"2-digit\" }).format(new Date(value)) : \"Not set\";\nconst money = (value: unknown, currency = \"INR\") => new Intl.NumberFormat(\"en-IN\", { style: \"currency\", currency, maximumFractionDigits: 2 }).format(Number(value) || 0);\nconst pct = (value: number, total: number) => total > 0 ? Math.min(100, Math.round(value / total * 100)) : 0;\n\nfunction Field({ label, hint, children, className = \"\" }: any) {\n return {label}{children}{hint && {hint}};\n}\nfunction Button({ children, variant = \"\", className = \"\", ...props }: any) {\n return ;\n}\nfunction Empty({ title, text }: any) {\n return

{title}

{text}

;\n}\nfunction Loading() {\n return

Loading content

;\n}\nfunction GrowthDialog({ open, close, label, className = \"\", children }: any) {\n const ref = useRef(null);\n useEffect(() => {\n const node = ref.current;\n if (!node) return;\n if (open && !node.open) node.showModal();\n if (!open && node.open) node.close();\n }, [open]);\n return { event.preventDefault(); close(); }} onClick={(event) => { if (event.target === ref.current) close(); }}>{children};\n}\nfunction Progress({ value, total, label }: any) {\n const percent = pct(Number(value), Number(total));\n return
{label}{value} / {total}
{percent}% achieved
;\n}\n\nexport function MarkdownBlock({ value, empty = \"No detailed notes yet.\" }: { value?: string; empty?: string }) {\n const html = useMemo(() => DOMPurify.sanitize(String(marked.parse(value || \"\", { async: false }))), [value]);\n if (!value) return
{empty}
;\n return
;\n}\n\nexport function CommercialPreview({ partnerId, regularCost, partnerCost, currency, taxRate, taxInclusive }: any) {\n const regular = Math.max(0, Number(regularCost) || 0);\n const managed = partnerId ? Math.max(0, Number(partnerCost) || 0) : regular;\n const rate = Math.max(0, Number(taxRate) || 0);\n const tax = taxInclusive ? managed - managed / (1 + rate / 100 || 1) : managed * rate / 100;\n const clientTotal = taxInclusive ? managed : managed + tax;\n const partnerMargin = partnerId ? Math.max(0, managed - regular) : 0;\n return
\n
Commercial preview{money(clientTotal, currency)}
\n
Regular delivery cost{money(regular, currency)}
\n {partnerId &&
Partner-managed client cost{money(managed, currency)}
}\n {partnerId &&
Partner commercial spread{money(partnerMargin, currency)}
}\n
{taxInclusive ? \"Tax included in cost\" : \"Tax added\"} · {rate}%{money(tax, currency)}
\n
Client invoice total{money(clientTotal, currency)}
\n
;\n}\n\nexport function InvoiceComposer({ project, detail, onDone, notify }: any) {\n const [items, setItems] = useState([{ description: \"\", quantity: 1, unit_price: 0 }]);\n const [discount, setDiscount] = useState(0);\n const [arrears, setArrears] = useState(0);\n const [taxRate, setTaxRate] = useState(Number(project.tax_rate) || 0);\n const [busy, setBusy] = useState(false);\n const subtotal = items.reduce((sum, item) => sum + (Number(item.quantity) || 0) * (Number(item.unit_price) || 0), 0);\n const taxable = Math.max(0, subtotal - discount + arrears);\n const tax = taxable * taxRate / 100;\n const total = taxable + tax;\n const update = (index: number, key: string, value: any) => setItems((current) => current.map((item, itemIndex) => itemIndex === index ? { ...item, [key]: value } : item));\n const submit = async (event: any) => {\n event.preventDefault();\n setBusy(true);\n try {\n const data: any = formData(event.currentTarget);\n data.milestone_ids = new FormData(event.currentTarget).getAll(\"milestone_ids\");\n data.items = items;\n data.discount = discount;\n data.arrears = arrears;\n data.tax_rate = taxRate;\n await post(\"/api/projects/\" + project.id + \"/invoices\", data);\n notify(\"Itemized invoice created\");\n onDone();\n } catch (error: any) { notify(error.message, \"error\"); } finally { setBusy(false); }\n };\n return
\n
\n
Create invoice
Build a clear, itemized document for {project.title}.
\n {project.currency}\n
\n
\n
Line items
Add each deliverable or charge separately.
\n
DescriptionQtyUnit priceAmount
\n
{items.map((item, index) =>
\n Description update(index, \"description\", event.target.value)} required/>\n Quantity update(index, \"quantity\", event.target.value)} required/>\n Unit price update(index, \"unit_price\", event.target.value)} required/>\n {money(Number(item.quantity) * Number(item.unit_price), project.currency)}\n {items.length > 1 ? : }\n
)}
\n
\n
\n
Invoice details
Set timing, adjustments, and tax treatment.
\n
\n \n \n setDiscount(Number(event.target.value))}/>\n setArrears(Number(event.target.value))}/>\n \n setTaxRate(Number(event.target.value))}/>\n
\n
\n {detail.milestones?.length > 0 &&
Covered milestones
{detail.milestones.map((milestone: any) => {milestone.title})}
}\n </Field>\n <footer className=\"invoice-composer-footer\">\n <div className=\"invoice-totals\"><div><span>Subtotal</span><b>{money(subtotal, project.currency)}</b></div><div><span>Discount</span><b>− {money(discount, project.currency)}</b></div><div><span>Arrears</span><b>+ {money(arrears, project.currency)}</b></div><div><span>Tax</span><b>+ {money(tax, project.currency)}</b></div><div className=\"total\"><span>Total</span><strong>{money(total, project.currency)}</strong></div></div>\n <Button disabled={busy || !items.some((item) => item.description && Number(item.quantity) > 0)}>{busy ? \"Creating invoice…\" : \"Create invoice PDF\"}</Button>\n </footer>\n </form>;\n}\n\nexport function PartnerProjectEditor({ project, onDone, notify }: any) {\n const [busy, setBusy] = useState(false);\n const submit = async (event: any) => {\n event.preventDefault();\n setBusy(true);\n try {\n await patch(\"/api/projects/\" + project.id, formData(event.currentTarget));\n notify(\"Project details updated\");\n onDone();\n } catch (error: any) { notify(error.message, \"error\"); } finally { setBusy(false); }\n };\n return <form className=\"growth-partner-editor\" onSubmit={submit}>\n <header><div><h3>Edit project details</h3><p>Update the delivery summary and working notes your AFLABS team will use.</p></div><span>Partner access</span></header>\n <div className=\"growth-form-grid\">\n <Field label=\"Project title\"><input name=\"title\" defaultValue={project.title} required/></Field>\n <Field label=\"Project type\"><select name=\"project_type\" defaultValue={project.project_type}><option>Billable</option><option>R&D</option><option>Community</option></select></Field>\n <Field label=\"One-line summary\" className=\"growth-span-2\" hint=\"Keep this concise; use the notes field for full context.\"><input name=\"description\" defaultValue={project.description || \"\"} maxLength={240}/></Field>\n <Field label=\"Start date\"><input name=\"start_date\" type=\"date\" defaultValue={project.start_date || \"\"}/></Field>\n <Field label=\"Target date\"><input name=\"end_date\" type=\"date\" defaultValue={project.end_date || \"\"}/></Field>\n <Field label=\"Project email\" className=\"growth-span-2\"><input name=\"contact_email\" type=\"email\" defaultValue={project.contact_email || \"\"}/></Field>\n <Field label=\"Detailed working notes\" className=\"growth-span-2 project-markdown-field\" hint=\"Markdown is supported for headings, lists, links, and code.\"><textarea name=\"markdown_details\" rows={12} defaultValue={project.markdown_details || \"\"} placeholder={\"# Context\\n\\n## Requirements\\n- Add working notes here\"}/></Field>\n </div>\n <footer><Button disabled={busy}>{busy ? \"Saving changes…\" : \"Save project details\"}</Button></footer>\n </form>;\n}\n\nexport function GrowthDashboard({ actor, notify }: any) {\n const [data, setData] = useState<any>(null);\n useEffect(() => { api(\"/api/growth/dashboard\").then(setData).catch((error) => notify(error.message, \"error\")); }, []);\n if (!data) return <Loading/>;\n return <section className=\"growth-dashboard\">\n <div className=\"growth-metrics\">\n <article><span>Open pipeline</span><b>{money(data.pipeline_value, data.pipeline_currency)}</b><small>{data.leads_total} leads · {data.conversion_rate}% converted</small></article>\n <article className={data.overdue_projects ? \"risk\" : \"\"}><span>Delivery health</span><b>{data.active_projects}</b><small>{data.overdue_projects} overdue projects</small></article>\n <article><span>Upcoming meetings</span><b>{data.upcoming_meetings}</b><small>Booked or confirmed</small></article>\n <article className={data.unread_conversations ? \"attention\" : \"\"}><span>Unread threads</span><b>{data.unread_conversations}</b><small>Scoped partner conversations</small></article>\n </div>\n {actor.actorType === \"partner\" && data.target?.target && <div className=\"partner-target-strip\">\n <header><div><span>Monthly trajectory</span><h3>{data.target.month}</h3></div><small>Stay ahead of the gap before month-end.</small></header>\n <Progress label=\"Leads\" value={data.target.achieved.leads} total={data.target.target.leads_target}/>\n <Progress label=\"Expected Project Conversions\" value={data.target.achieved.projects} total={data.target.target.projects_target}/>\n <Progress label={\"Revenue · \" + data.target.target.revenue_currency} value={data.target.achieved.revenue} total={data.target.target.revenue_target}/>\n <Progress label=\"Meetings used\" value={data.target.achieved.meetings} total={data.target.target.meetings_allowed}/>\n </div>}\n </section>;\n}\n\nfunction LeadWorkspace({ actor, notify, onOpenProject, initialLeadId }: any) {\n const [data, setData] = useState<any>(null);\n const [selectedId, setSelectedId] = useState(\"\");\n const [detail, setDetail] = useState<any>(null);\n const [createOpen, setCreateOpen] = useState(false);\n const [search, setSearch] = useState(\"\");\n const [stage, setStage] = useState(\"\");\n const [partner, setPartner] = useState(\"\");\n const [due, setDue] = useState(\"\");\n const [creating, setCreating] = useState(false);\n const load = async () => setData(await api(\"/api/leads\"));\n const loadDetail = async (id: string) => { setSelectedId(id); setDetail(await api(\"/api/leads/\" + id)); };\n useEffect(() => { load().then(() => initialLeadId ? loadDetail(initialLeadId) : undefined).catch((error) => notify(error.message, \"error\")); }, []);\n if (!data) return <Loading/>;\n const visible = data.leads.filter((lead: any) => {\n const haystack = [lead.title, lead.company_name, lead.contact_name, lead.category, lead.partner_name].join(\" \").toLowerCase();\n if (search && !haystack.includes(search.toLowerCase())) return false;\n if (stage && lead.stage !== stage) return false;\n if (partner && String(lead.partner_id || \"\") !== partner) return false;\n if (due === \"overdue\" && !(lead.next_follow_up_at && Date.parse(lead.next_follow_up_at) < Date.now())) return false;\n if (due === \"upcoming\" && !(lead.next_follow_up_at && Date.parse(lead.next_follow_up_at) >= Date.now())) return false;\n if (due === \"none\" && lead.next_follow_up_at) return false;\n return true;\n });\n const activeFilterCount = [search, stage, partner, due].filter(Boolean).length;\n const create = async (event: any) => {\n event.preventDefault();\n const form = event.currentTarget;\n setCreating(true);\n try {\n const result = await post(\"/api/leads\", formData(form));\n form.reset();\n setCreateOpen(false);\n await load();\n await loadDetail(result.id);\n notify(\"Lead created\");\n } catch (error: any) { notify(error.message, \"error\"); } finally { setCreating(false); }\n };\n const refreshDetail = async () => { await load(); if (selectedId) await loadDetail(selectedId); };\n return <div className=\"growth-page\">\n <header className=\"growth-page-head\"><div><h1>Leads</h1><span>Qualify opportunities, preserve every interaction, and move requirements into delivery.</span></div>{(actor.actorType === \"internal\" || actor.permissions.create_leads) && <Button onClick={() => setCreateOpen(!createOpen)}>{createOpen ? \"Close form\" : \"New lead\"}</Button>}</header>\n {createOpen && <section className=\"growth-panel lead-create\"><header className=\"growth-section-title\"><div><h2>Create lead</h2><p>Capture the commercial context now; refine requirements as discovery progresses.</p></div></header><form className=\"growth-form-grid\" onSubmit={create} aria-busy={creating}>\n <Field label=\"Lead title\"><input name=\"title\" required placeholder=\"Retail automation opportunity\"/></Field>\n <Field label=\"Customer / brand\"><input name=\"company_name\" required/></Field>\n <Field label=\"Contact name\"><input name=\"contact_name\"/></Field>\n <Field label=\"Contact email\"><input name=\"contact_email\" type=\"email\"/></Field>\n <Field label=\"Contact phone\"><input name=\"contact_phone\"/></Field>\n <Field label=\"Source\"><input name=\"source\" placeholder=\"Referral, event, inbound…\"/></Field>\n <Field label=\"Category\"><input name=\"category\" placeholder=\"Retail, healthcare, logistics…\"/></Field>\n <Field label=\"Business type\"><input name=\"business_type\" placeholder=\"B2B, D2C, services…\"/></Field>\n <Field label=\"Expected budget\"><input name=\"expected_budget\" type=\"number\" min=\"0\"/></Field>\n <Field label=\"Currency\"><select name=\"currency\"><option>INR</option><option>USD</option><option>SAR</option><option>AED</option></select></Field>\n {actor.actorType === \"internal\" && <Field label=\"Partner\"><select name=\"partner_id\"><option value=\"\">Direct AFLABS</option>{data.options.partners.map((item: any) => <option value={item.id}>{item.name}</option>)}</select></Field>}\n {actor.actorType === \"internal\" && <Field label=\"Owner\"><select name=\"owner_user_id\"><option value=\"\">Me / default</option>{data.options.users.map((item: any) => <option value={item.id}>{item.name}</option>)}</select></Field>}\n <Field label=\"Pain points\" className=\"growth-span-2\"><textarea name=\"pain_points\" rows={4}/></Field>\n <Field label=\"Initial use-case hint\" className=\"growth-span-2\"><textarea name=\"use_case_hint\" rows={3}/></Field>\n <div className=\"growth-form-actions growth-span-2\"><Button disabled={creating}>{creating ? \"Creating lead…\" : \"Create lead\"}</Button></div>\n </form></section>}\n <section className=\"pipeline-eagle\">\n <header><div><h2>Pipeline overview</h2><p>Stage distribution and connected delivery health at a glance.</p></div><b>{data.leads.length} leads</b></header>\n <div className=\"pipeline-track\">{data.stage_order.map((name: string) => <div className={\"pipeline-stage stage-\" + name} key={name}><span>{titleCase(name)}</span><b>{data.stages[name] || 0}</b><i/></div>)}</div>\n <div className=\"pipeline-columns\">{data.stage_order.map((name: string) => <section key={name}><header><span>{titleCase(name)}</span><b>{data.stages[name] || 0}</b></header>{data.leads.filter((lead: any) => lead.stage === name).slice(0, 5).map((lead: any) => <button key={lead.id} onClick={() => loadDetail(lead.id)}><strong>{lead.company_name || lead.title}</strong><small>{money(lead.expected_budget, lead.currency)} · {lead.project_count} project{Number(lead.project_count) === 1 ? \"\" : \"s\"}</small></button>)}</section>)}</div>\n </section>\n <section className=\"lead-filter-panel\">\n <header><div><h2>Lead directory</h2><p>{visible.length} of {data.leads.length} leads shown</p></div>{activeFilterCount > 0 && <button type=\"button\" onClick={() => { setSearch(\"\"); setStage(\"\"); setPartner(\"\"); setDue(\"\"); }}>Clear filters</button>}</header>\n <div className=\"growth-filters\">\n <label className=\"growth-filter-search\"><span>Search</span><input aria-label=\"Search leads\" value={search} onChange={(event) => setSearch(event.target.value)} placeholder=\"Company, contact, or category\"/></label>\n <label><span>Stage</span><select aria-label=\"Filter leads by stage\" value={stage} onChange={(event) => setStage(event.target.value)}><option value=\"\">All stages</option>{data.stage_order.map((item: string) => <option key={item} value={item}>{titleCase(item)}</option>)}</select></label>\n {actor.actorType === \"internal\" && <label><span>Partner</span><select aria-label=\"Filter leads by partner\" value={partner} onChange={(event) => setPartner(event.target.value)}><option value=\"\">All partners</option>{data.options.partners.map((item: any) => <option key={item.id} value={item.id}>{item.name}</option>)}</select></label>}\n <label><span>Follow-up</span><select aria-label=\"Filter leads by follow-up\" value={due} onChange={(event) => setDue(event.target.value)}><option value=\"\">Any follow-up</option><option value=\"overdue\">Overdue</option><option value=\"upcoming\">Upcoming</option><option value=\"none\">Not scheduled</option></select></label>\n </div>\n </section>\n <div className=\"lead-grid\">{visible.map((lead: any) => <button className=\"lead-card\" key={lead.id} onClick={() => loadDetail(lead.id)}>\n <header><span className={\"lead-priority priority-\" + lead.priority}>{lead.priority}</span><em>{titleCase(lead.stage)}</em></header>\n <h3>{lead.company_name || lead.title}</h3><p>{lead.title}</p>\n <dl><div><dt>Potential</dt><dd>{money(lead.expected_budget, lead.currency)}</dd></div><div><dt>Projects</dt><dd>{lead.project_count}</dd></div></dl>\n <footer><span>{lead.partner_name || \"Direct AFLABS\"}</span><b className={lead.next_follow_up_at && Date.parse(lead.next_follow_up_at) < Date.now() ? \"overdue\" : \"\"}>{lead.next_follow_up_at ? shortDateTime(lead.next_follow_up_at) : \"No follow-up\"}</b></footer>\n </button>)}</div>\n {!visible.length && <Empty title=\"No leads match\" text=\"Change the filters or capture a new lead.\"/>}\n <GrowthDialog className=\"lead-dialog-modal\" open={Boolean(selectedId)} label={detail ? \"Lead details for \" + (detail.lead.company_name || detail.lead.title) : \"Loading lead details\"} close={() => { setSelectedId(\"\"); setDetail(null); }}><article className=\"lead-dialog-shell\">\n <header className=\"growth-drawer-head\"><div><span>{detail ? titleCase(detail.lead.stage) : \"Loading\"}</span><h2>{detail?.lead.company_name || detail?.lead.title || \"Lead details\"}</h2></div><button type=\"button\" aria-label=\"Close lead details\" onClick={() => { setSelectedId(\"\"); setDetail(null); }}>Close</button></header>\n {!detail ? <Loading/> : <LeadDetail detail={detail} actor={actor} notify={notify} refresh={refreshDetail} onOpenProject={onOpenProject}/>}\n </article></GrowthDialog>\n </div>;\n}\n\nfunction LeadDetail({ detail, actor, notify, refresh, onOpenProject }: any) {\n const lead = detail.lead;\n const [activeTab, setActiveTab] = useState(\"details\");\n const [saving, setSaving] = useState(false);\n const editable = actor.actorType === \"internal\" || actor.permissions.edit_leads;\n const convertible = actor.actorType === \"internal\" || (actor.permissions.convert_leads && actor.permissions.create_projects);\n const update = async (event: any) => {\n event.preventDefault();\n setSaving(true);\n try { await patch(\"/api/leads/\" + lead.id, formData(event.currentTarget)); await refresh(); notify(\"Lead updated\"); } catch (error: any) { notify(error.message, \"error\"); } finally { setSaving(false); }\n };\n const addFollowup = async (event: any) => {\n event.preventDefault();\n const form = event.currentTarget;\n try { await post(\"/api/leads/\" + lead.id + \"/followups\", formData(form)); form.reset(); await refresh(); notify(\"Follow-up scheduled\"); } catch (error: any) { notify(error.message, \"error\"); }\n };\n const createProject = async (event: any) => {\n event.preventDefault();\n try {\n const result = await post(\"/api/leads/\" + lead.id + \"/projects\", { ...formData(event.currentTarget), copy_stakeholder: true });\n await refresh();\n notify(\"Project created from lead\");\n onOpenProject(result.id);\n } catch (error: any) { notify(error.message, \"error\"); }\n };\n const attach = async (event: any) => {\n event.preventDefault();\n try { await post(\"/api/leads/\" + lead.id + \"/attach-project\", { ...formData(event.currentTarget), copy_stakeholder: true }); await refresh(); notify(\"Project attached to lead\"); } catch (error: any) { notify(error.message, \"error\"); }\n };\n const tabs = [\n [\"details\", \"Lead details\"],\n [\"followups\", \"Follow-ups\", detail.followups.filter((item: any) => item.status === \"open\").length],\n [\"projects\", \"Projects\", detail.projects.length],\n [\"history\", \"History\", detail.events.length],\n ];\n return <div className=\"lead-detail-workspace\">\n <section className=\"lead-contact-strip\"><div><span>Contact</span><b>{lead.contact_name || \"Not set\"}</b><small>{lead.contact_email || lead.contact_phone || \"No contact details\"}</small></div><div><span>Potential</span><b>{money(lead.expected_budget, lead.currency)}</b><small>{lead.partner_name || \"Direct AFLABS\"}</small></div><div><span>Next action</span><b>{lead.next_follow_up_at ? shortDateTime(lead.next_follow_up_at) : \"Not scheduled\"}</b><small>{lead.owner_name || \"No owner\"}</small></div></section>\n <nav className=\"lead-detail-tabs\" role=\"tablist\" aria-label=\"Lead workspace sections\">{tabs.map(([value, label, count]: any) => <button type=\"button\" key={value} role=\"tab\" aria-selected={activeTab === value} className={activeTab === value ? \"active\" : \"\"} onClick={() => setActiveTab(value)}><span>{label}</span>{count !== undefined && <b>{count}</b>}</button>)}</nav>\n <div className=\"lead-tab-scroll\">\n {activeTab === \"details\" && <section className=\"lead-tab-panel\" role=\"tabpanel\">\n <header className=\"lead-panel-heading\"><div><h3>Lead & requirement details</h3><p>All customer, qualification, and discovery information in one editable record.</p></div>{!editable && <span>Read only</span>}</header>\n {editable ? <form className=\"lead-record-form\" onSubmit={update} aria-busy={saving}>\n <fieldset className=\"lead-form-section\"><legend><b>Company & contact</b><span>Who the opportunity belongs to and how to reach them.</span></legend><div className=\"growth-form-grid\">\n <Field label=\"Lead title\"><input name=\"title\" defaultValue={lead.title} required/></Field>\n <Field label=\"Customer / brand\"><input name=\"company_name\" defaultValue={lead.company_name || \"\"}/></Field>\n <Field label=\"Contact name\"><input name=\"contact_name\" defaultValue={lead.contact_name || \"\"}/></Field>\n <Field label=\"Contact email\"><input name=\"contact_email\" type=\"email\" defaultValue={lead.contact_email || \"\"}/></Field>\n <Field label=\"Contact phone\"><input name=\"contact_phone\" type=\"tel\" defaultValue={lead.contact_phone || \"\"}/></Field>\n <Field label=\"Lead source\"><input name=\"source\" defaultValue={lead.source || \"\"} placeholder=\"Referral, event, inbound…\"/></Field>\n <Field label=\"Category\"><input name=\"category\" defaultValue={lead.category || \"\"}/></Field>\n <Field label=\"Business type\"><input name=\"business_type\" defaultValue={lead.business_type || \"\"}/></Field>\n </div></fieldset>\n <fieldset className=\"lead-form-section\"><legend><b>Qualification & ownership</b><span>Commercial status, responsibility, and the next action.</span></legend><div className=\"growth-form-grid\">\n <Field label=\"Stage\"><select name=\"stage\" defaultValue={lead.stage}>{[\"new\",\"contacted\",\"qualified\",\"discovery\",\"proposal\",\"negotiation\",\"won\",\"lost\"].map((item) => <option key={item} value={item}>{titleCase(item)}</option>)}</select></Field>\n <Field label=\"Priority\"><select name=\"priority\" defaultValue={lead.priority}><option>low</option><option>medium</option><option>high</option><option>urgent</option></select></Field>\n <Field label=\"Expected budget\"><input name=\"expected_budget\" type=\"number\" min=\"0\" defaultValue={lead.expected_budget}/></Field>\n <Field label=\"Currency\"><select name=\"currency\" defaultValue={lead.currency || \"INR\"}><option>INR</option><option>USD</option><option>SAR</option><option>AED</option></select></Field>\n <Field label=\"Next follow-up\"><input name=\"next_follow_up_at\" type=\"datetime-local\" defaultValue={lead.next_follow_up_at?.slice(0,16) || \"\"}/></Field>\n {actor.actorType === \"internal\" && <Field label=\"Partner\"><select name=\"partner_id\" defaultValue={lead.partner_id || \"\"}><option value=\"\">Direct AFLABS</option>{detail.options.partners.map((item: any) => <option key={item.id} value={item.id}>{item.name}</option>)}</select></Field>}\n {actor.actorType === \"internal\" && <Field label=\"Owner\"><select name=\"owner_user_id\" defaultValue={lead.owner_user_id || \"\"}><option value=\"\">No owner</option>{detail.options.users.map((item: any) => <option key={item.id} value={item.id}>{item.name}</option>)}</select></Field>}\n <Field label=\"Lost reason\"><input name=\"lost_reason\" defaultValue={lead.lost_reason || \"\"} placeholder=\"Only needed when the lead is lost\"/></Field>\n </div></fieldset>\n <fieldset className=\"lead-form-section lead-discovery-section\"><legend><b>Discovery & requirements</b><span>The context needed to shape the right solution and proposal.</span></legend><div className=\"growth-form-grid\">\n <Field label=\"Pain points\" className=\"growth-span-2\"><textarea name=\"pain_points\" rows={5} defaultValue={lead.pain_points || \"\"} placeholder=\"Where is the customer losing time, revenue, or control?\"/></Field>\n <Field label=\"Inside information\" className=\"growth-span-2\"><textarea name=\"inside_info\" rows={4} defaultValue={lead.inside_info || \"\"} placeholder=\"Current tools, decision dynamics, constraints, and context…\"/></Field>\n <Field label=\"Possible use case\" className=\"growth-span-2\"><textarea name=\"use_case_hint\" rows={4} defaultValue={lead.use_case_hint || \"\"} placeholder=\"Potential software, automation, AI, Voice AI, or WhatsApp solution…\"/></Field>\n <Field label=\"Requirements · Markdown\" className=\"growth-span-2\"><textarea name=\"requirements_markdown\" rows={12} defaultValue={lead.requirements_markdown || \"\"} placeholder=\"# Requirements - Current workflow - Constraints - Success metrics\"/></Field>\n </div></fieldset>\n <footer className=\"lead-save-bar\"><div><b>Complete lead record</b><span>Changes are added to the lead history.</span></div><Button disabled={saving}>{saving ? \"Saving lead…\" : \"Save lead details\"}</Button></footer>\n </form> : <div className=\"lead-readonly-details\"><dl><div><dt>Customer / brand</dt><dd>{lead.company_name || \"Not set\"}</dd></div><div><dt>Contact</dt><dd>{lead.contact_name || \"Not set\"}</dd></div><div><dt>Email</dt><dd>{lead.contact_email || \"Not set\"}</dd></div><div><dt>Phone</dt><dd>{lead.contact_phone || \"Not set\"}</dd></div><div><dt>Category</dt><dd>{lead.category || \"Not set\"}</dd></div><div><dt>Business type</dt><dd>{lead.business_type || \"Not set\"}</dd></div><div><dt>Source</dt><dd>{lead.source || \"Not set\"}</dd></div><div><dt>Possible use case</dt><dd>{lead.use_case_hint || \"Not set\"}</dd></div></dl><section><h3>Pain points</h3><p>{lead.pain_points || \"Not documented\"}</p></section><section><h3>Inside information</h3><p>{lead.inside_info || \"Not documented\"}</p></section><section><h3>Requirements</h3><MarkdownBlock value={lead.requirements_markdown}/></section></div>}\n </section>}\n {activeTab === \"followups\" && <section className=\"lead-tab-panel\" role=\"tabpanel\"><header className=\"lead-panel-heading\"><div><h3>Follow-ups & reminders</h3><p>Schedule and complete the next commitments for this lead.</p></div><b>{detail.followups.filter((item: any) => item.status === \"open\").length} open</b></header>\n {editable && <form className=\"followup-form\" onSubmit={addFollowup}><Field label=\"Follow-up note\"><input name=\"note\" required placeholder=\"Call after budget review\"/></Field><Field label=\"Due date and time\"><input name=\"due_at\" type=\"datetime-local\" required/></Field><Button>Schedule follow-up</Button></form>}\n <div className=\"followup-list\">{detail.followups.map((item: any) => <article key={item.id} className={item.overdue ? \"overdue\" : \"\"}><span className=\"followup-status\" aria-hidden=\"true\"/><div><b>{item.note}</b><small><time>{shortDateTime(item.due_at)}</time><em>{titleCase(item.status)}</em></small></div>{editable && item.status === \"open\" && <button type=\"button\" onClick={async () => { await patch(\"/api/lead-followups/\" + item.id, { completed: true }); await refresh(); }}>Mark complete</button>}</article>)}</div>\n {!detail.followups.length && <Empty title=\"No follow-ups\" text=\"Schedule the next action so this lead keeps moving.\"/>}\n </section>}\n {activeTab === \"projects\" && <section className=\"lead-tab-panel\" role=\"tabpanel\"><header className=\"lead-panel-heading\"><div><h3>Connected delivery</h3><p>Create several projects from this lead or attach existing work.</p></div><b>{detail.projects.length}</b></header>\n <div className=\"lead-projects\">{detail.projects.map((project: any) => <button key={project.id} onClick={() => onOpenProject(project.id)}><span className={\"project-state state-\" + project.status}/><div><b>{project.title}</b><small>{titleCase(project.status)} · {project.progress}% · {project.end_date ? shortDate(project.end_date) : \"No due date\"}</small></div><em>Open project</em></button>)}</div>\n {convertible && <details className=\"growth-accordion\"><summary>Create a project from requirements</summary><form className=\"growth-form-grid\" onSubmit={createProject}><Field label=\"Project title\"><input name=\"title\" required defaultValue={lead.company_name ? lead.company_name + \" solution\" : lead.title}/></Field><Field label=\"Type\"><select name=\"project_type\"><option>Billable</option><option>R&D</option><option>Community</option></select></Field><Field label=\"One-line description\"><input name=\"description\" defaultValue={lead.pain_points?.split(\"\\n\")[0] || \"\"}/></Field><Field label=\"Target date\"><input name=\"end_date\" type=\"date\"/></Field><Field label=\"Regular cost\"><input name=\"regular_cost\" type=\"number\" min=\"0\" defaultValue={lead.expected_budget || 0}/></Field><Field label=\"Currency\"><select name=\"currency\" defaultValue={lead.currency}><option>INR</option><option>USD</option><option>SAR</option><option>AED</option></select></Field><Field label=\"Markdown working notes\" className=\"growth-span-2\"><textarea name=\"markdown_details\" rows={8} defaultValue={lead.requirements_markdown || \"\"}/></Field><div className=\"growth-span-2\"><Button>Create linked project</Button></div></form></details>}\n {editable && <details className=\"growth-accordion\"><summary>Attach an existing project</summary><form className=\"attach-form\" onSubmit={attach}><select name=\"project_id\" required><option value=\"\">Select unattached project</option>{detail.options.projects.filter((project: any) => !project.lead_id).map((project: any) => <option key={project.id} value={project.id}>{project.title}</option>)}</select><Button>Attach & copy stakeholder</Button></form></details>}\n </section>}\n {activeTab === \"history\" && <section className=\"lead-tab-panel\" role=\"tabpanel\"><header className=\"lead-panel-heading\"><div><h3>Complete history</h3><p>What happened, when, and how long the lead waited between events.</p></div></header><div className=\"lead-timeline\">{detail.events.map((event: any) => <article key={event.id}><div className=\"timeline-node\"/><div><header><span>{titleCase(event.event_type)}</span><time>{shortDateTime(event.occurred_at)}</time></header><h4>{event.title}</h4>{event.details && <p>{event.details}</p>}<footer><span>{event.actor_name}</span><b>{event.days_ago === 0 ? \"Today\" : event.days_ago + \" days ago\"}</b>{event.days_since_previous > 0 && <em>+{event.days_since_previous} days since prior event</em>}</footer></div></article>)}</div></section>}\n </div>\n </div>;\n}\nfunction ChatWorkspace({ actor, notify, onOpenContext, onBadgeChange }: any) {\n const [data, setData] = useState<any>(null);\n const [activeId, setActiveId] = useState(\"\");\n const [thread, setThread] = useState<any>(null);\n const [createOpen, setCreateOpen] = useState(false);\n const [contextType, setContextType] = useState(\"lead\");\n const [partnerId, setPartnerId] = useState(actor.actorType === \"partner\" ? actor.actorId : \"\");\n const [threadFilter, setThreadFilter] = useState(\"all\");\n const [actionBusy, setActionBusy] = useState<\"\" | \"create\" | \"send\" | \"status\">(\"\");\n const load = async () => {\n const next = await api(\"/api/conversations\");\n setData(next);\n onBadgeChange?.(\"conversations\", next.conversations.filter((item: any) => item.unread).length);\n return next;\n };\n const open = async (id: string) => {\n setActiveId(id);\n setThread(await api(\"/api/conversations/\" + id + \"/messages\"));\n await load();\n };\n useEffect(() => { load().catch((error) => notify(error.message, \"error\")); }, []);\n if (!data) return <Loading/>;\n const contexts = contextType === \"lead\" ? data.options.leads : data.options.projects;\n const filteredContexts = partnerId ? contexts.filter((item: any) => String(item.partner_id || \"\") === partnerId) : contexts;\n const visibleThreads = threadFilter === \"all\" ? data.conversations : data.conversations.filter((item: any) => item.context_type === threadFilter);\n const create = async (event: any) => {\n event.preventDefault();\n const form = event.currentTarget;\n setActionBusy(\"create\");\n try {\n const payload: any = formData(form);\n payload.context_type = contextType;\n payload.partner_id = partnerId;\n const result = await post(\"/api/conversations\", payload);\n form.reset();\n setCreateOpen(false);\n await load();\n await open(result.id);\n notify(\"Conversation thread started\");\n } catch (error: any) { notify(error.message, \"error\"); } finally { setActionBusy(\"\"); }\n };\n const send = async (event: any) => {\n event.preventDefault();\n const form = event.currentTarget;\n setActionBusy(\"send\");\n try { await post(\"/api/conversations/\" + activeId + \"/messages\", formData(form)); form.reset(); await open(activeId); } catch (error: any) { notify(error.message, \"error\"); } finally { setActionBusy(\"\"); }\n };\n const setStatus = async () => {\n if (!thread) return;\n const next = thread.conversation.status === \"closed\" ? \"open\" : \"closed\";\n setActionBusy(\"status\");\n try { await patch(\"/api/conversations/\" + activeId, { status: next }); await open(activeId); notify(next === \"closed\" ? \"Conversation closed\" : \"Conversation reopened\"); } catch (error: any) { notify(error.message, \"error\"); } finally { setActionBusy(\"\"); }\n };\n return <div className=\"growth-page chat-page\"><header className=\"growth-page-head\"><div><h1>Conversations</h1><span>Focused one-to-one threads attached to a lead or project.</span></div><Button onClick={() => setCreateOpen(!createOpen)}>{createOpen ? \"Close form\" : \"Start conversation\"}</Button></header>\n {createOpen && <section className=\"growth-panel chat-create-panel\"><header className=\"growth-section-title\"><div><h2>Start a conversation</h2><p>Choose one partner, one business context, and a clear subject.</p></div></header><form className=\"growth-form-grid\" onSubmit={create} aria-busy={actionBusy === \"create\"}>\n {actor.actorType === \"internal\" && <Field label=\"Partner\"><select value={partnerId} onChange={(event) => setPartnerId(event.target.value)} required><option value=\"\">Select partner</option>{data.options.partners.map((item: any) => <option key={item.id} value={item.id}>{item.name}</option>)}</select></Field>}\n {actor.actorType === \"partner\" && <Field label=\"AFLABS person\"><select name=\"internal_user_id\" required><option value=\"\">Select person</option>{data.options.users.map((item: any) => <option key={item.id} value={item.id}>{item.name} · {titleCase(item.role)}</option>)}</select></Field>}\n <Field label=\"Context type\"><select value={contextType} onChange={(event) => setContextType(event.target.value)}><option value=\"lead\">Lead</option><option value=\"project\">Project</option></select></Field>\n <Field label=\"Lead / project\"><select name=\"context_id\" required><option value=\"\">Select context</option>{filteredContexts.map((item: any) => <option key={item.id} value={item.id}>{item.title || item.company_name}</option>)}</select></Field>\n <Field label=\"Thread subject\"><input name=\"subject\" required placeholder=\"Budget approval questions\"/></Field>\n <Field label=\"Opening message\" className=\"growth-span-2\"><textarea name=\"message\" rows={4} required/></Field>\n <div className=\"growth-form-actions growth-span-2\"><Button disabled={Boolean(actionBusy)}>{actionBusy === \"create\" ? \"Starting conversation…\" : \"Start conversation\"}</Button></div>\n </form></section>}\n <div className=\"chat-layout\"><aside className=\"thread-list\"><header className=\"thread-list-head\"><div><h2>Threads</h2><p>{visibleThreads.length} of {data.conversations.length}</p></div><div className=\"thread-context-filter\" role=\"group\" aria-label=\"Filter conversations by context\">{[[\"all\",\"All\"],[\"lead\",\"Leads\"],[\"project\",\"Projects\"]].map(([value,label]) => <button type=\"button\" key={value} className={threadFilter === value ? \"active\" : \"\"} aria-pressed={threadFilter === value} onClick={() => setThreadFilter(value)}>{label}</button>)}</div></header>{visibleThreads.map((item: any) => <button key={item.id} className={(activeId === item.id ? \"active \" : \"\") + (item.unread ? \"unread \" : \"\") + (item.status === \"closed\" ? \"closed\" : \"\")} onClick={() => open(item.id)}><span>{titleCase(item.context_type)} · {item.context_title}</span><h3>{item.subject}</h3><p>{actor.actorType === \"partner\" ? item.internal_name : item.partner_name}{item.last_message ? \" · \" + item.last_message.slice(0, 72) : \"\"}</p><small>{item.status === \"closed\" ? \"Closed · \" : \"\"}{item.updated_at ? shortDateTime(item.updated_at) : \"\"}</small>{item.unread && <i aria-label=\"Unread\"/>}</button>)}{!visibleThreads.length && <Empty title={threadFilter === \"all\" ? \"No conversations yet\" : \"No \" + threadFilter + \" threads\"} text={threadFilter === \"all\" ? \"Start a focused thread for a lead or project.\" : \"Choose another filter or start a conversation for this context.\"}/>}</aside>\n <section className=\"chat-thread\">{!thread ? <Empty title=\"Select a conversation\" text=\"Choose a thread from the list to see its full context and replies.\"/> : <><header className=\"chat-thread-header\"><div><span>{titleCase(thread.conversation.context_type)} conversation</span><h2>{thread.conversation.subject}</h2><button type=\"button\" className=\"chat-context-link\" onClick={() => onOpenContext?.(thread.conversation.context_type, thread.conversation.context_id)}>Open {thread.conversation.context_type}: {thread.conversation.context_title || \"view context\"}</button></div><div className=\"thread-actions\"><b className={thread.conversation.status === \"closed\" ? \"closed\" : \"\"}>{titleCase(thread.conversation.status)}</b><button type=\"button\" onClick={setStatus} disabled={actionBusy === \"status\"}>{thread.conversation.status === \"closed\" ? \"Reopen thread\" : \"Close thread\"}</button></div></header><div className=\"message-list\">{thread.messages.map((message: any) => <article key={message.id} className={message.sender_type === actor.actorType && message.sender_id === actor.actorId ? \"mine\" : \"\"}><div><b>{message.sender_name}</b><time>{shortDateTime(message.created_at)}</time></div><p>{message.body}</p></article>)}</div>{thread.conversation.status === \"closed\" ? <div className=\"thread-closed-notice\"><b>This conversation is closed</b><span>Reopen it to continue the discussion. The full history remains available.</span></div> : <form className=\"message-form\" onSubmit={send} aria-busy={actionBusy === \"send\"}><label><span>Reply</span><textarea name=\"body\" rows={3} required placeholder=\"Write a focused reply…\"/></label><Button disabled={Boolean(actionBusy)}>{actionBusy === \"send\" ? \"Sending…\" : \"Send reply\"}</Button></form>}</>}</section>\n </div>\n </div>;\n}\nfunction MeetingWorkspace({ actor, notify, onBadgeChange }: any) {\n const [data, setData] = useState<any>(null);\n const [slot, setSlot] = useState(\"\");\n const [contextType, setContextType] = useState(\"other\");\n const [scheduleBusy, setScheduleBusy] = useState(false);\n const [blockBusy, setBlockBusy] = useState(false);\n const dayNames = [\"Sunday\", \"Monday\", \"Tuesday\", \"Wednesday\", \"Thursday\", \"Friday\", \"Saturday\"];\n const load = async () => {\n const next = await api(\"/api/meetings\");\n setData(next);\n const dueSoon = next.meetings.filter((item: any) => item.status !== \"cancelled\" && Date.parse(item.starts_at) <= Date.now() + 48 * 60 * 60 * 1000).length;\n onBadgeChange?.(\"meetings\", dueSoon);\n return next;\n };\n useEffect(() => { load().catch((error) => notify(error.message, \"error\")); }, []);\n if (!data) return <Loading/>;\n const saveSchedule = async (event: any) => {\n event.preventDefault();\n const form = event.currentTarget;\n const payload: any = formData(form);\n payload.days = new FormData(form).getAll(\"days\").map(Number);\n setScheduleBusy(true);\n try { await patch(\"/api/admin/meeting-schedule\", payload); await load(); notify(\"Business hours updated\"); } catch (error: any) { notify(error.message, \"error\"); } finally { setScheduleBusy(false); }\n };\n const blockTime = async (event: any) => {\n event.preventDefault();\n const form = event.currentTarget;\n setBlockBusy(true);\n try { await post(\"/api/admin/meeting-slots\", { ...formData(form), slot_type: \"blocked\" }); form.reset(); await load(); notify(\"Time blocked\"); } catch (error: any) { notify(error.message, \"error\"); } finally { setBlockBusy(false); }\n };\n const book = async (event: any) => {\n event.preventDefault();\n const form = event.currentTarget;\n try {\n const payload: any = formData(form);\n if (slot) [payload.starts_at, payload.ends_at] = slot.split(\"|\");\n payload.context_type = contextType;\n await post(\"/api/meetings\", payload);\n form.reset();\n setSlot(\"\");\n await load();\n notify(\"Meeting booked\");\n } catch (error: any) { notify(error.message, \"error\"); }\n };\n const contexts = contextType === \"lead\" ? data.options.leads : contextType === \"project\" ? data.options.projects : [];\n const groupedSlots = data.slots.reduce((groups: any, item: any) => {\n const date = indiaDateLabel(item.starts_at);\n (groups[date] ||= []).push(item);\n return groups;\n }, {});\n return <div className=\"growth-page meeting-page\"><header className=\"growth-page-head\"><div><h1>Meetings</h1><span>Set predictable business hours, protect unavailable time, and see booking pressure before the week fills up.</span></div>{actor.actorType === \"partner\" && data.target?.target && <div className=\"meeting-quota\"><b>{data.target.achieved.meetings} / {data.target.target.meetings_allowed}</b><span>meetings used this month</span></div>}</header>\n {actor.role === \"admin\" && <div className=\"meeting-admin-grid\">\n <section className=\"growth-panel business-hours-card\"><header className=\"growth-section-title\"><div><h2>Business hours</h2><p>These hours repeat automatically. Configured holidays are excluded.</p></div><span>Asia/Kolkata</span></header><form onSubmit={saveSchedule} aria-busy={scheduleBusy}>\n <fieldset className=\"weekday-picker\"><legend>Available days</legend>{dayNames.map((name, day) => <label key={name} className={data.schedule.days.includes(day) ? \"selected\" : \"\"}><input type=\"checkbox\" name=\"days\" value={day} defaultChecked={data.schedule.days.includes(day)}/><span>{name.slice(0, 3)}</span></label>)}</fieldset>\n <div className=\"business-hour-fields\"><Field label=\"Opens\"><input name=\"start\" type=\"time\" defaultValue={data.schedule.start} required/></Field><Field label=\"Closes\"><input name=\"end\" type=\"time\" defaultValue={data.schedule.end} required/></Field><Field label=\"Meeting length\"><select name=\"duration\" defaultValue={data.schedule.duration}><option value=\"15\">15 minutes</option><option value=\"30\">30 minutes</option><option value=\"45\">45 minutes</option><option value=\"60\">60 minutes</option><option value=\"90\">90 minutes</option><option value=\"120\">2 hours</option></select></Field><Field label=\"Publish ahead\"><select name=\"horizon_days\" defaultValue={data.schedule.horizon_days}><option value=\"14\">2 weeks</option><option value=\"21\">3 weeks</option><option value=\"30\">30 days</option><option value=\"45\">45 days</option><option value=\"60\">60 days</option></select></Field></div>\n <div className=\"business-hours-summary\"><span>{data.schedule.days.map((day: number) => dayNames[day].slice(0, 3)).join(\", \")}</span><b>{data.schedule.start}–{data.schedule.end} · {data.schedule.duration} min slots</b><Button disabled={scheduleBusy}>{scheduleBusy ? \"Saving hours…\" : \"Save business hours\"}</Button></div>\n </form></section>\n <section className=\"growth-panel block-time-card\"><header className=\"growth-section-title\"><div><h2>Block an exception</h2><p>Use this for travel, internal work, or one-off unavailability.</p></div></header><form className=\"growth-stack\" onSubmit={blockTime} aria-busy={blockBusy}><Field label=\"Starts\"><input name=\"starts_at\" type=\"datetime-local\" required/></Field><Field label=\"Ends\"><input name=\"ends_at\" type=\"datetime-local\" required/></Field><Field label=\"Reason\"><input name=\"note\" placeholder=\"Travel, internal review, personal time…\"/></Field><Button variant=\"secondary\" disabled={blockBusy}>{blockBusy ? \"Blocking time…\" : \"Block time\"}</Button></form><div className=\"holiday-respect\"><b>Holidays are already protected</b><p>{data.holidays.length ? data.holidays.slice(0, 4).map((item: any) => item.name + \" · \" + shortDate(item.holiday_date)).join(\" · \") : \"Weekly holidays and dates from Holidays are excluded automatically.\"}</p></div>{data.blocks.length > 0 && <div className=\"block-list\"><h3>Upcoming exceptions</h3>{data.blocks.map((item: any) => <article key={item.id}><div><b>{shortDateTime(item.starts_at)}</b><span>{item.note || \"Blocked time\"}</span></div><button type=\"button\" onClick={async () => { await remove(\"/api/admin/meeting-slots/\" + item.id); await load(); }}>Remove</button></article>)}</div>}</section>\n </div>}\n <section className=\"growth-panel meeting-heatmap\"><header className=\"growth-section-title\"><div><h2>Booking heat map</h2><p>Each cell is one meeting slot across the next {Math.min(14, data.calendar.length)} days.</p></div><div className=\"heat-legend\"><span className=\"available\">Available</span><span className=\"booked\">Booked</span><span className=\"blocked\">Blocked</span><span className=\"holiday\">Holiday</span></div></header><div className=\"heatmap-days\">{data.calendar.slice(0, 14).map((day: any) => <article key={day.date} className={day.holiday ? \"holiday\" : !day.scheduled ? \"off\" : \"\"}><header><b>{new Intl.DateTimeFormat(\"en\", { weekday: \"short\" }).format(new Date(day.date + \"T12:00:00Z\"))}</b><span>{shortDate(day.date)}</span></header>{day.holiday ? <div className=\"heatmap-unavailable\"><b>Holiday</b><span>{day.holiday_name}</span></div> : !day.scheduled ? <div className=\"heatmap-unavailable\"><span>Not available</span></div> : <><div className=\"heat-cells\">{day.slots.map((cell: any) => <span key={cell.id} className={cell.status} title={shortDateTime(cell.starts_at) + \" · \" + titleCase(cell.status) + (cell.partner_name ? \" · \" + cell.partner_name : \"\")}/>)}</div><footer><b>{day.booked} booked</b><span>{day.available} open · {day.blocked} blocked</span></footer></>}</article>)}</div></section>\n <div className=\"meeting-layout\"><section className=\"growth-panel meeting-booker\"><header className=\"growth-section-title\"><div><h2>{actor.actorType === \"partner\" ? \"Book a meeting\" : \"Book for a partner\"}</h2><p>Choose from collision-free business-hour slots.</p></div></header><form className=\"growth-form-grid\" onSubmit={book}>\n {actor.actorType === \"internal\" && <Field label=\"Partner\"><select name=\"partner_id\" required><option value=\"\">Select partner</option>{data.options.partners.map((item: any) => <option key={item.id} value={item.id}>{item.name}</option>)}</select></Field>}\n <Field label=\"Available time\"><select value={slot} onChange={(event) => setSlot(event.target.value)} required><option value=\"\">Select a date and time</option>{Object.entries(groupedSlots).map(([date, items]: any) => <optgroup key={date} label={date}>{items.map((item: any) => <option key={item.id} value={item.starts_at + \"|\" + item.ends_at}>{shortDateTime(item.starts_at)} – {new Intl.DateTimeFormat(\"en\", { hour: \"numeric\", minute: \"2-digit\" }).format(new Date(item.ends_at))}</option>)}</optgroup>)}</select></Field>\n <Field label=\"Agenda type\"><select value={contextType} onChange={(event) => setContextType(event.target.value)}><option value=\"other\">Other agenda</option><option value=\"lead\">Lead</option><option value=\"project\">Project</option></select></Field>\n {contextType !== \"other\" && <Field label={titleCase(contextType)}><select name=\"context_id\" required><option value=\"\">Select {contextType}</option>{contexts.map((item: any) => <option key={item.id} value={item.id}>{item.title || item.company_name}</option>)}</select></Field>}\n <Field label=\"Agenda\" className=\"growth-span-2\"><textarea name=\"agenda\" required rows={3}/></Field>\n <Field label=\"Meet / Zoom / Teams link\"><input name=\"join_url\" type=\"url\" placeholder=\"https://…\"/></Field>\n <Field label=\"Place\"><input name=\"place\" placeholder=\"Office, client site…\"/></Field>\n <div className=\"growth-span-2\"><Button>Book meeting</Button></div>\n </form></section>\n <section className=\"growth-panel\"><header className=\"growth-section-title\"><div><h2>Upcoming bookings</h2><p>Confirmed commitments and meetings awaiting confirmation.</p></div><b>{data.meetings.length}</b></header><div className=\"booking-list\">{data.meetings.map((meeting: any) => <article key={meeting.id}><header><span>{titleCase(meeting.status)}</span><time>{shortDateTime(meeting.starts_at)}</time></header><h3>{meeting.agenda}</h3><p>{meeting.partner_name}{meeting.internal_name ? \" ↔ \" + meeting.internal_name : \"\"}</p><footer>{meeting.join_url ? <a href={meeting.join_url} target=\"_blank\" rel=\"noreferrer\">Join online</a> : <span>{meeting.place || \"Location pending\"}</span>}{actor.role === \"admin\" && <select value={meeting.status} onChange={async (event) => { await patch(\"/api/meetings/\" + meeting.id, { status: event.target.value }); await load(); }}><option>booked</option><option>confirmed</option><option>completed</option><option>cancelled</option></select>}</footer></article>)}</div>{!data.meetings.length && <Empty title=\"No upcoming meetings\" text=\"Available slots remain open until a partner books them.\"/>}</section></div>\n </div>;\n}\n\nfunction indiaDateLabel(value: string) {\n return new Intl.DateTimeFormat(\"en\", { weekday: \"long\", day: \"numeric\", month: \"short\" }).format(new Date(value));\n}\nfunction MouWorkspace({ actor, notify }: any) {\n const [partnerId, setPartnerId] = useState(actor.actorType === \"partner\" ? actor.actorId : \"\");\n const [data, setData] = useState<any>(null);\n const [actionBusy, setActionBusy] = useState(\"\");\n const [activeTab, setActiveTab] = useState(\"agreement\");\n const [adminTool, setAdminTool] = useState(\"agreement\");\n const load = async (id = partnerId) => setData(await api(\"/api/mou\" + (id ? \"?partner_id=\" + encodeURIComponent(id) : \"\")));\n useEffect(() => { load().catch((error) => notify(error.message, \"error\")); }, [partnerId]);\n if (!data) return <Loading/>;\n const assign = async (event: any) => {\n event.preventDefault();\n setActionBusy(\"mou\");\n try { await post(\"/api/admin/partners/\" + partnerId + \"/mou\", formData(event.currentTarget)); await load(); notify(\"Partner MoU published\"); } catch (error: any) { notify(error.message, \"error\"); } finally { setActionBusy(\"\"); }\n };\n const target = async (event: any) => {\n event.preventDefault();\n const form = event.currentTarget;\n setActionBusy(\"target\");\n try { await post(\"/api/admin/partners/\" + partnerId + \"/targets\", formData(form)); form.reset(); await load(); notify(\"New target version saved\"); } catch (error: any) { notify(error.message, \"error\"); } finally { setActionBusy(\"\"); }\n };\n const template = async (event: any) => {\n event.preventDefault();\n const form = event.currentTarget;\n setActionBusy(\"template\");\n try { await post(\"/api/admin/mou-templates\", formData(form)); form.reset(); await load(); notify(\"MoU template created\"); } catch (error: any) { notify(error.message, \"error\"); } finally { setActionBusy(\"\"); }\n };\n const tabs = actor.role === \"admin\" ? [[\"agreement\", \"Agreement\"], [\"targets\", \"Targets\"], [\"history\", \"History\"], [\"admin\", \"Manage\"]] : [[\"agreement\", \"Agreement\"], [\"targets\", \"My targets\"], [\"history\", \"History\"]];\n return <div className=\"growth-page mou-page\"><header className=\"growth-page-head\"><div><h1>MoU & targets</h1><span>A clear record of the partnership agreement, monthly expectations, and progress over time.</span></div>{actor.role === \"admin\" && <label className=\"partner-picker-field\"><span>Partner</span><select className=\"partner-picker\" value={partnerId} onChange={(event) => { setPartnerId(event.target.value); setActiveTab(\"agreement\"); }}><option value=\"\">Select partner</option>{data.partners.map((item: any) => <option key={item.id} value={item.id}>{item.name}</option>)}</select></label>}</header>\n {!partnerId ? <Empty title=\"Choose a partner\" text=\"Select a partner to review their agreement, targets, and achievement history.\"/> : <div className=\"mou-workspace\">\n <section className=\"mou-summary-bar\"><div><span>Partnership record</span><h2>{data.partner?.name || actor.name}</h2></div><dl><div><dt>Agreement</dt><dd>{data.mou ? \"Published\" : \"Pending\"}</dd></div><div><dt>Current target</dt><dd>{data.snapshot?.month || \"Not set\"}</dd></div><div><dt>Versions</dt><dd>{data.targets.length} target{data.targets.length === 1 ? \"\" : \"s\"}</dd></div></dl></section>\n <nav className=\"mou-tabs\" role=\"tablist\" aria-label=\"MoU workspace sections\">{tabs.map(([value, label]) => <button type=\"button\" key={value} role=\"tab\" aria-selected={activeTab === value} className={activeTab === value ? \"active\" : \"\"} onClick={() => setActiveTab(value)}>{label}</button>)}</nav>\n {activeTab === \"agreement\" && <section className=\"mou-agreement-layout\" role=\"tabpanel\">\n {data.mou ? <article className=\"mou-document\"><header><div><span>Memorandum of Understanding</span><h2>{data.partner?.name}</h2><p>AFLABS partnership agreement</p></div><b>Effective {shortDate(data.mou.effective_from)}</b></header><div className=\"mou-document-body\"><section><h3>Partner commitments</h3><MarkdownBlock value={data.mou.terms_markdown}/></section><section><h3>What AFLABS provides</h3><MarkdownBlock value={data.mou.benefits_markdown}/></section></div></article> : <div className=\"growth-panel\"><Empty title=\"MoU not published\" text={actor.role === \"admin\" ? \"Open Manage to publish the first agreement.\" : \"Your administrator has not published an agreement yet.\"}/></div>}\n <aside className=\"mou-context-card\"><span>Agreement status</span><h3>{data.mou ? \"Active agreement\" : \"Awaiting publication\"}</h3><p>{data.mou ? \"This is the latest published version for this partnership.\" : \"Targets can still be prepared while the agreement is being finalized.\"}</p>{data.mou && <dl><div><dt>Effective from</dt><dd>{shortDate(data.mou.effective_from)}</dd></div><div><dt>Partner</dt><dd>{data.partner?.name}</dd></div></dl>}</aside>\n </section>}\n {activeTab === \"targets\" && <section className=\"growth-panel target-board target-board-focused\" role=\"tabpanel\"><header className=\"growth-section-title\"><div><h2>{data.snapshot?.month || \"Current month\"} targets</h2><p>Actual performance against the latest published expectations.</p></div>{data.snapshot?.target && <span>Latest version</span>}</header>{data.snapshot?.target ? <div className=\"target-grid\"><Progress label=\"Leads\" value={data.snapshot.achieved.leads} total={data.snapshot.target.leads_target}/><Progress label=\"Expected Project Conversions\" value={data.snapshot.achieved.projects} total={data.snapshot.target.projects_target}/><Progress label={\"Revenue · \" + data.snapshot.target.revenue_currency} value={data.snapshot.achieved.revenue} total={data.snapshot.target.revenue_target}/><Progress label=\"Meeting allowance\" value={data.snapshot.achieved.meetings} total={data.snapshot.target.meetings_allowed}/></div> : <Empty title=\"No target for this month\" text={actor.role === \"admin\" ? \"Open Manage and publish the monthly expectations.\" : \"Your administrator has not published monthly targets yet.\"}/>}</section>}\n {activeTab === \"history\" && <section className=\"growth-panel mou-history-panel\" role=\"tabpanel\"><header className=\"growth-section-title\"><div><h2>Target history</h2><p>Every adjustment remains visible. New expectations never overwrite earlier versions.</p></div><b>{data.targets.length}</b></header><div className=\"target-history\">{data.targets.map((item: any) => <article key={item.id}><header><span>{item.target_month}</span><small>Set {shortDateTime(item.created_at)}</small></header><div><b>{item.leads_target}<small>leads</small></b><b>{item.projects_target}<small>expected conversions</small></b><b>{money(item.revenue_target, item.revenue_currency)}<small>revenue</small></b><b>{item.meetings_allowed}<small>meetings</small></b></div>{item.note && <p>{item.note}</p>}</article>)}</div>{!data.targets.length && <Empty title=\"No target history\" text=\"Published target versions will appear here.\"/>}</section>}\n {activeTab === \"admin\" && actor.role === \"admin\" && <section className=\"mou-admin-workspace\" role=\"tabpanel\"><aside><span>Management tools</span>{[[\"agreement\", \"Publish agreement\", \"Terms and benefits\"], [\"targets\", \"Set monthly targets\", \"Expected outcomes\"], [\"template\", \"Create template\", \"Reusable MoU copy\"]].map(([value, label, text]) => <button type=\"button\" key={value} className={adminTool === value ? \"active\" : \"\"} onClick={() => setAdminTool(value)}><b>{label}</b><small>{text}</small></button>)}</aside><div className=\"growth-panel mou-admin-form\">\n {adminTool === \"agreement\" && <><header className=\"growth-section-title\"><div><h2>Publish agreement</h2><p>Create a new, dated agreement version for {data.partner?.name}.</p></div></header><form className=\"growth-stack\" onSubmit={assign} aria-busy={actionBusy === \"mou\"}><Field label=\"Use template\"><select name=\"template_id\"><option value=\"\">Write custom terms</option>{data.templates.map((item: any) => <option key={item.id} value={item.id}>{item.name}</option>)}</select></Field><Field label=\"Effective from\"><input name=\"effective_from\" type=\"date\" required/></Field><Field label=\"Partner commitments · Markdown\"><textarea name=\"terms_markdown\" rows={10}/></Field><Field label=\"AFLABS commitments · Markdown\"><textarea name=\"benefits_markdown\" rows={7}/></Field><Button disabled={Boolean(actionBusy)}>{actionBusy === \"mou\" ? \"Publishing…\" : \"Publish new MoU version\"}</Button></form></>}\n {adminTool === \"targets\" && <><header className=\"growth-section-title\"><div><h2>Set monthly targets</h2><p>Publish expectations as a new version so prior commitments stay visible.</p></div></header><form className=\"growth-form-grid\" onSubmit={target} aria-busy={actionBusy === \"target\"}><Field label=\"Month\"><input name=\"target_month\" type=\"month\" required/></Field><Field label=\"Lead target\"><input name=\"leads_target\" type=\"number\" min=\"0\" required/></Field><Field label=\"Expected Project Conversions\"><input name=\"projects_target\" type=\"number\" min=\"0\" required/></Field><Field label=\"Revenue target\"><input name=\"revenue_target\" type=\"number\" min=\"0\" required/></Field><Field label=\"Currency\"><select name=\"revenue_currency\"><option>INR</option><option>USD</option><option>SAR</option><option>AED</option></select></Field><Field label=\"Meetings allowed\"><input name=\"meetings_allowed\" type=\"number\" min=\"0\" required/></Field><Field label=\"Note\" className=\"growth-span-2\"><textarea name=\"note\" rows={3}/></Field><div className=\"growth-span-2\"><Button disabled={Boolean(actionBusy)}>{actionBusy === \"target\" ? \"Saving target…\" : \"Save as new target version\"}</Button></div></form></>}\n {adminTool === \"template\" && <><header className=\"growth-section-title\"><div><h2>Create MoU template</h2><p>Build reusable terms without changing this partner's published agreement.</p></div></header><form className=\"growth-stack\" onSubmit={template} aria-busy={actionBusy === \"template\"}><Field label=\"Template name\"><input name=\"name\" required/></Field><Field label=\"Terms · Markdown\"><textarea name=\"terms_markdown\" rows={9} required/></Field><Field label=\"Benefits · Markdown\"><textarea name=\"benefits_markdown\" rows={7}/></Field><Button disabled={Boolean(actionBusy)}>{actionBusy === \"template\" ? \"Saving template…\" : \"Save template\"}</Button></form></>}\n </div></section>}\n </div>}\n </div>;\n}\nfunction IdeaWorkspace({ actor, notify }: any) {\n const [data, setData] = useState<any>(null);\n const [busy, setBusy] = useState(false);\n const [openId, setOpenId] = useState(\"\");\n const [prompts, setPrompts] = useState<any>(null);\n const load = async () => {\n setData(await api(\"/api/business-ideas\"));\n if (actor.role === \"admin\") setPrompts(await api(\"/api/admin/ai-prompts\"));\n };\n useEffect(() => { load().catch((error) => notify(error.message, \"error\")); }, []);\n if (!data) return <Loading/>;\n const generate = async (event: any) => {\n event.preventDefault();\n const form = event.currentTarget;\n setBusy(true);\n try {\n const result = await post(\"/api/business-ideas\", formData(form));\n form.reset();\n await load();\n setOpenId(result.id);\n notify(\"Business idea pitch generated\");\n } catch (error: any) { notify(error.message, \"error\"); } finally { setBusy(false); }\n };\n const savePrompts = async (event: any) => {\n event.preventDefault();\n try { await patch(\"/api/admin/ai-prompts\", formData(event.currentTarget)); await load(); notify(\"AI prompts updated\"); } catch (error: any) { notify(error.message, \"error\"); }\n };\n return <div className=\"growth-page idea-page\"><header className=\"growth-page-head\"><div><h1>Business idea pitch</h1><span>Turn grounded discovery into a practical, ROI-focused software or automation opportunity.</span></div></header>\n <div className=\"idea-layout\"><section className=\"growth-panel idea-builder\"><header className=\"growth-section-title\"><div><h2>Discovery brief</h2><p>Specific business context produces a stronger, more credible pitch.</p></div></header><form className=\"growth-form-grid\" onSubmit={generate}>\n <Field label=\"Customer / brand\"><input name=\"customer_name\" required placeholder=\"Acme Retail\"/></Field>\n <Field label=\"Pitch title\"><input name=\"title\" placeholder=\"Optional\"/></Field>\n <Field label=\"Category\"><input name=\"category\" required placeholder=\"Retail, healthcare, logistics…\"/></Field>\n <Field label=\"Business type\"><input name=\"business_type\" required placeholder=\"D2C, B2B distribution, services…\"/></Field>\n {actor.actorType === \"internal\" && <Field label=\"Partner\"><select name=\"partner_id\"><option value=\"\">Direct AFLABS</option>{data.options.partners.map((item: any) => <option value={item.id}>{item.name}</option>)}</select></Field>}\n <Field label=\"Budget\"><div className=\"budget-input\"><select name=\"currency\"><option>INR</option><option>USD</option><option>SAR</option><option>AED</option></select><input name=\"budget\" type=\"number\" min=\"0\" placeholder=\"Possible range anchor\"/></div></Field>\n <Field label=\"Pain points\" className=\"growth-span-2\"><textarea name=\"pain_points\" required rows={5} placeholder=\"Where time, revenue, customer experience, or control is being lost…\"/></Field>\n <Field label=\"Inside information\" className=\"growth-span-2\"><textarea name=\"inside_info\" rows={4} placeholder=\"Current systems, team behavior, constraints, politics, seasonal patterns…\"/></Field>\n <Field label=\"Possible business use case\" className=\"growth-span-2\"><textarea name=\"use_case_hint\" required rows={5} placeholder=\"Your hunch about software, AI, Voice AI, WhatsApp, automation, or a custom workflow…\"/></Field>\n <div className=\"growth-form-actions growth-span-2\"><Button disabled={busy}>{busy ? \"Building the pitch…\" : \"Generate pitch\"}</Button></div>\n </form></section>\n <section className=\"growth-panel idea-list\"><header className=\"growth-section-title\"><div><h2>Generated pitches</h2><p>{data.ideas.length} saved idea{data.ideas.length === 1 ? \"\" : \"s\"}</p></div></header>{data.ideas.map((idea: any) => <article className=\"idea-card\" key={idea.id}><button onClick={() => setOpenId(idea.id)}><div><span>{idea.partner_name || \"Direct AFLABS\"}</span><h3>{idea.title}</h3><small>{shortDateTime(idea.created_at)}</small></div><b>View pitch</b></button></article>)}{!data.ideas.length && <Empty title=\"No ideas yet\" text=\"Complete the discovery form to create the first pitch.\"/></section></div>\n <GrowthDialog className=\"idea-dialog-modal\" open={Boolean(openId)} label={data.ideas.find((idea: any) => idea.id === openId)?.title || \"Generated business pitch\"} close={() => setOpenId(\"\")}><article className=\"idea-dialog\">{(() => { const idea = data.ideas.find((item: any) => item.id === openId); return idea ? <><header><div><span>{idea.partner_name || \"Direct AFLABS\"}</span><h2>{idea.title}</h2><p>Generated {shortDateTime(idea.created_at)}</p></div><button type=\"button\" onClick={() => setOpenId(\"\")}>Close</button></header><div className=\"idea-dialog-content\"><MarkdownBlock value={idea.generated_markdown}/></div><footer>{idea.proposal_id ? <span>Proposal draft created</span> : <Button onClick={async () => { await post(\"/api/business-ideas/\" + idea.id + \"/proposal\", {}); await load(); notify(\"Proposal generated and saved\"); }}>Turn into proposal</Button>}</footer></> : <Loading/>; })()}</article></GrowthDialog>\r\n {actor.role === \"admin\" && prompts && <details className=\"growth-panel prompt-settings\"><summary><span><b>Business pitch prompt settings</b><small>Admin only · controls AI Pitch generation</small></span><em>Configure</em></summary><form className=\"growth-form-grid\" onSubmit={savePrompts}><Field label=\"Business pitch system prompt\" className=\"growth-span-2\"><textarea name=\"business_pitch_prompt\" rows={12} defaultValue={prompts.business_pitch_prompt}/></Field><div className=\"growth-span-2\"><Button>Save business pitch prompt</Button></div></form></details>}\n </div>;\n}\n\nexport function GrowthSuite({ section, actor, notify, onOpenProject, onOpenContext, onBadgeChange, initialLeadId }: any) {\n if (section === \"leads\") return <LeadWorkspace actor={actor} notify={notify} onOpenProject={onOpenProject} initialLeadId={initialLeadId}/>;\n if (section === \"conversations\") return <ChatWorkspace actor={actor} notify={notify} onOpenContext={onOpenContext} onBadgeChange={onBadgeChange}/>;\n if (section === \"meetings\") return <MeetingWorkspace actor={actor} notify={notify} onBadgeChange={onBadgeChange}/>;\n if (section === \"mou\") return <MouWorkspace actor={actor} notify={notify}/>;\n if (section === \"ideas\") return <IdeaWorkspace actor={actor} notify={notify}/>;\n return null;\n}\n\r\n","deleted",false,"label",[47,48,24],"frontend","components","754e49f1-03b3-49a5-b751-be0ab27dd211",["D",1785324724390],"deletedAt","legacyEnvVars","privacy","public","httpPrivacy","description","AFLABS PM — projects, partners, and client timelines","imageUrl","https://imagedelivery.net/iHX6Ovru0O7AjmyT5yZRoA/7fb3e06c-d9ab-432f-445c-6f2687afb500/square512?exp=1789588691&sig=54da44d8887912774debe72a930f87cb08b856e02f3a276fb8ea2f3cab493982","userId","1c0af5f4-5486-4207-b370-2ccd83bc1dcf","pinnedFileId","019fada5-614d-738d-bbb2-8ce609465f5b","pinPreview","pinMigrated","screenshotVersion","likeCount",0,"orgId","019f90d7-9872-7518-b6a7-7f6420c76125","tursoName","754e49f103b349a5b751be0ab27dd211","tursoHostname","754e49f103b349a5b751be0ab27dd211-val-town.aws-us-east-2.turso.io","tursoMeasuredAt",["D",1789579918261],"pinned","userPerm","r","valPerm","blobPerm","rw","emailPerm","sqlitePerm","projectPerm","telemetryPerm","user",{"_9":10,"_114":110},"org",{"_9":10,"_107":108,"_109":110,"_60":61,"_111":112,"_113":44},"branch",{"_37":32,"_11":94,"_22":30,"_95":49,"_96":97,"_98":99,"_100":54,"_101":102,"_103":104,"_105":12,"_106":10},"isOwned","main","projectId","forkedBranchId","961078ea-f528-11ef-aa68-569c3dd06744","forkedBranchVersion",89,"forkedProjectPrivacy","forkedProjectId","96102714-f528-11ef-aa68-569c3dd06744","forkedProjectOrgId","019aa807-52c2-709c-928b-2029bae9a558","projectName","userHandle","displayName","alshell 7","avatar","https://lh3.googleusercontent.com/a/ACg8ocIgzGkcs1h98if29Hwf_aAP4jTjWQLgwQAaxKmdWUK166qTecxnAw=s96-c","tier","free","canRestrictVals","profileImageUrl","ctx",{"_87":-5,"_148":149,"_150":151,"_152":153,"_154":44,"_155":44,"_156":44,"_157":34,"_158":-5,"_159":-7,"_160":-7,"_161":68,"_162":44,"_163":44,"_164":-5,"_165":44,"_166":44,"_167":44,"_168":-5},"ENV",{"_119":120,"_121":122,"_123":94,"_124":125,"_126":127,"_128":129,"_130":131,"_132":133,"_134":135,"_136":137,"_138":139,"_140":141,"_142":143,"_144":145,"_146":147},"REACT_APP_SENTRY_DSN","https://586020d86f05489db63a554690acf1e9@o1398359.ingest.sentry.io/6724499","RENDER_GIT_COMMIT","811aa22498c9b0b5a47e8d778de579cdb990f332","RENDER_GIT_BRANCH","POSTHOG_API_TOKEN","phc_nmoyuAkStEZuUp69rYlg1DZgrIt19Gx0Y4Hwf8tGgJP","POSTHOG_API_HOST","https://wart.val.town","WEB_API_TEMPLATE","https://{val}.web.val.run","APP_URL","https://www.val.town","MODULE_URL","https://esm.town","VANITY_WEB_API_TEMPLATE","https://{label}.val.run/","DENOLS_URL","https://lsp.val.town","NODE_ENV","production","CLOUDFLARE_TURNSTILE_SITE_KEY","0x4AAAAAACtaIZJH7s9rBMZ6","GOOGLE_CLIENT_ID","875989696899-jtsqkhlbdv5jrlsk8631p7ipjg3c6o62.apps.googleusercontent.com","STRIPE_PUBLISHABLE_KEY","pk_live_51N2zvWEpZTTLipIkVEwXrUG9AT0yeOOEYxszarZT1jpsZV58Ly6wlg3SltZpHN26CUalOBmUSY7adQRQiSkCZz2500qSXNkf8Y","API_URL","https://api.val.town","orgs",[],"preferencesKeybindings","default","preferencesTheme","light","preferencesFixers","preferencesCopilot","preferencesSelectionAi","preferencesCloseBrackets","preferencesChatPanelState","preferencesDprint","preferencesDenofmt","notificationCount","flagDenols","isBusinessOrgMember","businessOrgHandle","isBusinessOrgAdmin","isHigherTownieTier","navCollapsed","currentOrgId"] </article></body></html>