fix(app): patch tool renders like edit tool

packages/ui/src/components/message-part.tsx

@@ -1603,6 +1603,12 @@ ToolRegistry.register({
     const i18n = useI18n()
     const diffComponent = useDiffComponent()
     const files = createMemo(() => (props.metadata.files ?? []) as ApplyPatchFile[])
+    const pending = createMemo(() => props.status === "pending" || props.status === "running")
+    const single = createMemo(() => {
+      const list = files()
+      if (list.length !== 1) return
+      return list[0]
+    })
     const [expanded, setExpanded] = createSignal<string[]>([])
     let seeded = false
 
@@ -1621,6 +1627,9 @@ ToolRegistry.register({
     })
 
     return (
+      <Show
+        when={single()}
+        fallback={
           <div data-component="apply-patch-tool">
             <BasicTool
               {...props}
@@ -1715,6 +1724,50 @@ ToolRegistry.register({
               </Show>
             </BasicTool>
           </div>
+        }
+      >
+        {(file) => (
+          <BasicTool
+            {...props}
+            icon="code-lines"
+            defer
+            trigger={
+              <div data-component="edit-trigger">
+                <div data-slot="message-part-title-area">
+                  <div data-slot="message-part-title">
+                    <span data-slot="message-part-title-text">
+                      <Show when={pending()} fallback={i18n.t("ui.tool.patch")}>
+                        <TextShimmer text={i18n.t("ui.tool.patch")} />
+                      </Show>
+                    </span>
+                    <Show when={!pending()}>
+                      <span data-slot="message-part-title-filename">{getFilename(file().relativePath)}</span>
+                    </Show>
+                  </div>
+                  <Show when={!pending() && file().relativePath.includes("/")}>
+                    <div data-slot="message-part-path">
+                      <span data-slot="message-part-directory">{getDirectory(file().relativePath)}</span>
+                    </div>
+                  </Show>
+                </div>
+                <div data-slot="message-part-actions">
+                  <Show when={!pending()}>
+                    <DiffChanges changes={{ additions: file().additions, deletions: file().deletions }} />
+                  </Show>
+                </div>
+              </div>
+            }
+          >
+            <div data-component="edit-content">
+              <Dynamic
+                component={diffComponent}
+                before={{ name: file().filePath, contents: file().before }}
+                after={{ name: file().movePath ?? file().filePath, contents: file().after }}
+              />
+            </div>
+          </BasicTool>
+        )}
+      </Show>
     )
   },
 })