From 5fdc8c9481d1998efd055ebe609d07d39d378ea1 Mon Sep 17 00:00:00 2001
From: Nicholas <30300649+NicholasFlamy@users.noreply.github.com>
Date: Tue, 27 May 2025 11:02:36 -0400
Subject: [PATCH] feat: add vscode extensions as recommendations (#18641)

* add vscode extensions as recommendations

* forgot to add DCM because it's not available for VSCodium afaict

* update docs

* fix formatting
---
 .gitignore                   |  1 +
 .vscode/extensions.json      | 10 ++++++
 docs/docs/developer/setup.md | 68 ++++++++++++++++++++++++++++--------
 3 files changed, 65 insertions(+), 14 deletions(-)
 create mode 100644 .vscode/extensions.json

diff --git a/.gitignore b/.gitignore
index e0544ad8d5..b4ebd04841 100644
--- a/.gitignore
+++ b/.gitignore
@@ -3,6 +3,7 @@
 .DS_Store
 .vscode/*
 !.vscode/launch.json
+!.vscode/extensions.json
 .idea
 
 docker/upload
diff --git a/.vscode/extensions.json b/.vscode/extensions.json
new file mode 100644
index 0000000000..8be57c6ba4
--- /dev/null
+++ b/.vscode/extensions.json
@@ -0,0 +1,10 @@
+{
+  "recommendations": [
+    "esbenp.prettier-vscode",
+    "svelte.svelte-vscode",
+    "dbaeumer.vscode-eslint",
+    "dart-code.flutter",
+    "dart-code.dart-code",
+    "dcmdev.dcm-vscode-extension"
+  ]
+}
diff --git a/docs/docs/developer/setup.md b/docs/docs/developer/setup.md
index 5e821e9b9b..32705e3248 100644
--- a/docs/docs/developer/setup.md
+++ b/docs/docs/developer/setup.md
@@ -115,32 +115,72 @@ Note: Activating the license is not required.
 
 ### VSCode
 
-Install `Flutter`, `DCM`, `Prettier`, `ESLint` and `Svelte` extensions.
+Install `Flutter`, `DCM`, `Prettier`, `ESLint` and `Svelte` extensions. These extensions are listed in the `extensions.json` file under `.vscode/` and should appear as workspace recommendations.
 
-in User `settings.json` (`cmd + shift + p` and search for `Open User Settings JSON`) add the following:
+Here are the settings we use, they should be active as workspace settings (`settings.json`):
 
 ```json title="settings.json"
 {
-  "editor.formatOnSave": true,
-  "[javascript][typescript][css]": {
+  "[css]": {
     "editor.defaultFormatter": "esbenp.prettier-vscode",
-    "editor.tabSize": 2,
-    "editor.formatOnSave": true
-  },
-  "[svelte]": {
-    "editor.defaultFormatter": "svelte.svelte-vscode",
+    "editor.formatOnSave": true,
     "editor.tabSize": 2
   },
-  "svelte.enable-ts-plugin": true,
-  "eslint.validate": ["javascript", "svelte"],
   "[dart]": {
+    "editor.defaultFormatter": "Dart-Code.dart-code",
     "editor.formatOnSave": true,
     "editor.selectionHighlight": false,
     "editor.suggest.snippetsPreventQuickSuggestions": false,
     "editor.suggestSelection": "first",
     "editor.tabCompletion": "onlySnippets",
-    "editor.wordBasedSuggestions": "off",
-    "editor.defaultFormatter": "Dart-Code.dart-code"
-  }
+    "editor.wordBasedSuggestions": "off"
+  },
+  "[javascript]": {
+    "editor.codeActionsOnSave": {
+      "source.organizeImports": "explicit",
+      "source.removeUnusedImports": "explicit"
+    },
+    "editor.defaultFormatter": "esbenp.prettier-vscode",
+    "editor.formatOnSave": true,
+    "editor.tabSize": 2
+  },
+  "[json]": {
+    "editor.defaultFormatter": "esbenp.prettier-vscode",
+    "editor.formatOnSave": true,
+    "editor.tabSize": 2
+  },
+  "[jsonc]": {
+    "editor.defaultFormatter": "esbenp.prettier-vscode",
+    "editor.formatOnSave": true,
+    "editor.tabSize": 2
+  },
+  "[svelte]": {
+    "editor.codeActionsOnSave": {
+      "source.organizeImports": "explicit",
+      "source.removeUnusedImports": "explicit"
+    },
+    "editor.defaultFormatter": "svelte.svelte-vscode",
+    "editor.formatOnSave": true,
+    "editor.tabSize": 2
+  },
+  "[typescript]": {
+    "editor.codeActionsOnSave": {
+      "source.organizeImports": "explicit",
+      "source.removeUnusedImports": "explicit"
+    },
+    "editor.defaultFormatter": "esbenp.prettier-vscode",
+    "editor.formatOnSave": true,
+    "editor.tabSize": 2
+  },
+  "cSpell.words": ["immich"],
+  "editor.formatOnSave": true,
+  "eslint.validate": ["javascript", "svelte"],
+  "explorer.fileNesting.enabled": true,
+  "explorer.fileNesting.patterns": {
+    "*.dart": "${capture}.g.dart,${capture}.gr.dart,${capture}.drift.dart",
+    "*.ts": "${capture}.spec.ts,${capture}.mock.ts"
+  },
+  "svelte.enable-ts-plugin": true,
+  "typescript.preferences.importModuleSpecifier": "non-relative"
 }
 ```