Support for monorepos

Hi @PKief I'd like to validate my idea. What do you think about adding support for microservices? I mean the situation where the user has a large monorepo contains many different apps, like:

• app-with-angular
• app-with-react
• app-with-nest

and for all of these, he wants to use different icon packs.

My proposal is to add a second step of configuring icon packs. In the first one, the user will be able to pick more than one pack. And if he will pick more than one, we can display the second QuickPick (oh, you picked more than one icon pack. Please assign them to the specific folder) with the list of folders, where the user will be able to assign a particular icon pack to a specific folder. So, the result will be:

[
  {
    folderName: `app-with-angular`,
    iconPack: IconPack.Angular
  },
  {
    folderName: `app-with-react`,
    iconPack: IconPack.React
  },
  {
    folderName: `app-with-nest`,
    iconPack: IconPack.Nest
  },
]

This is probably a problem faced by a minority of users, but I'd love to hear your opinion :)

I'd love to work on that, if that's ok for you 😃

The reason why I introduced icon packs is that there are file or folder names that could be used by multiple frameworks. E.g. what icon do you give a file called "store.ts"? The redux, vuex or ngrx icon? 😅 This is why I avoided to let the user select multiple packs at once. How do you see this issue? (Btw. I'm currently on vacation and have very limited time to look into GitHub, so please be patient until I can answer you 🙃

Yeah, I totally understand what is behind this idea. What problem I see is the case, when the user has plenty of applications that use different frameworks. Let's say we have a monorepo with one app that uses React and another that uses Nest. So, when I choose the icon pack for React and go to the Nest app, I have to change the pack to Nest. It might be annoying a bit.

The idea, that I have is to let the user choose an icon pack for a particular app. Example structure:

- my-monorepo
  - app-with-react (it's using the React icon pack)
  - app-with-nest (and this one is using an icon pack for Nest)
  - app-with-vue 
  - etc...

This way, when I'm switching my focus to a different app in the same monorepo, I don't have to change the icon pack. This is the case, that I see in monorepos, especially if I use micro-services.

I don't have an idea, of how to limit the settings to the specific monorepo. The simplest solution will be to create the config file, placed in the main folder of the repo, but maybe we can extend the existing config file - I think it will be the easier and cleaner solution for the users.

For me it's still not so clear how we want to achieve this. Somehow we would have to recognize which framework folder is opened and currently active and switch the icon pack accordingly. If the user collapses the folder again and opens another one we would have to switch the icon pack again, right?

To be honest, I'm not 100% sure what capabilities VS Code gives us. But my initial idea of the architecture looks like the following: In the place where we currently have a global config with the selected icon pack saved we change the structure to, for example:

const config = {
  ...
  activeIconPack: {
    global: `nameOfIconPack` <-- name of the global config,
    `path/to/the/specific/folder`: `nameOfDifferentIconPack` <-- this line will set the icon pack of specific folder
  }
}

Then when changing icons in VS (pseudo-code):

  const selectedIconPack = config[file]
  const nameOfIconPackOfParentFolder = getNameOfIconPackOfParentFolder(file)
  /**
   * If we have the following structure:
   * foo
   *   bar (let's say the user has enabled the Angular icon pack for this folder)
   *     component.ts (file inside this folder will use the Angular icon pack)
   * 
   * So, the `getNameOfIconPackOfParentFolder` helper will return: IconPacks.Angular, because files are inside `bar` folder.
   */

  if (nameOfIconPackOfParentFolder) {
   file.icon = getIcon(selectedIconPack, file)
  } else {
    file.icon = getIcon(`global`, file)
  }

  /**
   * `getIcon` will return the icon for a specific file, based on the chosen icon pack.
   */

Thanks for clarifying :) The issue is the following: VS Code wants extension authors to provide a single JSON file in which the file names <-> icon relation is hard-coded. So you can define "icon.svg" and say "router.ts" should have "icon.svg" as icon. And this is applied to VS Code in general without a possibility to change that. But as you know, I've implemented the feature of changing icons by setting. What this does is regenerating the JSON file with the new relations. Regarding this issue there's no capability to apply icons only on specific files inside of folders.

You can also take a look at this JSON file. It is located inside the extensions directory:

C:\Users\<username>\.vscode\extensions\pkief.material-icon-theme-4.17.0\dist\material-icons.json

This is all what VS Code provides us for now to apply icons to VS Code 🙈

I think it will be possible to implement if VS Code would introduce glob file / folder name patterns: https://github.com/microsoft/vscode/issues/12493. But it doesn't seem to be implemented in the near future.