Prettier config improvements

.devcontainer/compose.extend.yaml

@@ -17,7 +17,7 @@ services:
     command: /bin/sh -c "while sleep 1000; do :; done"
     environment:
       - DB_PROTOCOL=tcp(mysql:3306)
-  mysql:  # extending server/compose.yaml
+  mysql: # extending server/compose.yaml
     networks: # make accessible to devcontainer via network
       - dev-net
 

.devcontainer/devcontainer.json

@@ -1,66 +1,64 @@
 // For format details, see https://aka.ms/devcontainer.json. For config options, see the
 // README at: https://github.com/devcontainers/templates/tree/main/src/debian
 {
-	"name": "DxE ADB",
+  "name": "DxE ADB",
 
-	// https://code.visualstudio.com/docs/devcontainers/create-dev-container#_use-docker-compose
-	"dockerComposeFile": ["../server/compose.yaml", "./compose.extend.yaml"],
-	"service": "devcontainer", // defined in dockerComposeFile
-	"runServices": ["devcontainer", "mysql"], // defined in dockerComposeFile
-	"workspaceFolder": "/workspace",
-	"shutdownAction": "stopCompose",
-	"remoteUser": "vscode",
+  // https://code.visualstudio.com/docs/devcontainers/create-dev-container#_use-docker-compose
+  "dockerComposeFile": ["../server/compose.yaml", "./compose.extend.yaml"],
+  "service": "devcontainer", // defined in dockerComposeFile
+  "runServices": ["devcontainer", "mysql"], // defined in dockerComposeFile
+  "workspaceFolder": "/workspace",
+  "shutdownAction": "stopCompose",
+  "remoteUser": "vscode",
 
-	// Features to add to the dev container. More info: https://containers.dev/features.
-	"features": {
-		"ghcr.io/devcontainers/features/docker-in-docker:2": {
-			"moby": true,
-			"azureDnsAutoDetection": true,
-			"installDockerBuildx": true,
-			"version": "latest",
-			"dockerDashComposeVersion": "v1"
-		},
-		"ghcr.io/devcontainers/features/go:1": {
-			"version": "latest"
-		},
-		"ghcr.io/devcontainers/features/node:1": {
-			"nodeGypDependencies": true,
-			"version": "18"  // Match version from Dockerfile
-		},
-		// Shares a pnpm store between devcontainers.
-		// https://github.com/joshuanianji/devcontainer-features/tree/main/src/mount-pnpm-store
-		"ghcr.io/joshuanianji/devcontainer-features/mount-pnpm-store:1": {},
-		"ghcr.io/jungaretti/features/make:1": {},
-		"ghcr.io/rocker-org/devcontainer-features/apt-packages:1": {
-			// mariadb-client package provides the `mysql` command for
-			// development / debugging purposes (not an app dependeny).
-			"packages": "mariadb-client"
-		}
-	},
-	"customizations": {
-		"vscode": {
-			"extensions": [
-				"ms-vscode.makefile-tools",
-				"golang.go",
-				"Vue.volar",
-				"GitHub.vscode-github-actions",
-				"ms-vscode.vscode-typescript-next",
-				"esbenp.prettier-vscode"
-			]
-		}
-	},
+  // Features to add to the dev container. More info: https://containers.dev/features.
+  "features": {
+    "ghcr.io/devcontainers/features/docker-in-docker:2": {
+      "moby": true,
+      "azureDnsAutoDetection": true,
+      "installDockerBuildx": true,
+      "version": "latest",
+      "dockerDashComposeVersion": "v1"
+    },
+    "ghcr.io/devcontainers/features/go:1": {
+      "version": "latest"
+    },
+    "ghcr.io/devcontainers/features/node:1": {
+      "nodeGypDependencies": true,
+      "version": "18" // Match version from Dockerfile
+    },
+    // Shares a pnpm store between devcontainers.
+    // https://github.com/joshuanianji/devcontainer-features/tree/main/src/mount-pnpm-store
+    "ghcr.io/joshuanianji/devcontainer-features/mount-pnpm-store:1": {},
+    "ghcr.io/jungaretti/features/make:1": {},
+    "ghcr.io/rocker-org/devcontainer-features/apt-packages:1": {
+      // mariadb-client package provides the `mysql` command for
+      // development / debugging purposes (not an app dependeny).
+      "packages": "mariadb-client"
+    }
+  },
+  "customizations": {
+    "vscode": {
+      "extensions": [
+        "ms-vscode.makefile-tools",
+        "golang.go",
+        "Vue.volar",
+        "GitHub.vscode-github-actions",
+        "ms-vscode.vscode-typescript-next",
+        "esbenp.prettier-vscode"
+      ]
+    }
+  },
 
-	// Use 'forwardPorts' to make a list of ports inside the container available locally.
-	"forwardPorts": [
-		8080 /* ADB main site (adb.dxe.io) */
-	],
-	"otherPortsAttributes": {
-		// Other ports will be automatically forwarded, but without any
-		// notification. They will still appear in the "ports" tab of the Panel
-		// in VS Code.
-		"onAutoForward": "silent"
-	}
+  // Use 'forwardPorts' to make a list of ports inside the container available locally.
+  "forwardPorts": [8080 /* ADB main site (adb.dxe.io) */],
+  "otherPortsAttributes": {
+    // Other ports will be automatically forwarded, but without any
+    // notification. They will still appear in the "ports" tab of the Panel
+    // in VS Code.
+    "onAutoForward": "silent"
+  }
 
-	// Configure tool-specific properties.
-	// "customizations": {},
+  // Configure tool-specific properties.
+  // "customizations": {},
 }

.gitignore

@@ -13,3 +13,4 @@ frontend-v2/.next
 frontend-v2/out
 npm-debug.log
 server/src/__debug*
+node_modules/

.prettierignore

@@ -0,0 +1,9 @@
+frontend/external/**
+frontend/dist/**
+frontend/static/external/**
+frontend/package-lock.json
+frontend-v2/.next/**
+frontend-v2/pnpm-lock.yaml
+
+# Never formatted yet.
+server/

.prettierrc.json

@@ -0,0 +1,29 @@
+{
+  "trailingComma": "all",
+  "overrides": [
+    {
+      "files": ".vscode/*.json",
+      "options": {
+        "parser": "jsonc"
+      }
+    },
+    {
+      "files": "frontend/**",
+      "options": {
+        "arrowParens": "always",
+        "printWidth": 100,
+        "singleQuote": true
+      }
+    },
+    {
+      "files": "frontend-v2/**",
+      "options": {
+        "printWidth": 80,
+        "semi": false,
+        "singleQuote": true,
+        "tabWidth": 2,
+        "useTabs": false
+      }
+    }
+  ]
+}

.vscode/launch.json

@@ -1,66 +1,56 @@
 {
-    // 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": [
-        {
-            // Note: This configuration does not serve the front-end app, but
-            // compiles, watches for changes and recompiles it. The app is
-            // served via the Go server.
-            "name": "Launch Vue Frontend build watcher",
-            "request": "launch",
-            "runtimeArgs": [
-                "run-script",
-                "watch"
-            ],
-            "cwd": "${workspaceFolder}/frontend",
-            "runtimeExecutable": "npm",
-            "skipFiles": [
-                "<node_internals>/**"
-            ],
-            "type": "node",
-            "runtimeVersion": "16",
-        },
-        {
-            "name": "Launch React Frontend",
-            "request": "launch",
-            "runtimeArgs": [
-                "run-script",
-                "dev"
-            ],
-            "cwd": "${workspaceFolder}/frontend-v2",
-            "runtimeExecutable": "npm",
-            "skipFiles": [
-                "<node_internals>/**"
-            ],
-            "type": "node",
-            "runtimeVersion": "18",
-            "env": {
-                "NEXT_PUBLIC_API_BASE_URL": "http://localhost:8080",
-            }
-        },
-        {
-            // Warning: The Go server serves the Vue frontend files from the
-            // filesystem, but this launch configuration does not wait for
-            // the Vue frontend build watcher to finish the initial build.
-            // There may be a delay before the latest changes take effect.
-            "name": "Launch Go Server",
-            "type": "go",
-            "request": "launch",
-            "mode": "debug",
-            "program": "${workspaceFolder}/server/src/main.go",
-            "envFile": "${workspaceFolder}/server/debug.env"
-        }
-    ],
-    "compounds": [
-        {
-            "name": "Launch all",
-            "configurations": [
-                "Launch Go Server",
-                "Launch Vue Frontend build watcher",
-                "Launch React Frontend"
-            ]
-        }
-    ]
+  // 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": [
+    {
+      // Note: This configuration does not serve the front-end app, but
+      // compiles, watches for changes and recompiles it. The app is
+      // served via the Go server.
+      "name": "Launch Vue Frontend build watcher",
+      "request": "launch",
+      "runtimeArgs": ["run-script", "watch"],
+      "cwd": "${workspaceFolder}/frontend",
+      "runtimeExecutable": "npm",
+      "skipFiles": ["<node_internals>/**"],
+      "type": "node",
+      "runtimeVersion": "16",
+    },
+    {
+      "name": "Launch React Frontend",
+      "request": "launch",
+      "runtimeArgs": ["run-script", "dev"],
+      "cwd": "${workspaceFolder}/frontend-v2",
+      "runtimeExecutable": "npm",
+      "skipFiles": ["<node_internals>/**"],
+      "type": "node",
+      "runtimeVersion": "18",
+      "env": {
+        "NEXT_PUBLIC_API_BASE_URL": "http://localhost:8080",
+      },
+    },
+    {
+      // Warning: The Go server serves the Vue frontend files from the
+      // filesystem, but this launch configuration does not wait for
+      // the Vue frontend build watcher to finish the initial build.
+      // There may be a delay before the latest changes take effect.
+      "name": "Launch Go Server",
+      "type": "go",
+      "request": "launch",
+      "mode": "debug",
+      "program": "${workspaceFolder}/server/src/main.go",
+      "envFile": "${workspaceFolder}/server/debug.env",
+    },
+  ],
+  "compounds": [
+    {
+      "name": "Launch all",
+      "configurations": [
+        "Launch Go Server",
+        "Launch Vue Frontend build watcher",
+        "Launch React Frontend",
+      ],
+    },
+  ],
 }

.vscode/settings.json

@@ -1,18 +1,16 @@
 {
-    // Stop Makefile extension from asking about installing C++ tools when the
-    // project is opened.
-    "makefile.configureOnOpen": false,
-    "editor.formatOnSave": true,
-    "[typescriptreact]": {
-        "editor.defaultFormatter": "esbenp.prettier-vscode"
-    },
-    "[typescript]": {
-        "editor.defaultFormatter": "esbenp.prettier-vscode"
-    },
-    "[css]": {
-        "editor.defaultFormatter": "esbenp.prettier-vscode"
-    },
-    "[vue]": {
-        "editor.defaultFormatter": "esbenp.prettier-vscode"
-    }
+  // Stop Makefile extension from asking about installing C++ tools when the
+  // project is opened.
+  "makefile.configureOnOpen": false,
+  "editor.formatOnSave": true,
+  "editor.defaultFormatter": "esbenp.prettier-vscode",
+  "[go]": {
+    "editor.defaultFormatter": "golang.go",
+  },
+  "[dockerfile]": {
+    "editor.defaultFormatter": "ms-azuretools.vscode-docker",
+  },
+  // Ensures same settings are used by VS Code extension and CLI.
+  "prettier.requireConfig": true,
+  "prettier.prettierPath": "./frontend-v2/node_modules/prettier",
 }

Makefile

@@ -47,6 +47,7 @@ dev_db:
 
 # Install all deps for this project.
 deps:
+	. $(NVM_SCRIPT) && nvm install 22 && pnpm i
 	. $(NVM_SCRIPT) && cd frontend && nvm install 16 && npm i --legacy-peer-deps
 	. $(NVM_SCRIPT) && cd frontend-v2 && nvm install 18 && npm i -g pnpm && pnpm i
 	cd server/src && go get -t github.com/dxe/adb/...
@@ -85,5 +86,4 @@ prod_build:
 # Keep in sync with hooks/pre-commit.
 fmt:
 	cd server && gofmt -w `find . -name '*.go'`
-	cd frontend && npx prettier --write **/*.{ts,vue,js}
-	cd frontend-v2 && pnpm fmt
+	. $(NVM_SCRIPT) && nvm use 22 && pnpx prettier --write .

frontend-v2/eslint.config.mjs

@@ -1,11 +1,11 @@
-import { FlatCompat } from "@eslint/eslintrc";
+import { FlatCompat } from '@eslint/eslintrc'
 
 const compat = new FlatCompat({
   baseDirectory: import.meta.dirname,
-});
+})
 
 const eslintConfig = [
-  ...compat.extends("next/core-web-vitals", "next/typescript"),
-];
+  ...compat.extends('next/core-web-vitals', 'next/typescript'),
+]
 
-export default eslintConfig;
+export default eslintConfig

frontend-v2/package.json

@@ -6,8 +6,7 @@
     "dev": "next dev",
     "build": "next build",
     "start": "next start",
-    "lint": "next lint",
-    "fmt": "pnpm prettier --write **/*.{ts,tsx}"
+    "lint": "next lint"
   },
   "dependencies": {
     "@ebay/nice-modal-react": "^1.2.13",

frontend-v2/postcss.config.mjs

@@ -3,6 +3,6 @@ const config = {
   plugins: {
     tailwindcss: {},
   },
-};
+}
 
-export default config;
+export default config