Split workspace into electron and ui packages

2025-11-17 12:06:58 +00:00
parent aa77ca2931
commit 89bd32814f
137 changed files with 407 additions and 1371 deletions
--- a/packages/ui/src/components/message-part.tsx
+++ b/packages/ui/src/components/message-part.tsx
@@ -0,0 +1,105 @@
+import { Show, Match, Switch } from "solid-js"
+import ToolCall from "./tool-call"
+import { isItemExpanded, toggleItemExpanded } from "../stores/tool-call-state"
+import { Markdown } from "./markdown"
+import { useTheme } from "../lib/theme"
+import { useConfig } from "../stores/preferences"
+import { partHasRenderableText, SDKPart, TextPart, ClientPart } from "../types/message"
+
+type ToolCallPart = Extract<ClientPart, { type: "tool" }>
+
+interface MessagePartProps {
+  part: ClientPart
+  messageType?: "user" | "assistant"
+  instanceId: string
+  sessionId: string
+}
+export default function MessagePart(props: MessagePartProps) {
+  const { isDark } = useTheme()
+  const { preferences } = useConfig()
+  const partType = () => props.part?.type || ""
+  const reasoningId = () => `reasoning-${props.part?.id || ""}`
+  const isReasoningExpanded = () => isItemExpanded(reasoningId())
+  const isAssistantMessage = () => props.messageType === "assistant"
+  const textContainerClass = () => (isAssistantMessage() ? "message-text message-text-assistant" : "message-text")
+
+  const plainTextContent = () => {
+    const part = props.part
+
+    if ((part.type === "text" || part.type === "reasoning") && typeof part.text === "string") {
+      return part.text
+    }
+
+    return ""
+  }
+
+  const createTextPartForMarkdown = (): TextPart => {
+    const part = props.part
+    if ((part.type === "text" || part.type === "reasoning") && typeof part.text === "string") {
+      return {
+        id: part.id,
+        type: "text",
+        text: part.text,
+        synthetic: part.type === "text" ? part.synthetic : false,
+        version: (part as { version?: number }).version
+      }
+    }
+    return {
+      id: part.id,
+      type: "text", 
+      text: "",
+      synthetic: false
+    }
+  }
+
+  function handleReasoningClick(e: Event) {
+    e.preventDefault()
+    toggleItemExpanded(reasoningId())
+  }
+
+  return (
+    <Switch>
+      <Match when={partType() === "text"}>
+        <Show when={!(props.part.type === "text" && props.part.synthetic) && partHasRenderableText(props.part)}>
+          <div class={textContainerClass()}>
+            <Show
+              when={isAssistantMessage()}
+              fallback={<span>{plainTextContent()}</span>}
+            >
+              <Markdown part={createTextPartForMarkdown()} isDark={isDark()} size={isAssistantMessage() ? "tight" : "base"} />
+            </Show>
+          </div>
+        </Show>
+      </Match>
+
+      <Match when={partType() === "tool"}>
+        <ToolCall
+          toolCall={props.part as ToolCallPart}
+          toolCallId={props.part?.id}
+          instanceId={props.instanceId}
+          sessionId={props.sessionId}
+        />
+      </Match>
+
+
+
+      <Match when={partType() === "reasoning"}>
+        <Show when={preferences().showThinkingBlocks && partHasRenderableText(props.part)}>
+          <div class="message-reasoning">
+            <div class="reasoning-container">
+              <div class="reasoning-header" onClick={handleReasoningClick}>
+                <span class="reasoning-icon">{isReasoningExpanded() ? "▼" : "▶"}</span>
+                <span class="reasoning-label">Reasoning</span>
+              </div>
+              <Show when={isReasoningExpanded()}>
+                <div class={`${textContainerClass()} mt-2`}>
+                  <Markdown part={createTextPartForMarkdown()} isDark={isDark()} size={isAssistantMessage() ? "tight" : "base"} />
+                </div>
+              </Show>
+            </div>
+          </div>
+        </Show>
+      </Match>
+    </Switch>
+  )
+}