From 020179c19a0073d130c30083c7623cf1196688e7 Mon Sep 17 00:00:00 2001
From: Utkarsh Patil <73941998+UtkarshUsername@users.noreply.github.com>
Date: Wed, 22 Jul 2026 19:50:20 +0530
Subject: [PATCH] fix(web): use message-square icon for settled icon-less
 project threads in sidebar v2 (#4279)

---
 apps/web/src/components/ProjectFavicon.tsx | 30 ++++++++++++++++++----
 apps/web/src/components/SidebarV2.tsx      |  2 ++
 2 files changed, 27 insertions(+), 5 deletions(-)

diff --git a/apps/web/src/components/ProjectFavicon.tsx b/apps/web/src/components/ProjectFavicon.tsx
index f7603a36e9a670ff007b94aebc69e143144489c2..bc3e8ee832ff14b3e4ffc35a9bfef83224caee32 100644
--- a/apps/web/src/components/ProjectFavicon.tsx
+++ b/apps/web/src/components/ProjectFavicon.tsx
@@ -1,6 +1,7 @@
 import type { EnvironmentId } from "@t3tools/contracts";
 import { isProjectFaviconFallbackUrl } from "@t3tools/shared/projectFavicon";
 import { FolderIcon } from "lucide-react";
+import type { ComponentType } from "react";
 import { useState } from "react";
 import { useAssetUrl } from "../assets/assetUrls";
 
@@ -10,29 +11,46 @@ export function ProjectFavicon(input: {
   environmentId: EnvironmentId;
   cwd: string;
   className?: string | undefined;
+  fallbackIcon?: ComponentType<{ className?: string }>;
 }) {
   const src = useAssetUrl(input.environmentId, {
     _tag: "project-favicon",
     cwd: input.cwd,
   });
+  const FallbackIcon = input.fallbackIcon ?? FolderIcon;
 
   if (!src || isProjectFaviconFallbackUrl(src)) {
-    return <ProjectFaviconFallback className={input.className} />;
+    return <ProjectFaviconFallback className={input.className} icon={FallbackIcon} />;
   }
 
-  return <ProjectFaviconImage key={src} src={src} className={input.className} />;
+  return (
+    <ProjectFaviconImage
+      key={src}
+      src={src}
+      className={input.className}
+      fallbackIcon={FallbackIcon}
+    />
+  );
 }
 
-function ProjectFaviconFallback({ className }: { readonly className?: string | undefined }) {
-  return <FolderIcon className={`size-3.5 shrink-0 text-muted-foreground/50 ${className ?? ""}`} />;
+function ProjectFaviconFallback({
+  className,
+  icon: Icon,
+}: {
+  readonly className?: string | undefined;
+  readonly icon: ComponentType<{ className?: string }>;
+}) {
+  return <Icon className={`size-3.5 shrink-0 text-muted-foreground/50 ${className ?? ""}`} />;
 }
 
 function ProjectFaviconImage({
   src,
   className,
+  fallbackIcon: FallbackIcon,
 }: {
   readonly src: string;
   readonly className?: string | undefined;
+  readonly fallbackIcon: ComponentType<{ className?: string }>;
 }) {
   const [status, setStatus] = useState<"loading" | "loaded" | "error">(() =>
     loadedProjectFaviconSrcs.has(src) ? "loaded" : "loading",
@@ -40,7 +58,9 @@ function ProjectFaviconImage({
 
   return (
     <>
-      {status !== "loaded" ? <ProjectFaviconFallback className={className} /> : null}
+      {status !== "loaded" ? (
+        <ProjectFaviconFallback className={className} icon={FallbackIcon} />
+      ) : null}
       <img
         src={src}
         alt=""
diff --git a/apps/web/src/components/SidebarV2.tsx b/apps/web/src/components/SidebarV2.tsx
index a62e09a3b8e8286684b40bb1fb1db994d0bf59f3..f3f03dc8b61e981c0230ccdeafa9206231df0bf3 100644
--- a/apps/web/src/components/SidebarV2.tsx
+++ b/apps/web/src/components/SidebarV2.tsx
@@ -14,6 +14,7 @@ import {
   CircleDashedIcon,
   CloudIcon,
   FolderPlusIcon,
+  MessageSquareIcon,
   PlusIcon,
   SearchIcon,
   SquarePenIcon,
@@ -426,6 +427,7 @@ const SidebarV2Row = memo(function SidebarV2Row(props: {
               environmentId={thread.environmentId}
               cwd={props.projectCwd ?? ""}
               className="size-3.5"
+              fallbackIcon={MessageSquareIcon}
             />
           </span>
           {title}
-- 
2.54.0