Improve UI and add flamegraph availability tracking

pablogsal · pablogsal · commit 5a6392d3456f · 2025-06-25T16:40:17.000+01:00
- Add has_flamegraph field to track flamegraph availability in diff tables
- Show flamegraph button only when flamegraph data is actually available
- Display environment identifier in binary detail cards for better debugging
- Fix API base URL in docker-compose.dev.yml to include /api prefix
- Improve layout and styling of environment cards
diff --git a/backend/app/routers/benchmarks.py b/backend/app/routers/benchmarks.py
@@ -122,6 +122,7 @@ async def get_diff_table(
             "metric_key": metric_key,
             "curr_python_version_str": f"{selected_commit.python_major}.{selected_commit.python_minor}.{selected_commit.python_patch}",
             "curr_result_id": result.id,
+            "has_flamegraph": result.flamegraph_html is not None,
         }
 
         # Try to find previous commit's data for comparison
diff --git a/backend/app/schemas.py b/backend/app/schemas.py
@@ -140,6 +140,7 @@ class DiffTableRow(BaseModel):
     prev_python_version_str: Optional[str] = None
     curr_python_version_str: str
     curr_result_id: str
+    has_flamegraph: bool = False
 
 
 class PythonVersionFilterOption(BaseModel):
diff --git a/docker-compose.dev.yml b/docker-compose.dev.yml
@@ -42,7 +42,7 @@ services:
     image: node:20-alpine
     working_dir: /app
     environment:
-      NEXT_PUBLIC_API_BASE: http://localhost:8000
+      NEXT_PUBLIC_API_BASE: http://localhost:8000/api
     ports:
       - "9002:9002"
     depends_on:
diff --git a/frontend/src/app/binaries/[id]/page.tsx b/frontend/src/app/binaries/[id]/page.tsx
@@ -98,11 +98,16 @@ function EnvironmentCard({
               )}
             </div>
           </div>
-          <div className="flex items-center gap-2">
-            <Badge variant="secondary">
-              {environment.commit_count} commits
-            </Badge>
-            <Badge variant="outline">{environment.run_count} runs</Badge>
+          <div className="flex flex-col items-end gap-2">
+            <div className="text-xs text-muted-foreground font-mono">
+              Identifier: {environment.id}
+            </div>
+            <div className="flex items-center gap-2">
+              <Badge variant="secondary">
+                {environment.commit_count} commits
+              </Badge>
+              <Badge variant="outline">{environment.run_count} runs</Badge>
+            </div>
           </div>
         </div>
       </CardHeader>
diff --git a/frontend/src/app/diff/page.tsx b/frontend/src/app/diff/page.tsx
@@ -74,6 +74,7 @@ interface EnhancedDiffTableRow {
 
   // Result ID for flamegraph
   curr_result_id?: string;
+  has_flamegraph?: boolean;
 }
 import CommitTooltipContent from '@/components/diff/CommitTooltipContent';
 
@@ -348,6 +349,7 @@ function DiffTableContent() {
               curr_python_version_str: baseRow.curr_python_version_str,
               prev_python_version_str: baseRow.prev_python_version_str,
               curr_result_id: baseRow.curr_result_id,
+              has_flamegraph: baseRow.has_flamegraph,
 
               // High watermark data
               high_watermark_curr: hwRow?.curr_metric_value || 0,
@@ -1177,7 +1179,7 @@ function DiffTableContent() {
                           {row.total_allocated_curr.toLocaleString()}
                         </TableCell>
                         <TableCell className="text-center">
-                          {row.curr_result_id ? (
+                          {row.curr_result_id && row.has_flamegraph ? (
                             <Button
                               variant="outline"
                               size="sm"
diff --git a/frontend/src/lib/types.ts b/frontend/src/lib/types.ts
@@ -67,6 +67,7 @@ export type DiffTableRow = {
   prev_python_version_str?: string;
   curr_python_version_str: string;
   curr_result_id: string;
+  has_flamegraph?: boolean;
 };
 
 export type AuthToken = {

Original file line number	Diff line number	Diff line change
`@@ -122,6 +122,7 @@ async def get_diff_table(`
`122`	`122`	`"metric_key": metric_key,`
`123`	`123`	`"curr_python_version_str": f"{selected_commit.python_major}.{selected_commit.python_minor}.{selected_commit.python_patch}",`
`124`	`124`	`"curr_result_id": result.id,`
	`125`	`+ "has_flamegraph": result.flamegraph_html is not None,`
`125`	`126`	`}`
`126`	`127`
`127`	`128`	`# Try to find previous commit's data for comparison`