Show project icons in status-grouped sidebar rows (#2416)

* feat: show project icons in sidebar status view

* test(sidebar): keep status icon regression active

The ten-second mock can finish during app startup, removing the Working bucket before the icon assertion. Keep the seeded workspace active for the full scenario.

---------

Co-authored-by: Mohamed Boudra <boudra.moha@gmail.com>

packages/app/src/components/sidebar/sidebar-workspace-row-content.tsx

@@ -13,6 +13,7 @@ import {
   Monitor,
   SquareTerminal,
 } from "lucide-react-native";
+import { SidebarSubtitleProjectIcon } from "@/components/sidebar/sidebar-subtitle-project-icon";
 import { WorkspaceHoverCard } from "@/components/workspace-hover-card";
 import { SyncedLoader } from "@/components/synced-loader";
 import type { SidebarWorkspaceEntry } from "@/hooks/use-sidebar-workspaces-list";
@@ -93,6 +94,8 @@ export function SidebarWorkspaceRowFrame({
 export const SidebarWorkspaceRowContent = memo(function SidebarWorkspaceRowContent({
   workspace,
   subtitle,
+  subtitleProjectName = null,
+  subtitleProjectIconDataUri = null,
   scriptIconKind = null,
   isHovered,
   isLoading,
@@ -104,6 +107,9 @@ export const SidebarWorkspaceRowContent = memo(function SidebarWorkspaceRowConte
 }: {
   workspace: SidebarWorkspaceEntry;
   subtitle?: string | null;
+  /** Project named by the subtitle. Set it to lead the subtitle line with that project's icon. */
+  subtitleProjectName?: string | null;
+  subtitleProjectIconDataUri?: string | null;
   scriptIconKind?: SidebarWorkspaceScriptIconKind | null;
   isHovered: boolean;
   isLoading: boolean;
@@ -148,9 +154,19 @@ export const SidebarWorkspaceRowContent = memo(function SidebarWorkspaceRowConte
             <View style={sidebarWorkspaceRowStyles.rowRight}>{children}</View>
           </View>
           {subtitle ? (
-            <Text style={styles.workspaceSubtitle} numberOfLines={1}>
-              {subtitle}
-            </Text>
+            <View style={styles.workspaceSubtitleRow}>
+              {subtitleProjectName ? (
+                <SidebarSubtitleProjectIcon
+                  projectKey={workspace.projectKey}
+                  projectName={subtitleProjectName}
+                  iconDataUri={subtitleProjectIconDataUri}
+                  testID={`sidebar-row-project-icon-${workspace.workspaceKey}`}
+                />
+              ) : null}
+              <Text style={styles.workspaceSubtitle} numberOfLines={1}>
+                {subtitle}
+              </Text>
+            </View>
           ) : null}
           {workspace.prHint ? (
             <View style={styles.workspacePrBadgeRow}>
@@ -567,10 +583,18 @@ const styles = StyleSheet.create((theme) => ({
   workspaceBranchTextHovered: {
     opacity: 1,
   },
+  workspaceSubtitleRow: {
+    flexDirection: "row",
+    alignItems: "center",
+    gap: theme.spacing[1],
+    minWidth: 0,
+  },
   workspaceSubtitle: {
     color: theme.colors.foregroundMuted,
     fontSize: theme.fontSize.xs,
     lineHeight: 14,
+    flexShrink: 1,
+    minWidth: 0,
   },
   workspacePrBadgeRow: {
     flexDirection: "row",