change theme calls tehem settings

packages/web/src/commands/stdCommands.ts

@@ -29,26 +29,27 @@ import runCommand from './runCommand';
 import { openWebLink } from '../utility/exportElectronFile';
 import { getSettings } from '../utility/metadataLoaders';
 
-function themeCommand(theme: ThemeDefinition) {
-  return {
-    text: theme.themeName,
-    onClick: () => currentTheme.set(theme.themeClassName),
-    // onPreview: () => {
-    //   const old = get(currentTheme);
-    //   currentTheme.set(css);
-    //   return ok => {
-    //     if (!ok) currentTheme.set(old);
-    //   };
-    // },
-  };
-}
+// function themeCommand(theme: ThemeDefinition) {
+//   return {
+//     text: theme.themeName,
+//     onClick: () => currentTheme.set(theme.themeClassName),
+//     // onPreview: () => {
+//     //   const old = get(currentTheme);
+//     //   currentTheme.set(css);
+//     //   return ok => {
+//     //     if (!ok) currentTheme.set(old);
+//     //   };
+//     // },
+//   };
+// }
 
 registerCommand({
   id: 'theme.changeTheme',
   category: 'Theme',
   name: 'Change',
   toolbarName: 'Change theme',
-  getSubCommands: () => get(extensions).themes.map(themeCommand),
+  onClick: () => showModal(SettingsModal, { selectedTab: 1 }),
+  // getSubCommands: () => get(extensions).themes.map(themeCommand),
 });
 
 registerCommand({

packages/web/src/settings/SettingsModal.svelte

@@ -17,6 +17,8 @@
 
   const electron = getElectron();
   let restartWarning = false;
+
+  export let selectedTab = 0;
 </script>
 
 <SettingsFormProvider>
@@ -25,6 +27,7 @@
 
     <FormValues let:values>
       <TabControl
+        bind:value={selectedTab}
         isInline
         tabs={[
           { label: 'General', slot: 1 },