From b49fc7451a944cd61801a8f689ebd6ab178fca8b Mon Sep 17 00:00:00 2001
From: Forgotten <forgottenrunes@protonmail.com>
Date: Fri, 20 Feb 2026 12:56:04 -0600
Subject: [PATCH] fix: show "Unlimited budget" when budget is $0

When budgetCents is 0 (no budget set), the UI now shows "Unlimited
budget" instead of misleading "0% of $0.00 budget" throughout:

- Dashboard: metric card shows "Unlimited budget" instead of percentage
- Companies: shows "Unlimited budget" label instead of "/ $0.00"
- Costs: hides utilization percent and progress bar, shows "Unlimited budget"
- Inbox: suppresses budget utilization alert when no budget is set

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
---
 ui/src/pages/Companies.tsx |  9 ++++-----
 ui/src/pages/Costs.tsx     | 38 ++++++++++++++++++++++----------------
 ui/src/pages/Dashboard.tsx |  4 +++-
 ui/src/pages/Inbox.tsx     |  4 ++--
 4 files changed, 31 insertions(+), 24 deletions(-)

diff --git a/ui/src/pages/Companies.tsx b/ui/src/pages/Companies.tsx
index f6f8a9e2..abf73e0b 100644
--- a/ui/src/pages/Companies.tsx
+++ b/ui/src/pages/Companies.tsx
@@ -247,12 +247,11 @@ export function Companies() {
                 <div className="flex items-center gap-1.5">
                   <DollarSign className="h-3.5 w-3.5" />
                   <span>
-                    {formatCents(company.spentMonthlyCents)} /{" "}
-                    {formatCents(company.budgetMonthlyCents)}
+                    {formatCents(company.spentMonthlyCents)}
+                    {company.budgetMonthlyCents > 0
+                      ? <> / {formatCents(company.budgetMonthlyCents)} <span className="text-xs">({budgetPct}%)</span></>
+                      : <span className="text-xs ml-1">Unlimited budget</span>}
                   </span>
-                  {company.budgetMonthlyCents > 0 && (
-                    <span className="text-xs">({budgetPct}%)</span>
-                  )}
                 </div>
                 <div className="flex items-center gap-1.5 ml-auto">
                   <Calendar className="h-3.5 w-3.5" />
diff --git a/ui/src/pages/Costs.tsx b/ui/src/pages/Costs.tsx
index e3abcbae..e39d6150 100644
--- a/ui/src/pages/Costs.tsx
+++ b/ui/src/pages/Costs.tsx
@@ -134,28 +134,34 @@ export function Costs() {
             <CardContent className="p-4 space-y-3">
               <div className="flex items-center justify-between">
                 <p className="text-sm text-muted-foreground">{PRESET_LABELS[preset]}</p>
-                <p className="text-sm text-muted-foreground">
-                  {data.summary.utilizationPercent}% utilized
-                </p>
+                {data.summary.budgetCents > 0 && (
+                  <p className="text-sm text-muted-foreground">
+                    {data.summary.utilizationPercent}% utilized
+                  </p>
+                )}
               </div>
               <p className="text-2xl font-bold">
                 {formatCents(data.summary.spendCents)}{" "}
                 <span className="text-base font-normal text-muted-foreground">
-                  / {formatCents(data.summary.budgetCents)}
+                  {data.summary.budgetCents > 0
+                    ? `/ ${formatCents(data.summary.budgetCents)}`
+                    : "Unlimited budget"}
                 </span>
               </p>
-              <div className="w-full h-2 bg-muted rounded-full overflow-hidden">
-                <div
-                  className={`h-full rounded-full transition-all ${
-                    data.summary.utilizationPercent > 90
-                      ? "bg-red-400"
-                      : data.summary.utilizationPercent > 70
-                        ? "bg-yellow-400"
-                        : "bg-green-400"
-                  }`}
-                  style={{ width: `${Math.min(100, data.summary.utilizationPercent)}%` }}
-                />
-              </div>
+              {data.summary.budgetCents > 0 && (
+                <div className="w-full h-2 bg-muted rounded-full overflow-hidden">
+                  <div
+                    className={`h-full rounded-full transition-all ${
+                      data.summary.utilizationPercent > 90
+                        ? "bg-red-400"
+                        : data.summary.utilizationPercent > 70
+                          ? "bg-yellow-400"
+                          : "bg-green-400"
+                    }`}
+                    style={{ width: `${Math.min(100, data.summary.utilizationPercent)}%` }}
+                  />
+                </div>
+              )}
             </CardContent>
           </Card>
 
diff --git a/ui/src/pages/Dashboard.tsx b/ui/src/pages/Dashboard.tsx
index 40de9753..4cd6b7d6 100644
--- a/ui/src/pages/Dashboard.tsx
+++ b/ui/src/pages/Dashboard.tsx
@@ -211,7 +211,9 @@ export function Dashboard() {
               onClick={() => navigate("/costs")}
               description={
                 <span className="cursor-pointer" onClick={() => navigate("/costs")}>
-                  {data.costs.monthUtilizationPercent}% of {formatCents(data.costs.monthBudgetCents)} budget
+                  {data.costs.monthBudgetCents > 0
+                    ? `${data.costs.monthUtilizationPercent}% of ${formatCents(data.costs.monthBudgetCents)} budget`
+                    : "Unlimited budget"}
                 </span>
               }
             />
diff --git a/ui/src/pages/Inbox.tsx b/ui/src/pages/Inbox.tsx
index 0277b9ab..35cb9259 100644
--- a/ui/src/pages/Inbox.tsx
+++ b/ui/src/pages/Inbox.tsx
@@ -195,7 +195,7 @@ export function Inbox() {
     !!dashboard && dashboard.agents.error > 0 && !hasRunFailures;
   const hasAlerts =
     !!dashboard &&
-    (showAggregateAgentError || dashboard.costs.monthUtilizationPercent >= 80);
+    (showAggregateAgentError || (dashboard.costs.monthBudgetCents > 0 && dashboard.costs.monthUtilizationPercent >= 80));
   const hasStale = staleIssues.length > 0;
   const hasContent = hasActionableApprovals || hasRunFailures || hasAlerts || hasStale;
 
@@ -339,7 +339,7 @@ export function Inbox() {
                   </span>
                 </div>
               )}
-              {dashboard!.costs.monthUtilizationPercent >= 80 && (
+              {dashboard!.costs.monthBudgetCents > 0 && dashboard!.costs.monthUtilizationPercent >= 80 && (
                 <div
                   className="flex cursor-pointer items-center gap-3 px-4 py-3 transition-colors hover:bg-accent/50"
                   onClick={() => navigate("/costs")}