From a685597b70242eb4c6b38d30c5356ad79418176d Mon Sep 17 00:00:00 2001
From: Miguel Solorio <miguel.solorio07@gmail.com>
Date: Thu, 8 May 2025 16:00:55 -0700
Subject: UI Polish for theme selector (#294)

---
 packages/cli/src/ui/themes/theme-manager.ts | 29 +++++++++++++++++++++++++----
 1 file changed, 25 insertions(+), 4 deletions(-)

(limited to 'packages/cli/src/ui/themes/theme-manager.ts')

diff --git a/packages/cli/src/ui/themes/theme-manager.ts b/packages/cli/src/ui/themes/theme-manager.ts
index 4a8cc32c..d1f8df9c 100644
--- a/packages/cli/src/ui/themes/theme-manager.ts
+++ b/packages/cli/src/ui/themes/theme-manager.ts
@@ -11,12 +11,12 @@ import { GoogleCode } from './googlecode.js';
 import { VS } from './vs.js';
 import { VS2015 } from './vs2015.js';
 import { XCode } from './xcode.js';
-import { Theme } from './theme.js';
+import { Theme, ThemeType } from './theme.js';
 import { ANSI } from './ansi.js';
 
 export interface ThemeDisplay {
   name: string;
-  active: boolean;
+  type: ThemeType;
 }
 
 export const DEFAULT_THEME: Theme = VS2015;
@@ -43,9 +43,30 @@ class ThemeManager {
    * Returns a list of available theme names.
    */
   getAvailableThemes(): ThemeDisplay[] {
-    return this.availableThemes.map((theme) => ({
+    const sortedThemes = [...this.availableThemes].sort((a, b) => {
+      const typeOrder = (type: ThemeType): number => {
+        switch (type) {
+          case 'dark':
+            return 1;
+          case 'light':
+            return 2;
+          case 'ansi':
+            return 3;
+          default:
+            return 4;
+        }
+      };
+
+      const typeComparison = typeOrder(a.type) - typeOrder(b.type);
+      if (typeComparison !== 0) {
+        return typeComparison;
+      }
+      return a.name.localeCompare(b.name);
+    });
+
+    return sortedThemes.map((theme) => ({
       name: theme.name,
-      active: theme === this.activeTheme,
+      type: theme.type,
     }));
   }
 
-- 
cgit v1.2.3