From dce287a42d5b4bb965ee74707bf7b0b0709d61f1 Mon Sep 17 00:00:00 2001
From: Adam <2363879+adamdotdevin@users.noreply.github.com>
Date: Thu, 30 Oct 2025 10:33:45 -0500
Subject: wip: desktop work

---
 packages/desktop/src/components/message.tsx | 63 ++++++++++++++++-------------
 packages/desktop/src/pages/index.tsx        |  2 +-
 2 files changed, 35 insertions(+), 30 deletions(-)

(limited to 'packages/desktop/src')

diff --git a/packages/desktop/src/components/message.tsx b/packages/desktop/src/components/message.tsx
index 78be29d75..70d03591a 100644
--- a/packages/desktop/src/components/message.tsx
+++ b/packages/desktop/src/components/message.tsx
@@ -15,7 +15,7 @@ registerPartComponent("text", function TextPartDisplay(props) {
   const part = props.part as TextPart
   return (
     <Show when={part.text.trim()}>
-      <Markdown text={part.text.trim()} />
+      <Markdown text={part.text.trim()} class="mt-8" />
     </Show>
   )
 })
@@ -36,36 +36,41 @@ registerPartComponent("tool", function ToolPartDisplay(props) {
     const metadata = part.state.status === "pending" ? {} : (part.state.metadata ?? {})
     const input = part.state.status === "completed" ? part.state.input : {}
 
-    if (part.state.status === "error") {
-      const error = part.state.error.replace("Error: ", "")
-      const [title, ...rest] = error.split(": ")
-      return (
-        <Card variant="error">
-          <div class="flex items-center gap-2">
-            <Icon name="circle-ban-sign" size="small" class="text-icon-critical-active" />
-            <Switch>
-              <Match when={title}>
+    return (
+      <Switch>
+        <Match when={part.state.status === "error" && part.state.error}>
+          {(error) => {
+            const cleaned = error().replace("Error: ", "")
+            const [title, ...rest] = cleaned.split(": ")
+            return (
+              <Card variant="error">
                 <div class="flex items-center gap-2">
-                  <div class="text-12-medium text-[var(--ember-light-11)] capitalize">{title}</div>
-                  <span>{rest.join(": ")}</span>
+                  <Icon name="circle-ban-sign" size="small" class="text-icon-critical-active" />
+                  <Switch>
+                    <Match when={title}>
+                      <div class="flex items-center gap-2">
+                        <div class="text-12-medium text-[var(--ember-light-11)] capitalize">{title}</div>
+                        <span>{rest.join(": ")}</span>
+                      </div>
+                    </Match>
+                    <Match when={true}>{cleaned}</Match>
+                  </Switch>
                 </div>
-              </Match>
-              <Match when={true}>{error}</Match>
-            </Switch>
-          </div>
-        </Card>
-      )
-    }
-
-    return (
-      <Dynamic
-        component={render}
-        input={input}
-        tool={part.tool}
-        metadata={metadata}
-        output={part.state.status === "completed" ? part.state.output : undefined}
-        hideDetails={props.hideDetails}
-      />
+              </Card>
+            )
+          }}
+        </Match>
+        <Match when={true}>
+          <Dynamic
+            component={render}
+            input={input}
+            tool={part.tool}
+            metadata={metadata}
+            output={part.state.status === "completed" ? part.state.output : undefined}
+            hideDetails={props.hideDetails}
+          />
+        </Match>
+      </Switch>
     )
   })
 
diff --git a/packages/desktop/src/pages/index.tsx b/packages/desktop/src/pages/index.tsx
index 1ae39a6b3..0ff4423ad 100644
--- a/packages/desktop/src/pages/index.tsx
+++ b/packages/desktop/src/pages/index.tsx
@@ -832,7 +832,7 @@ export default function Page() {
                                                 </div>
                                               </Collapsible.Trigger>
                                               <Collapsible.Content>
-                                                <div class="w-full flex flex-col items-start self-stretch gap-8">
+                                                <div class="w-full flex flex-col items-start self-stretch gap-3">
                                                   <For each={assistantMessages()}>
                                                     {(assistantMessage) => {
                                                       const parts = createMemo(
-- 
cgit v1.2.3