{label}

{value}

\n );\n}\n\nfunction urgencyBadge(inv) {\n if (['paid','cancelled','void'].includes(inv.status)) return 'bg-emerald-900 text-emerald-400';\n if (inv.daysOver >= 30) return 'bg-red-900 text-red-400';\n if (inv.daysOver >= 14) return 'bg-orange-900 text-orange-400';\n if (inv.daysOver >= 7) return 'bg-yellow-900 text-yellow-400';\n return 'bg-zinc-800 text-zinc-400';\n}\n\nfunction App() {\n const [invoices, setInvoices] = useState([]);\n const [loading, setLoading] = useState(true);\n const [error, setError] = useState('');\n const [filter, setFilter] = useState('all');\n\n const load = () => {\n setLoading(true);\n setError('');\n execution.runNodesAndGetOutput(\n ['conditional_jj8l'],\n ['serverless-function_fcsm']\n ).all()\n .then(res => {\n const raw = res['serverless-function_fcsm'];\n const rows = Array.isArray(raw) ? raw : (raw && Array.isArray(raw.result) ? raw.result : []);\n const now = Date.now();\n setInvoices(rows.filter(r => r.clientEmail).map(r => ({\n number: r.invoiceNumber || '',\n client: r.clientName || '',\n email: r.clientEmail || '',\n amount: r.amount || 0,\n dueDate: r.dueDate || '',\n status: String(r.status || '').toLowerCase().trim(),\n lastFU: r.lastFollowUp || '',\n fuCount: r.followUpCount || 0,\n daysOver: r.dueDate ? Math.floor((now - new Date(r.dueDate)) / 86400000) : 0\n })));\n setLoading(false);\n })\n .catch(e => { setError(e.message || 'Failed to load invoices'); setLoading(false); });\n };\n\n useEffect(() => { load(); }, []);\n\n const all = invoices;\n const overdue = all.filter(i => i.daysOver > 0 && !['paid','cancelled','void'].includes(i.status));\n const urgent = overdue.filter(i => i.daysOver >= 30);\n const paid = all.filter(i => ['paid','cancelled','void'].includes(i.status));\n const totalAmt = overdue.reduce((s, i) => s + i.amount, 0);\n\n const visible = filter === 'overdue' ? overdue\n : filter === 'urgent' ? urgent\n : filter === 'paid' ? paid\n : all;\n\n return (\n

Invoice Collection

AI-powered follow-up · runs weekdays 9am UTC

\n \n

\n \n \n \n \n

\n {[['all','All'],['overdue','Overdue'],['urgent','Urgent'],['paid','Paid / Closed']].map(([key,lbl]) => (\n \n ))}\n

\n {error &&

{error}

}\n {loading && !error &&

Loading invoices…

}\n {!loading && !error && (\n \n \n \n {['Invoice #','Client','Amount','Due Date','Days Overdue','Status','Follow-ups','Last Contact'].map(h => (\n \n ))}\n \n \n \n {[...visible].sort((a,b) => b.daysOver - a.daysOver).map((inv, i) => (\n \n \n \n \n \n \n \n \n \n \n ))}\n {visible.length === 0 && (\n \n )}\n \n

{h}
{inv.number \|\| '—'}	\n {inv.client} \n {inv.email} \n	${inv.amount.toFixed(2)}	{inv.dueDate \|\| '—'}	\n {['paid','cancelled','void'].includes(inv.status)\n ? —\n : = 30 ? 'text-red-400' : inv.daysOver >= 14 ? 'text-orange-400' : 'text-yellow-400'}>{inv.daysOver}d}\n	\n {inv.status \|\| 'pending'}\n	{inv.fuCount} sent	{inv.lastFU \|\| '—'}
\n {filter === 'all' ? 'No invoices found. Check that setup is complete and your source credentials are saved.' : 'No invoices in this category.'}\n

{h}

{inv.number || '—'}

{inv.client}

{inv.email}

${inv.amount.toFixed(2)}

{inv.dueDate || '—'}

\n {['paid','cancelled','void'].includes(inv.status)\n ? —\n : = 30 ? 'text-red-400' : inv.daysOver >= 14 ? 'text-orange-400' : 'text-yellow-400'}>{inv.daysOver}d}\n

\n {inv.status || 'pending'}\n

{inv.fuCount} sent

{inv.lastFU || '—'}

\n {filter === 'all' ? 'No invoices found. Check that setup is complete and your source credentials are saved.' : 'No invoices in this category.'}\n

\n )}\n

\n );\n}\n\nReactDOM.createRoot(document.getElementById('root')).render();",1028,{"_155":653,"_157":654},-243.0648565820822,1853.2116888033497,"interface",{"_657":658,"_670":671},"layout",[659],{"_660":661,"_662":642,"_663":664,"_155":665,"_157":665,"_666":667,"_668":669},"h",4,"i","w",6,0,"minH",2,"minW",3,"tabOrder",[],"variables",{"_313":674,"_412":675,"_340":676,"_219":674,"_288":676,"_334":401,"_319":677,"_310":678,"_239":677,"_202":678,"_331":401,"_337":401,"_679":680,"_322":401,"_343":681,"_293":681,"_682":683,"_328":401,"_316":684,"_410":685,"_234":684,"_686":221,"_325":401,"_687":688},"644f242e-ef59-4dff-a9aa-56df3c8951dc","Sheet1","29ead309-1bc8-4b8c-be24-7c84791423be","ACMEA","60029323-3050-428c-ba24-58c6381b6b32","days_overdue","{{trigger.invoice_due_date}} ? (new Date() - new Date({{trigger.invoice_due_date}})) / (1000*60*60*24) : 0","#test","urgency_level","{{days_overdue}} > 30 ? \"high\" : ({{days_overdue}} > 14 ? \"medium\" : \"low\")","3","1hNYJxeF7QIwv1NI6DaziPeEvv_vQFRL2d4806JWML9U","setup_completed","prepared_invoice_data","{ \"invoice_id\": \"{{trigger.invoice_id}}\", \"amount\": \"{{trigger.amount}}\", \"days_overdue\": {{days_overdue}}, \"urgency\": \"{{urgency_level}}\" }","display_metadata",{"_691":692,"_697":698,"_699":700,"_705":55},"viewport",{"_155":693,"_157":694,"_695":696},1087.680087644583,286.29046111643794,"zoom",0.27412663070828364,"activeTab","canvas","flowHelperView",{"_151":701,"_697":145,"_702":221,"_703":401,"_704":7},529,"isExpanded","searchQuery","isFullScreen","selectedNodeId","owner_name","Sanskar Pandey","template_slug","smart-invoice-collection-system","isEmbed","autoFork","initialView","actionData","errors"]