From a8220f8b394d57577ef8ffef426c3e8aab52b7e4 Mon Sep 17 00:00:00 2001
From: Oz <harryalbert364@gmail.com>
Date: Sun, 3 May 2026 14:44:55 +0000
Subject: [PATCH] Fix cloud status badge using themed background instead of
 white

The cloud overlay in the icon-with-status component was hardcoded to
ColorU::white(), making themed status icon colors (e.g. ansi_fg_green
for success) nearly invisible in dark mode.

Use badge_ring_background for the cloud fill instead, mirroring how the
non-cloud status badge uses the same surface color for its cutout ring.

Co-Authored-By: Oz <oz-agent@warp.dev>
---
 app/src/ui_components/icon_with_status.rs | 22 ++++++++++++----------
 1 file changed, 12 insertions(+), 10 deletions(-)

diff --git a/app/src/ui_components/icon_with_status.rs b/app/src/ui_components/icon_with_status.rs
index 0dc88f3f3..e25d8418c 100644
--- a/app/src/ui_components/icon_with_status.rs
+++ b/app/src/ui_components/icon_with_status.rs
@@ -125,13 +125,13 @@ pub(crate) enum IconWithStatusVariant {
 /// BR (more overhang) and negative values pull it inward toward the circle's center.
 ///
 /// When `is_ambient` is set on an agent variant, the status badge is replaced by a
-/// white cloud containing the status icon.
+/// cloud (filled with `status_container_background`) containing the status icon.
 pub(crate) fn render_icon_with_status(
     variant: IconWithStatusVariant,
     total_size: f32,
     overlay_extra_overhang_ratio: f32,
     theme: &WarpTheme,
-    badge_ring_background: WarpThemeFill,
+    status_container_background: WarpThemeFill,
 ) -> Box<dyn Element> {
     let sub_text = theme.sub_text_color(theme.background());
 
@@ -174,7 +174,7 @@ pub(crate) fn render_icon_with_status(
                 total_size,
                 overlay_extra_overhang_ratio,
                 theme,
-                badge_ring_background,
+                status_container_background,
             )
         }
         IconWithStatusVariant::CLIAgent {
@@ -201,7 +201,7 @@ pub(crate) fn render_icon_with_status(
                 total_size,
                 overlay_extra_overhang_ratio,
                 theme,
-                badge_ring_background,
+                status_container_background,
             )
         }
     }
@@ -263,7 +263,7 @@ fn attach_status_overlay(
     total_size: f32,
     overlay_extra_overhang_ratio: f32,
     theme: &WarpTheme,
-    badge_ring_background: WarpThemeFill,
+    status_container_background: WarpThemeFill,
 ) -> Box<dyn Element> {
     if is_ambient {
         render_with_cloud_status_badge(
@@ -272,6 +272,7 @@ fn attach_status_overlay(
             total_size,
             overlay_extra_overhang_ratio,
             theme,
+            status_container_background,
         )
     } else {
         render_with_optional_status_badge(
@@ -280,12 +281,12 @@ fn attach_status_overlay(
             total_size,
             overlay_extra_overhang_ratio,
             theme,
-            badge_ring_background,
+            status_container_background,
         )
     }
 }
 
-/// Overlays a white cloud (with the conversation status icon centered inside, if any) at
+/// Overlays a cloud (with the conversation status icon centered inside, if any) at
 /// the bottom-right of the base circle. Used for agents running in ambient/cloud mode.
 fn render_with_cloud_status_badge(
     circle: Box<dyn Element>,
@@ -293,11 +294,12 @@ fn render_with_cloud_status_badge(
     total_size: f32,
     overlay_extra_overhang_ratio: f32,
     theme: &WarpTheme,
+    status_container_background: WarpThemeFill,
 ) -> Box<dyn Element> {
     let cloud_diameter = cloud_icon_size(total_size);
     let cloud = ConstrainedBox::new(
         WarpIcon::CloudFilled
-            .to_warpui_icon(WarpThemeFill::Solid(ColorU::white()))
+            .to_warpui_icon(status_container_background)
             .finish(),
     )
     .with_width(cloud_diameter)
@@ -361,7 +363,7 @@ fn render_with_optional_status_badge(
     total_size: f32,
     overlay_extra_overhang_ratio: f32,
     theme: &WarpTheme,
-    badge_ring_background: WarpThemeFill,
+    status_container_background: WarpThemeFill,
 ) -> Box<dyn Element> {
     let Some(status) = status else {
         // No status badge: still occupy the full `total_size` footprint so the agent
@@ -386,7 +388,7 @@ fn render_with_optional_status_badge(
     // Cutout ring that visually separates the badge from the circle.
     let badge_with_ring = Container::new(badge)
         .with_uniform_padding(pad)
-        .with_background(badge_ring_background)
+        .with_background(status_container_background)
         .with_corner_radius(CornerRadius::with_all(Radius::Percentage(50.)))
         .finish();