From 7a19541ae239d57caafe0ba4f675f61d58548097 Mon Sep 17 00:00:00 2001
From: Dax Raad <d@ironbay.co>
Date: Thu, 23 Oct 2025 19:28:58 -0400
Subject: [PATCH] tui: improve file path display in modified files list with
 proper truncation and line wrapping

Updated the session sidebar to intelligently truncate long file paths so they fit properly in the UI without breaking layout. File names stay visible while directory paths are shortened, and text now wraps character-by-character when needed to prevent overflow in narrow terminals.
---
 .../src/cli/cmd/tui/routes/session/index.tsx  | 14 ++-------
 .../cli/cmd/tui/routes/session/sidebar.tsx    | 31 ++++++++++++++-----
 2 files changed, 26 insertions(+), 19 deletions(-)

diff --git a/packages/opencode/src/cli/cmd/tui/routes/session/index.tsx b/packages/opencode/src/cli/cmd/tui/routes/session/index.tsx
index 876dfbd42..2fed81379 100644
--- a/packages/opencode/src/cli/cmd/tui/routes/session/index.tsx
+++ b/packages/opencode/src/cli/cmd/tui/routes/session/index.tsx
@@ -49,17 +49,9 @@ import { DialogTimeline } from "./dialog-timeline"
 import { Sidebar } from "./sidebar"
 import { LANGUAGE_EXTENSIONS } from "@/lsp/language"
 
-addDefaultParsers([
-  {
-    filetype: "json",
-    wasm: "https://github.com/tree-sitter/tree-sitter-json/releases/download/v0.24.8/tree-sitter-json.wasm",
-    queries: {
-      highlights: [
-        "https://raw.githubusercontent.com/nvim-treesitter/nvim-treesitter/refs/heads/master/queries/json/highlights.scm",
-      ],
-    },
-  },
-])
+import parsers from "../../../../../../parsers-config.json"
+
+addDefaultParsers(parsers.parsers)
 
 const context = createContext<{
   width: number
diff --git a/packages/opencode/src/cli/cmd/tui/routes/session/sidebar.tsx b/packages/opencode/src/cli/cmd/tui/routes/session/sidebar.tsx
index f7c00ecf4..50ce8d827 100644
--- a/packages/opencode/src/cli/cmd/tui/routes/session/sidebar.tsx
+++ b/packages/opencode/src/cli/cmd/tui/routes/session/sidebar.tsx
@@ -2,6 +2,7 @@ import { useSync } from "@tui/context/sync"
 import { createMemo, For, Show, Switch, Match } from "solid-js"
 import { Theme } from "../../context/theme"
 import { Locale } from "@/util/locale"
+import path from "path"
 import type { AssistantMessage } from "@opencode-ai/sdk"
 
 export function Sidebar(props: { sessionID: string }) {
@@ -117,15 +118,29 @@ export function Sidebar(props: { sessionID: string }) {
               <b>Modified Files</b>
             </text>
             <For each={session().summary?.diffs || []}>
-              {(item) => (
-                <box flexDirection="row" gap={1} justifyContent="space-between">
-                  <text fg={Theme.textMuted}>{Locale.truncateMiddle(item.file, 40)}</text>
-                  <box flexDirection="row" gap={1}>
-                    <text fg={Theme.diffAdded}>+{item.additions}</text>
-                    <text fg={Theme.diffRemoved}>-{item.deletions}</text>
+              {(item) => {
+                const file = createMemo(() => {
+                  const splits = item.file.split(path.sep).filter(Boolean)
+                  const last = splits.at(-1)!
+                  const rest = splits.slice(0, -1).join(path.sep)
+                  return Locale.truncateMiddle(rest, 30 - last.length) + "/" + last
+                })
+                return (
+                  <box flexDirection="row" gap={1} justifyContent="space-between">
+                    <text fg={Theme.textMuted} wrapMode="char">
+                      {file()}
+                    </text>
+                    <box flexDirection="row" gap={1} flexShrink={0}>
+                      <Show when={item.additions}>
+                        <text fg={Theme.diffAdded}>+{item.additions}</text>
+                      </Show>
+                      <Show when={item.deletions}>
+                        <text fg={Theme.diffRemoved}>-{item.deletions}</text>
+                      </Show>
+                    </box>
                   </box>
-                </box>
-              )}
+                )
+              }}
             </For>
           </box>
         </Show>