/* global React, Icon, UI, DATA */ const { useState: useMiscState } = React; // ============================ Connectors ============================ function Connectors({ navigate, toast }) { const { StatusBadge, Button } = UI; const D = DATA; const [connectModal, setConnectModal] = useMiscState(null); const connected = D.connectorCatalog.filter((c) => c.status === "connected" || c.status === "expired"); const available = D.connectorCatalog.filter((c) => c.status === "disconnected"); const Card = ({ c }) => (
{c.name}
{c.provider} · {c.type}

{c.desc}

{c.lastSync &&
Last sync {D.fmtAgo(c.lastSync)}
}
{c.status === "connected" && <>} {c.status === "expired" && } {c.status === "disconnected" && }
); return (
Google Drive authorization expired — 1 active workflow uploads to it.
Connected · {connected.length}
{connected.map((c) => )}
Available
{available.map((c) => )}
{connectModal && ( setConnectModal(null)} footer={<> setConnectModal(null)}>Cancel { setConnectModal(null); toast(`${connectModal.name} connected`, "success"); }}>Authorize {connectModal.name}}>
Requested scopes
{connectModal.scopes.map((s) =>
{s}
)}

Tokens are encrypted at rest, never shown after entry, and can be revoked anytime.

 )}
); } // ============================ Documents ============================ function Documents({ toast }) { const D = DATA; const [tab, setTab] = useMiscState("documents"); const items = tab === "documents" ? D.documents : D.artifacts; return (
toast("Upload dialog", "info")}>Upload} />
{items.map((f) => ( ))}
FileTypeProject{tab === "documents" ? "Source" : "From run"}{tab === "documents" ? "Pages" : "Size"}Created
{f.name}{f.count && {f.count}}
 {f.type}{f.project} {tab === "documents" ? f.source : {f.exec}} {tab === "documents" ? f.pages : f.size} {D.fmtAgo(f.created)}
); } function fIcon(t) { return ({ CSV: "file-spreadsheet", Excel: "file-spreadsheet", Word: "file-text", PDF: "file-text", Archive: "package", JSON: "file-json" })[t] || "file-text"; } // ============================ Templates ============================ function TemplatesList({ navigate }) { const D = DATA; return (
{D.templates.map((t) => (
navigate("template", { id: t.id })}>
{t.name}
{t.docType}
{t.project}
))}
); } function Mini({ label, v }) { return
{v}
{label}
; } // ============================ Team ============================ function Team({ toast }) { const { Avatar, StatusBadge, Button } = UI; const D = DATA; const [invite, setInvite] = useMiscState(false); return (
setInvite(true)}>Invite member} />
{D.team.map((u) => ( ))}
MemberRoleStatusLast active
{u.name}
{u.email}
 {u.role} {u.status === "active" ? : Invited} {u.lastActive ? D.fmtAgo(u.lastActive) : "—"}
{invite && ( setInvite(false)} footer={<> setInvite(false)}>Cancel { setInvite(false); toast("Invitation sent", "success"); }}>Send invitation}> )}
); } // ============================ Billing ============================ function Billing({ toast }) { const D = DATA, u = D.usage; const plans = [ { name: "Starter", price: "$0", feats: ["File upload input", "Basic processing", "Limited executions", "1 GB storage"] }, { name: "Professional", price: "$249", feats: ["Gmail & Drive connectors", "Marketplace workflows", "10,000 executions", "50 GB storage"], current: true }, { name: "Enterprise", price: "Custom", feats: ["SSO & SCIM", "Advanced permissions", "Audit retention", "Custom limits & support"] }, ]; return (
toast("Invoice downloaded", "success")}>Invoices} />
Usage this month
{u.plan} plan
{[["Documents processed", u.documents], ["Pages processed", u.pages], ["AI tokens", u.tokens], ["Storage", u.storage], ["Executions", u.executions]].map(([label, d]) => { const pct = d.used / d.limit; const fmt = (n) => d.unit ? n + d.unit : n.toLocaleString(); return
{label}{fmt(d.used)} / {fmt(d.limit)}
0.8 ? "var(--ef-warning)" : "var(--ef-ink-950)" }} />
; })}
Executions trend
{u.monthlyTrend.map((v, i) =>
)}
Last 12 months · 2,937 this month
Plans
{plans.map((p) => (
{p.name}
{p.current && Current}
{p.price}{p.price !== "Custom" && / month}
{p.feats.map((f) =>
{f}
)} toast("Plan change requested", "info")}>{p.current ? "Current plan" : p.name === "Enterprise" ? "Contact sales" : "Upgrade"}
))}
); } // ============================ Activity logs ============================ function ActivityLogs() { const D = DATA; const [type, setType] = useMiscState("all"); const types = ["all", "execution", "workflow", "connector", "team", "template", "artifact", "project"]; const icon = { execution: "activity", workflow: "git-branch", connector: "link", team: "users", template: "layers", artifact: "download", project: "folder" }; let list = D.audit.filter((a) => type === "all" || a.type === type); return (
{types.map((t) => )}
{list.map((a, i) => (
{a.action}
{a.actor} · {a.resource}
{D.fmtAgo(a.time)}
))}
); } // ============================ Settings ============================ function Settings({ toast }) { const D = DATA; const [tab, setTab] = useMiscState("general"); return (
{tab === "general" && (
toast("Settings saved", "success")}>Save changes
)} {tab === "security" && (
{[["Encryption at rest", "All documents, artifacts, and connector credentials are encrypted.", true, true], ["Encryption in transit", "TLS 1.2+ on all connections.", true, true], ["Workspace isolation", "Records and storage are partitioned per workspace.", true, true], ["Audit logging", "Security-sensitive actions are recorded.", true, false]].map(([t, s, on, locked]) => (
{t}
{s}
{locked ? Enforced : {}} />}
))}
Single sign-on (SAML / OIDC)
Available on the Enterprise plan.
Enterprise
)} {tab === "data" && (
Redaction enabled
toast("Export requested", "info")}>Export workspace data Delete workspace
)}
); } Object.assign(window, { Connectors, Documents, TemplatesList, Team, Billing, ActivityLogs, Settings });