#548 - Project selection support

CHANGELOG.md

@@ -21,6 +21,7 @@
 - [#530](https://github.com/estruyf/vscode-front-matter/issues/530): Implementation of the Front Matter AI 🤖 powered by [mendable.ai](https://mendable.ai)
 - [#537](https://github.com/estruyf/vscode-front-matter/issues/537): Allow to use the root path `/` as the public folder
 - [#541](https://github.com/estruyf/vscode-front-matter/issues/541): Added title AI suggestions for GitHub sponsors
+- [#548](https://github.com/estruyf/vscode-front-matter/issues/548): Project selection support when working in mono-repos or multi-root workspaces
 - [#550](https://github.com/estruyf/vscode-front-matter/issues/550): Added taxonomy (tags/categories) AI suggestions for GitHub sponsors
 
 ### 🎨 Enhancements

package.json

@@ -1652,6 +1652,12 @@
       }
     },
     "commands": [{
+        "command": "frontMatter.project.switch",
+        "title": "Switch project",
+        "category": "Front Matter",
+        "icon": "$(arrow-swap)"
+      },
+      {
         "command": "frontMatter.config.reload",
         "title": "Reload config",
         "category": "Front Matter"
@@ -2084,6 +2090,10 @@
           "command": "frontMatter.init",
           "when": "frontMatterCanInit"
         },
+        {
+          "command": "frontMatter.project.switch",
+          "when": "frontMatter:project:switch:enabled"
+        },
         {
           "command": "frontMatter.createTemplate",
           "when": "!frontMatterCanInit"
@@ -2237,8 +2247,13 @@
           "when": "view == frontMatter.explorer && frontMatter:has:modes == true"
         },
         {
-          "command": "frontMatter.dashboard",
+          "command": "frontMatter.project.switch",
           "group": "navigation@3",
+          "when": "view == frontMatter.explorer && frontMatter:project:switch:enabled"
+        },
+        {
+          "command": "frontMatter.dashboard",
+          "group": "navigation@4",
           "when": "view == frontMatter.explorer || view == explorer"
         }
       ]

src/commands/Project.ts

@@ -1,12 +1,13 @@
 import { DEFAULT_CONTENT_TYPE } from './../constants/ContentType';
 import { Telemetry } from './../helpers/Telemetry';
-import { workspace, Uri } from 'vscode';
+import { workspace, Uri, commands, window } from 'vscode';
 import { join } from 'path';
 import { Notifications } from '../helpers/Notifications';
 import { Template } from './Template';
 import { Folders } from './Folders';
-import { FrameworkDetector, Logger, MediaLibrary, Settings } from '../helpers';
+import { Extension, FrameworkDetector, Logger, MediaLibrary, Settings } from '../helpers';
 import {
+  COMMAND_NAME,
   SETTING_CONTENT_DEFAULT_FILETYPE,
   SETTING_TAXONOMY_CONTENT_TYPES,
   TelemetryEvent
@@ -28,6 +29,13 @@ categories: []
 ---
 `;
 
+  public static registerCommands() {
+    const ext = Extension.getInstance();
+    const subscriptions = ext.subscriptions;
+
+    subscriptions.push(commands.registerCommand(COMMAND_NAME.switchProject, Project.switchProject));
+  }
+
   public static isInitialized() {
     const hasProjectFile = Settings.hasProjectFile();
     // If it has a project file, initialize the media library
@@ -74,6 +82,24 @@ categories: []
     }
   }
 
+  public static async switchProject() {
+    const projects = Settings.getProjects();
+    const project = await window.showQuickPick(
+      projects.map((p) => p.name),
+      {
+        canPickMany: false,
+        ignoreFocusOut: true,
+        title: 'Select a project to switch to'
+      }
+    );
+
+    if (!project) {
+      return;
+    }
+
+    SettingsListener.switchProject(project);
+  }
+
   /**
    * Creates the templates folder + sample if needed
    * @param sampleTemplate

src/constants/Extension.ts

@@ -65,6 +65,9 @@ export const COMMAND_NAME = {
   addMissingFields: getCommandName('contenttype.addMissingFields'),
   setContentType: getCommandName('contenttype.setContentType'),
 
+  // Project
+  switchProject: getCommandName('project.switch'),
+
   // Git
   gitSync: getCommandName('git.sync'),
 

src/constants/context.ts

@@ -12,5 +12,7 @@ export const CONTEXT = {
   isSnippetsDashboardEnabled: 'frontMatter:dashboard:snippets:enabled',
   isDataDashboardEnabled: 'frontMatter:dashboard:data:enabled',
 
-  isGitEnabled: 'frontMatter:git:enabled'
+  isGitEnabled: 'frontMatter:git:enabled',
+
+  projectSwitchEnabled: 'frontMatter:project:switch:enabled',
 };

src/dashboardWebView/components/Header/ProjectSwitcher.tsx

@@ -1,6 +1,6 @@
 import { messageHandler } from '@estruyf/vscode/dist/client';
 import { Menu } from '@headlessui/react';
-import { GlobeAltIcon } from '@heroicons/react/outline';
+import { SwitchHorizontalIcon } from '@heroicons/react/outline';
 import * as React from 'react';
 import { useRecoilValue } from 'recoil';
 import { DashboardMessage } from '../../DashboardMessage';
@@ -35,7 +35,7 @@ export const ProjectSwitcher: React.FunctionComponent<IProjectSwitcherProps> = (
         <MenuButton
           label={(
             <div className="inline-flex items-center">
-              <GlobeAltIcon className="h-4 w-4 mr-2" />
+              <SwitchHorizontalIcon className="h-4 w-4 mr-2" />
               <span>project</span>
             </div>
           )}

src/extension.ts

@@ -352,6 +352,9 @@ export async function activate(context: vscode.ExtensionContext) {
   // Cache commands
   Cache.registerCommands();
 
+  // Project switching
+  Project.registerCommands();
+
   // Subscribe all commands
   subscriptions.push(
     insertTags,

src/helpers/SettingsHelper.ts

@@ -124,6 +124,12 @@ export class Settings {
       projects = Settings.globalConfig[settingKey];
     }
 
+    if (projects.length > 0) {
+      commands.executeCommand('setContext', CONTEXT.projectSwitchEnabled, true);
+    } else {
+      commands.executeCommand('setContext', CONTEXT.projectSwitchEnabled, false);
+    }
+
     return projects;
   }
 

src/listeners/dashboard/SettingsListener.ts

@@ -3,13 +3,14 @@ import { commands, Uri } from 'vscode';
 import { Folders } from '../../commands/Folders';
 import {
   COMMAND_NAME,
+  ExtensionState,
   SETTING_CONTENT_STATIC_FOLDER,
   SETTING_FRAMEWORK_ID,
   SETTING_PREVIEW_HOST
 } from '../../constants';
 import { DashboardCommand } from '../../dashboardWebView/DashboardCommand';
 import { DashboardMessage } from '../../dashboardWebView/DashboardMessage';
-import { DashboardSettings, Settings } from '../../helpers';
+import { DashboardSettings, Extension, Settings } from '../../helpers';
 import { FrameworkDetector } from '../../helpers/FrameworkDetector';
 import { Framework, PostMessageData } from '../../models';
 import { BaseListener } from './BaseListener';
@@ -48,12 +49,19 @@ export class SettingsListener extends BaseListener {
     }
   }
 
-  private static async switchProject(project: string) {
+  public static async switchProject(project: string) {
     if (project) {
       this.sendMsg(DashboardCommand.loading, true);
       Settings.setProject(project);
       await Cache.clear(false);
 
+      // Clear out the media folder
+      await Extension.getInstance().setState<string | undefined>(
+        ExtensionState.SelectedFolder,
+        undefined,
+        'workspace'
+      );
+
       Preview.init();
       GitListener.init();