From e456fd2b0938d0957c2ae9aa605432b008d20e4b Mon Sep 17 00:00:00 2001
From: Vadym Samoilenko <vadymsamoilenko@oliver.agency>
Date: Wed, 6 May 2026 21:27:49 +0100
Subject: [PATCH] fix: chart bars visible + tool usage pct computed correctly

- Dashboard bar charts: increase opacity from /40 to /70 so bars are visible on light theme
- Tools endpoint: compute pct = count/total*100 instead of returning 0.0 default

Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>
---
 src/routers/dashboard.py        | 10 ++++++----
 web/src/views/DashboardView.vue |  4 ++--
 2 files changed, 8 insertions(+), 6 deletions(-)

diff --git a/src/routers/dashboard.py b/src/routers/dashboard.py
index db0b5eb..0068382 100644
--- a/src/routers/dashboard.py
+++ b/src/routers/dashboard.py
@@ -321,10 +321,12 @@ async def tools_usage(
     for (tools,) in result.all():
         for tool, cnt in (tools or {}).items():
             combined[tool] += cnt
-    return sorted(
-        [ToolUsage(tool=t, count=c) for t, c in combined.items()],
-        key=lambda x: -x.count,
-    )[:15]
+    total = sum(combined.values())
+    sorted_tools = sorted(combined.items(), key=lambda x: -x[1])[:15]
+    return [
+        ToolUsage(tool=t, count=c, pct=round(c / total * 100, 1) if total > 0 else 0.0)
+        for t, c in sorted_tools
+    ]
 
 
 @router.get("/activity", response_model=list[SessionOut])
diff --git a/web/src/views/DashboardView.vue b/web/src/views/DashboardView.vue
index 5352527..50aed09 100644
--- a/web/src/views/DashboardView.vue
+++ b/web/src/views/DashboardView.vue
@@ -199,7 +199,7 @@ const DOW_LABELS = ['Mo', 'Tu', 'We', 'Th', 'Fr', 'Sa', 'Su']
               :title="`${point.date}: ${formatDuration(point.hours)}`"
             >
               <div
-                class="w-full bg-primary/40 hover:bg-primary rounded-t transition-colors duration-150"
+                class="w-full bg-primary/70 hover:bg-primary rounded-t transition-colors duration-150"
                 :style="{ height: `${(point.hours / maxMonthlyHours) * 100}%`, minHeight: '2px' }"
               />
             </div>
@@ -235,7 +235,7 @@ const DOW_LABELS = ['Mo', 'Tu', 'We', 'Th', 'Fr', 'Sa', 'Su']
               class="flex-1 flex flex-col items-center gap-1"
             >
               <div
-                class="w-full bg-primary/40 hover:bg-primary rounded-t transition-colors duration-150"
+                class="w-full bg-primary/70 hover:bg-primary rounded-t transition-colors duration-150"
                 :style="{ height: `${Math.max((point.hours / maxDowHours) * 100, 2)}%` }"
                 :title="`${point.label}: ${formatDuration(point.hours)}`"
               />