\n \n \n \n",[],[158,198],"21edfe3c-547d-11f1-8572-ee650bb23af1","favicon.svg","019e46bb-f73a-762f-bb0e-901d3f516ac9",["D",1779303184101],"\n",[],[158,205],"2da747a6-547d-11f1-ac51-ee650bb23af1","Kanban.tsx","2da74a12-547d-11f1-ac51-ee650bb23af1","019e46bb-f73a-762f-bb0e-8d34aea2a6b3",4,["D",1779303203863],"/** @jsxImportSource https://esm.sh/react@18.2.0 */\nimport { useState } from \"https://esm.sh/react@18.2.0\";\nimport { DealCard } from \"./DealCard.tsx\";\n\ninterface Deal {\n id: number;\n name: string;\n company: string;\n status: string;\n amount: number;\n}\n\ninterface KanbanProps {\n deals: Deal[];\n onUpdateStatus: (dealId: number, newStatus: string) => void;\n}\n\nconst STAGES = [\n { id: \"lead\", label: \"Lead\", color: \"from-blue-500 to-blue-600\" },\n { id: \"qualified\", label: \"Qualified\", color: \"from-purple-500 to-purple-600\" },\n { id: \"proposal\", label: \"Proposal\", color: \"from-orange-500 to-orange-600\" },\n { id: \"negotiation\", label: \"Negotiation\", color: \"from-pink-500 to-pink-600\" },\n { id: \"won\", label: \"Won\", color: \"from-green-500 to-green-600\" },\n];\n\nexport function Kanban({ deals, onUpdateStatus }: KanbanProps) {\n const [draggedCard, setDraggedCard] = useState(null);\n\n const dealsByStatus = STAGES.reduce(\n (acc, stage) => ({\n ...acc,\n [stage.id]: deals.filter((d) => d.status === stage.id),\n }),\n {} as Record\n );\n\n const handleDragStart = (dealId: number) => {\n setDraggedCard(dealId);\n };\n\n const handleDrop = (status: string) => {\n if (draggedCard !== null) {\n onUpdateStatus(draggedCard, status);\n setDraggedCard(null);\n }\n };\n\n return (\n

\n {STAGES.map((stage) => (\n e.preventDefault()}\n onDrop={() => handleDrop(stage.id)}\n >\n

{stage.label}

\n \n {dealsByStatus[stage.id].length}\n \n

\n\n

\n {dealsByStatus[stage.id].length === 0 ? (\n

No deals

\n ) : (\n dealsByStatus[stage.id].map((deal) => (\n handleDragStart(deal.id)}\n class={`cursor-move transition-opacity ${\n draggedCard === deal.id ? \"opacity-50\" : \"\"\n }`}\n >\n \n

\n ))\n )}\n

\n\n

\n ${dealsByStatus[stage.id].reduce((sum, d) => sum + d.amount, 0).toLocaleString()}\n

\n ))}\n \n \n );\n}\n",[],[158,220,212],"components","2f2b42c6-547d-11f1-ac51-ee650bb23af1","DealCard.tsx","2f2b43b6-547d-11f1-ac51-ee650bb23af1",5,["D",1779303206409],"/** @jsxImportSource https://esm.sh/react@18.2.0 */\n\ninterface Deal {\n id: number;\n name: string;\n company: string;\n status: string;\n amount: number;\n}\n\nexport function DealCard({ deal }: { deal: Deal }) {\n return (\n

{deal.name}

{deal.company}

${deal.amount.toLocaleString()}

\n );\n}\n",[],[158,220,222],"29c1303e-547d-11f1-9a83-ee650bb23af1","App.tsx","019e46bb-f73a-762f-bb0e-8457ebbac640",3,["D",1779303197310],"/** @jsxImportSource https://esm.sh/react@18.2.0 */\nimport { useEffect, useState } from \"https://esm.sh/react@18.2.0\";\nimport { Kanban } from \"./Kanban.tsx\";\n\ninterface Deal {\n id: number;\n name: string;\n company: string;\n status: string;\n amount: number;\n}\n\nexport function App() {\n const [deals, setDeals] = useState([]);\n const [loading, setLoading] = useState(true);\n\n useEffect(() => {\n const fetchDeals = async () => {\n try {\n const res = await fetch(\"/api/deals\");\n const data = await res.json();\n setDeals(data);\n } catch (err) {\n console.error(\"Failed to fetch deals\", err);\n } finally {\n setLoading(false);\n }\n };\n\n fetchDeals();\n }, []);\n\n const updateDealStatus = async (dealId: number, newStatus: string) => {\n try {\n await fetch(`/api/deals/${dealId}/status`, {\n method: \"POST\",\n headers: { \"Content-Type\": \"application/json\" },\n body: JSON.stringify({ status: newStatus }),\n });\n setDeals(deals.map((d) => (d.id === dealId ? { ...d, status: newStatus } : d)));\n } catch (err) {\n console.error(\"Failed to update deal\", err);\n }\n };\n\n return (\n

Sales Pipeline

Drag deals across stages to update their status

\n\n {loading ? (\n

Loading deals...

\n ) : (\n \n )}\n\n

\n View source\n

\n );\n}\n",[],[158,220,230],"21edfcc0-547d-11f1-8572-ee650bb23af1",["D",1779303184101],[174,175,176],[158,220],["D",1779303184101],[173,177,178,179],[158],["D",1779303184101],["D",1789676511826],{"_11":12,"_95":91},{"_11":12,"_89":-5,"_90":91,"_47":48,"_92":93,"_94":40},{"_29":30,"_13":26,"_20":21,"_27":28,"_31":32,"_33":34,"_82":42,"_83":84,"_85":86,"_87":14,"_88":12},"ctx",{"_75":-5,"_119":282,"_283":284,"_285":286,"_287":40,"_288":40,"_289":40,"_290":52,"_291":-5,"_292":-7,"_293":-7,"_294":56,"_295":40,"_296":40,"_297":-5,"_298":40,"_299":40,"_300":40,"_301":-5},"ENV",{"_253":254,"_255":256,"_257":26,"_258":259,"_260":261,"_262":263,"_264":265,"_266":267,"_268":269,"_270":271,"_272":273,"_274":275,"_276":277,"_278":279,"_280":281},"REACT_APP_SENTRY_DSN","https://586020d86f05489db63a554690acf1e9@o1398359.ingest.sentry.io/6724499","RENDER_GIT_COMMIT","71c1b20804b3232a7e513be260cfffc1932a9e97","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",[],"preferencesKeybindings","default","preferencesTheme","light","preferencesFixers","preferencesCopilot","preferencesSelectionAi","preferencesCloseBrackets","preferencesChatPanelState","preferencesDprint","preferencesDenofmt","notificationCount","flagDenols","isBusinessOrgMember","businessOrgHandle","isBusinessOrgAdmin","isHigherTownieTier","navCollapsed","currentOrgId"]

Branches1

Branches
1