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 9bacf2316..b2b9e0794 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 a0a715c5f..f70383e6d 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 af3badc54..6aafcfa0f 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 6eb2738c8..963dd0365 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>
+                )}
               </>
             )}
           />