feat: enhance VS Code extension with sidebar redesign, improved API integration, and localization updates

Author: PythonSmall-Q

CHANGELOG.md

@@ -44,6 +44,7 @@ Format follows [Keep a Changelog](https://keepachangelog.com/en/1.1.0/).
 - **Frontend accessibility pass** — added "Skip to main content" link, global `:focus-visible` styles, ARIA live announcer for notifications, navigation landmark labels, `aria-current="page"`, icon-only button labels, dialog roles/modal attributes, and dynamic HTML `lang` updates.
 - **Local API server governance** — hardened all API server routes to enforce widget-scoped API token scopes and reject unscoped or revoked tokens.
 - **Offline test harness scripts** — added `scripts/offline-journey-tests.sh` and `scripts/migration-rehearsal.sh` for local critical-journey and migration validation.
+- **VS Code extension sidebar home page redesign** — added connection status badge, focus-mode indicator, today's VS Code time card, language/project breakdown with progress bars, top desktop apps, and cleaner action buttons; sidebar API calls now include `X-Api-Token` and `X-Client-Id` headers for local API governance compatibility.
 
 ### Changed
 
@@ -73,6 +74,8 @@ Format follows [Keep a Changelog](https://keepachangelog.com/en/1.1.0/).
 
 ### Fixed
 
+- **Settings excluded apps could not be unchecked after saving** — fixed a path-normalization mismatch: the backend stores ignored app paths lowercased, but the frontend compared original-case paths, causing excluded apps to vanish from the list. The list now renders ignored apps directly with case-insensitive matching so they remain visible and togglable.
+- **VS Code extension sidebar title showed raw `%timelens.homeView.name%`** — fixed invalid JSON in `vscode-extension/package.nls.json` and `vscode-extension/package.nls.zh-CN.json` (missing comma after `timelens.apiToken.description`), which prevented VS Code from resolving all `%...%` placeholder strings in `package.json`.
 - **Profile switching reliability** — fixed a bug where switching profiles could result in a "connection refused" error or missing profiles because `current_profile_id` was stored inside the encrypted profile database.
 - **Widget permission dialog state** — fixed install-time permission dialog state reset and instance targeting so permission grants are correctly associated with the widget being installed.
 - **Database encryption shutdown corruption** — fixed a critical bug where shutdown re-encryption generated a fresh nonce/salt but did not update the stored metadata, causing the next startup to fail with "Failed to decrypt database". Re-encryption now writes updated metadata and uses atomic temp-file writes.

src/pages/Settings/index.tsx

@@ -304,11 +304,12 @@ export default function Settings() {
 
         // Auto-seed TimeLens exclusion on first run
         api.getIgnoredApps().then((ignored) => {
-          setIgnoredAppsState(ignored);
-          if (ignored.length === 0 && excludeTimelens) {
+          const normalized = ignored.map(normalizeExePath);
+          setIgnoredAppsState(normalized);
+          if (normalized.length === 0 && excludeTimelens) {
             const tlExes = recent
-              .filter((x) => x.exe_path.toLowerCase().includes("timelens"))
-              .map((x) => x.exe_path);
+              .filter((x) => normalizeExePath(x.exe_path).includes("timelens"))
+              .map((x) => normalizeExePath(x.exe_path));
             if (tlExes.length > 0) {
               setIgnoredAppsState(tlExes);
               api.setIgnoredApps(tlExes).catch(() => {});
@@ -343,21 +344,24 @@ export default function Settings() {
     return 0;
   };
 
+  const normalizeExePath = (p: string) => p.trim().replace(/\//g, "\\").toLowerCase();
+
   const toggleIgnoredApp = (exePath: string) => {
+    const normalized = normalizeExePath(exePath);
     setIgnoredAppsState((prev) =>
-      prev.includes(exePath)
-        ? prev.filter((p) => p !== exePath)
-        : [...prev, exePath]
+      prev.includes(normalized)
+        ? prev.filter((p) => p !== normalized)
+        : [...prev, normalized]
     );
   };
 
   const addPickedExcludedApp = (appName: string, exePath: string) => {
     if (!exePath) return;
-    const normalized = exePath.replace(/\//g, "\\");
+    const normalized = normalizeExePath(exePath);
     setIgnoredAppsState((prev) => (prev.includes(normalized) ? prev : [...prev, normalized]));
     setExecutableOptions((prev) => {
-      if (prev.some((x) => x.exe_path === normalized)) return prev;
-      return [{ app_name: appName, exe_path: normalized }, ...prev];
+      if (prev.some((x) => normalizeExePath(x.exe_path) === normalized)) return prev;
+      return [{ app_name: appName, exe_path: exePath }, ...prev];
     });
     setExcludePickerValue("");
   };
@@ -1197,15 +1201,15 @@ export default function Settings() {
               setExcludeTimelens(next);
               // Add/remove TimeLens exes from ignored list
               const tlExes = executableOptions
-                .filter((x) => x.exe_path.toLowerCase().includes("timelens"))
-                .map((x) => x.exe_path);
+                .filter((x) => normalizeExePath(x.exe_path).includes("timelens"))
+                .map((x) => normalizeExePath(x.exe_path));
               if (next) {
                 const merged = Array.from(new Set([...ignoredApps, ...tlExes]));
                 setIgnoredAppsState(merged);
                 api.setIgnoredApps(merged).catch(() => {});
               } else {
                 const filtered = ignoredApps.filter(
-                  (p) => !p.toLowerCase().includes("timelens")
+                  (p) => !normalizeExePath(p).includes("timelens")
                 );
                 setIgnoredAppsState(filtered);
                 api.setIgnoredApps(filtered).catch(() => {});
@@ -1523,36 +1527,47 @@ export default function Settings() {
             options={executableOptions}
             placeholder={t("data.searchExe")}
             value={excludePickerValue}
+            excludePaths={new Set(
+              executableOptions
+                .filter((x) => ignoredApps.includes(normalizeExePath(x.exe_path)))
+                .map((x) => x.exe_path)
+            )}
             onChange={(appName, exePath) => {
               if (exePath) { addPickedExcludedApp(appName, exePath); }
               else { setExcludePickerValue(appName); }
             }}
           />
           <div className="max-h-48 overflow-y-auto rounded-lg border border-surface-border divide-y divide-surface-border">
-            {executableOptions.filter((x) => ignoredApps.includes(x.exe_path)).map((row) => {
-              const checked = ignoredApps.includes(row.exe_path);
+            {ignoredApps.map((path) => {
+              const option = executableOptions.find(
+                (x) => normalizeExePath(x.exe_path) === path
+              );
+              const appName =
+                option?.app_name ??
+                path.split(/[\\/]/).pop()?.replace(/\.exe$/i, "") ??
+                path;
+              const exePath = option?.exe_path ?? path;
               return (
                 <label
-                  key={row.exe_path}
+                  key={path}
                   className="flex items-start gap-2 px-3 py-2 text-xs text-text-secondary hover:bg-surface-hover cursor-pointer"
                 >
                   <input
                     type="checkbox"
                     className="ui-checkbox mt-0.5"
-                    checked={checked}
-                    onChange={() => toggleIgnoredApp(row.exe_path)}
+                    checked={true}
+                    onChange={() => toggleIgnoredApp(path)}
                   />
                   <span className="min-w-0">
-                    <span className="block text-text-primary truncate">{row.app_name}</span>
-                    <span className="block text-text-muted truncate" title={row.exe_path}>
-                      {row.exe_path}
+                    <span className="block text-text-primary truncate">{appName}</span>
+                    <span className="block text-text-muted truncate" title={exePath}>
+                      {exePath}
                     </span>
                   </span>
                 </label>
               );
             })}
-            
-            {executableOptions.filter((x: ExecutableOption) => ignoredApps.includes(x.exe_path)).length === 0 && (
+            {ignoredApps.length === 0 && (
               <p className="px-3 py-3 text-xs text-text-muted">{t("data.noExcludedApps")}</p>
             )}
           </div>

vscode-extension/package.nls.json

@@ -3,7 +3,7 @@
   "timelens.enabled.description": "Enable local VS Code usage tracking for TimeLens.",
   "timelens.apiBaseUrl.description": "Local TimeLens API base URL.",
   "timelens.bridgeKey.description": "Extension bridge key for authenticating with TimeLens local API. Get this from Settings > Local API / Extension Bridge.",
-  "timelens.apiToken.description": "Local API token for authenticating with TimeLens when token-required mode is enabled. Get this from Settings > Local API / Tokens."
+  "timelens.apiToken.description": "Local API token for authenticating with TimeLens when token-required mode is enabled. Get this from Settings > Local API / Tokens.",
   "timelens.flushIntervalSeconds.description": "How often to flush queued sessions to TimeLens API.",
   "timelens.idleThresholdSeconds.description": "Split a session when editor activity is idle for this many seconds.",
   "timelens.trackingLevel.description": "How much data to record per VS Code session.",

vscode-extension/package.nls.zh-CN.json

@@ -3,7 +3,7 @@
   "timelens.enabled.description": "启用 TimeLens 本地 VS Code 使用时长追踪。",
   "timelens.apiBaseUrl.description": "TimeLens 本地 API 基础 URL。",
   "timelens.bridgeKey.description": "用于向 TimeLens 本地 API 认证的扩展桥接密钥，可在「设置 > 本地 API / 扩展桥接」中获取。",
-  "timelens.apiToken.description": "在启用「需要 API Token」模式时，用于向 TimeLens 本地 API 认证的令牌，可在「设置 > 本地 API / 令牌」中获取。"
+  "timelens.apiToken.description": "在启用「需要 API Token」模式时，用于向 TimeLens 本地 API 认证的令牌，可在「设置 > 本地 API / 令牌」中获取。",
   "timelens.flushIntervalSeconds.description": "将排队会话刷新到 TimeLens API 的频率（秒）。",
   "timelens.idleThresholdSeconds.description": "当编辑器活动空闲超过此秒数时，将当前会话拆分。",
   "timelens.trackingLevel.description": "每个 VS Code 会话记录的数据量。",