From 97a70de080ebe42c4c1ff22509dc0c64ab4cc19f Mon Sep 17 00:00:00 2001
From: Lloyd Richards <59728961+lloydrichards@users.noreply.github.com>
Date: Wed, 8 Nov 2023 09:33:55 +0100
Subject: [PATCH] chore(dx): :technologist: add debug launcher and fix
 extension recommendations (#1251)

---
 .vscode/extensions.json |  2 +-
 .vscode/launch.json     | 15 +++++++++++++++
 README.md               |  2 ++
 3 files changed, 18 insertions(+), 1 deletion(-)
 create mode 100644 .vscode/launch.json

diff --git a/.vscode/extensions.json b/.vscode/extensions.json
index 13be5258a..9710296e1 100644
--- a/.vscode/extensions.json
+++ b/.vscode/extensions.json
@@ -6,7 +6,7 @@
   "recommendations": [
     "esbenp.prettier-vscode",
     "dbaeumer.vscode-eslint",
-    "silvenon.mdx"
+    "unifiedjs.vscode-mdx"
   ],
   // List of extensions recommended by VS Code that should not be recommended for users of this workspace.
   "unwantedRecommendations": []
diff --git a/.vscode/launch.json b/.vscode/launch.json
new file mode 100644
index 000000000..d3cd04cd7
--- /dev/null
+++ b/.vscode/launch.json
@@ -0,0 +1,15 @@
+{
+    // Use IntelliSense to learn about possible attributes.
+    // Hover to view descriptions of existing attributes.
+    // For more information, visit: https://go.microsoft.com/fwlink/?linkid=830387
+    "version": "0.2.0",
+    "configurations": [
+        {
+            "type": "chrome",
+            "request": "launch",
+            "name": "Launch Chrome",
+            "url": "http://localhost:3000",
+            "webRoot": "${workspaceFolder}/app"
+        }
+    ]
+}
\ No newline at end of file
diff --git a/README.md b/README.md
index b2ec6182c..24105e010 100644
--- a/README.md
+++ b/README.md
@@ -28,6 +28,8 @@ yarn dev
 
 > 👉 In [Visual Studio Code](https://code.visualstudio.com/), you also can run the **default build task** (CMD-SHIFT-B) to start the dev server, database server, and TypeScript checker (you'll need [Nix](https://nixos.org) for that to work).
 
+To run the application with debugging enabled through vscode, make sure the dev server is running and the click the "Run and Debug" button in the sidebar (CMD-SHIFT-D). Then select the "Launch Chrome" configuration. This will open a new Chrome window with the dev tools open. You can now set breakpoints in the code and they will be hit.
+
 ### Postgres database
 
 If the database server is not running, run: