diff --git a/src/components/conversations/sidebar-conversation-card.tsx b/src/components/conversations/sidebar-conversation-card.tsx
index 0779223..be5de83 100644
--- a/src/components/conversations/sidebar-conversation-card.tsx
+++ b/src/components/conversations/sidebar-conversation-card.tsx
@@ -143,7 +143,7 @@ export const SidebarConversationCard = memo(function SidebarConversationCard({
"relative flex h-[1.9375rem] w-full items-center gap-[0.625rem] text-left outline-none",
"rounded-[0.375rem] text-sidebar-foreground",
"transition-colors duration-[120ms]",
- "pr-[0.5rem] pl-[1.875rem]",
+ "pr-[0.5rem] pl-7",
isSelected
? "bg-sidebar-primary/15"
: "hover:bg-[color-mix(in_oklab,var(--sidebar-accent),var(--sidebar-foreground)_2%)]"
@@ -152,7 +152,11 @@ export const SidebarConversationCard = memo(function SidebarConversationCard({
diff --git a/src/components/conversations/sidebar-conversation-list.tsx b/src/components/conversations/sidebar-conversation-list.tsx
index 2e24fa8..4c85da5 100644
--- a/src/components/conversations/sidebar-conversation-list.tsx
+++ b/src/components/conversations/sidebar-conversation-list.tsx
@@ -138,7 +138,7 @@ const FolderHeader = memo(function FolderHeader({
onClick={() => onToggle(folderId)}
className={cn(
"flex h-[1.9375rem] w-full items-center gap-[0.5rem] cursor-pointer outline-none",
- "rounded-[0.4375rem] px-[0.625rem]",
+ "rounded-[0.4375rem] px-2",
"text-sidebar-foreground hover:bg-[color-mix(in_oklab,var(--sidebar-accent),var(--sidebar-foreground)_2%)]",
"transition-[background-color,color] duration-150",
highlighted && "ring-2 ring-sidebar-primary ring-offset-1"
diff --git a/src/components/conversations/sidebar-status-icon.tsx b/src/components/conversations/sidebar-status-icon.tsx
index beb4b74..2e54fa1 100644
--- a/src/components/conversations/sidebar-status-icon.tsx
+++ b/src/components/conversations/sidebar-status-icon.tsx
@@ -9,44 +9,52 @@ interface SidebarStatusIconProps {
className?: string
}
+function IconFrame({
+ children,
+ colorClass,
+ className,
+}: {
+ children: React.ReactNode
+ colorClass: string
+ className?: string
+}) {
+ return (
+
+ {children}
+
+ )
+}
+
export function SidebarStatusIcon({
status,
className,
}: SidebarStatusIconProps) {
if (status === "running") {
return (
-
-
-
+
)
}
if (status === "failed") {
return (
-
-
+
)
}
if (status === "active") {
return (
-
-
+
+
-
+
)
}
return (
-
+
+
+
+
+
)
}
diff --git a/src/components/layout/sidebar.tsx b/src/components/layout/sidebar.tsx
index 578cceb..6bc1ed9 100644
--- a/src/components/layout/sidebar.tsx
+++ b/src/components/layout/sidebar.tsx
@@ -88,7 +88,7 @@ export function Sidebar() {
return (