From 49be259232381f7590c356ea20cb0c856ef6a40b Mon Sep 17 00:00:00 2001
From: l0ng-ai <24760907+l0ng-ai@users.noreply.github.com>
Date: Sat, 24 Oct 2026 09:11:58 +0800
Subject: [PATCH] fix(ui): Show the full SDK name in selects and shorten
 Windows home paths
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

A long detail (an installation path) was not cut, so it pushed the option label out
(e.g. "Eclipse Adopti…", the Maven name hidden) and scrolled the popup sideways. The
label now keeps its width and the detail is cut with an ellipsis (full path in the
tooltip, detail text translated). Paths under C:/Users/<name> are shown as ~/…
---
 src/features/settings/__tests__/languages.test.ts |  2 ++
 src/features/settings/languages/components.tsx    |  2 +-
 src/ui/Select.module.css                          | 13 ++++++++++---
 src/ui/Select.tsx                                 |  6 +++++-
 4 files changed, 18 insertions(+), 5 deletions(-)

diff --git a/src/features/settings/__tests__/languages.test.ts b/src/features/settings/__tests__/languages.test.ts
index 9bacf231..b2b9e079 100644
--- a/src/features/settings/__tests__/languages.test.ts
+++ b/src/features/settings/__tests__/languages.test.ts
@@ -63,5 +63,7 @@ describe("language pages", () => {
     expect(filterPackages(pkgs, "dj").map((p) => p.name)).toEqual(["Django"]);
     expect(filterPackages(pkgs, "")).toHaveLength(2);
     expect(tildify("/Users/me/p/.venv/bin/python")).toBe("~/p/.venv/bin/python");
+    expect(tildify("C:/Users/me/.m2/wrapper/dists/apache-maven-3.9.16")).toBe("~/.m2/wrapper/dists/apache-maven-3.9.16");
+    expect(tildify("C:/Program Files/Java/jdk-21")).toBe("C:/Program Files/Java/jdk-21");
   });
 });
diff --git a/src/features/settings/languages/components.tsx b/src/features/settings/languages/components.tsx
index a0a715c5..f70383e6 100644
--- a/src/features/settings/languages/components.tsx
+++ b/src/features/settings/languages/components.tsx
@@ -15,7 +15,7 @@ export function useProjectSetting<T>(key: string): [T, (v: T) => void] {
   return useSetting<T>(key, hasProject ? "project" : "global");
 }
 
-const HOME = /^\/(?:Users|home)\/[^/]+/;
+const HOME = /^(?:\/(?:Users|home)|[A-Za-z]:[\\/]Users)[\\/][^\\/]+/;
 
 /** `~/…` for paths in the home directory. */
 export function tildify(path: string): string {
diff --git a/src/ui/Select.module.css b/src/ui/Select.module.css
index af3badc5..6aafcfa0 100644
--- a/src/ui/Select.module.css
+++ b/src/ui/Select.module.css
@@ -72,13 +72,20 @@
   flex: none;
   color: var(--fg-muted);
 }
+/* The label keeps its width (up to most of the row); a long detail (a path) is cut instead. */
 .optionLabel {
-  flex: 1;
+  flex: 1 0 auto;
+  max-width: 70%;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}
+.detail {
+  flex: 0 1 auto;
   min-width: 0;
   overflow: hidden;
   text-overflow: ellipsis;
-}
-.detail {
+  white-space: nowrap;
   color: var(--fg-muted);
 }
 .disabled {
diff --git a/src/ui/Select.tsx b/src/ui/Select.tsx
index 6eb2738c..963dd036 100644
--- a/src/ui/Select.tsx
+++ b/src/ui/Select.tsx
@@ -145,7 +145,11 @@ export function Select<V extends string = string>({
                 <span className={styles.check}>{o.value === value && <Icon name="check" size={12} />}</span>
                 {o.icon && <Icon name={o.icon} size={14} />}
                 <span className={styles.optionLabel}>{tx(o.label)}</span>
-                {o.detail && <span className={styles.detail}>{o.detail}</span>}
+                {o.detail && (
+                  <span className={styles.detail} title={o.detail}>
+                    {tx(o.detail)}
+                  </span>
+                )}
               </>
             )}
           />