prettier improvements

.prettierignore

@@ -1,32 +0,0 @@
-# Logs
-logs
-*.log
-npm-debug.log*
-yarn-debug.log*
-yarn-error.log*
-pnpm-debug.log*
-lerna-debug.log*
-
-node_modules
-dist
-dist-ssr
-*.local
-
-# Editor directories and files
-.vscode/*
-!.vscode/extensions.json
-.idea
-.DS_Store
-*.suo
-*.ntvs*
-*.njsproj
-*.sln
-*.sw?
-
-# PWA dev stuff
-dev-dist
-.solid
-/test-results/
-/tests-examples/
-/playwright-report/
-/playwright/.cache/

.prettierrc

@@ -1,9 +0,0 @@
-{
-  "trailingComma": "none",
-  "tabWidth": 4,
-  "semi": true,
-  "singleQuote": false,
-  "arrowParens": "always",
-  "printWidth": 80,
-  "useTabs": false
-}

package.json

@@ -12,13 +12,14 @@
         "check-types": "tsc --noemit",
         "eslint": "eslint src",
         "lint": "pnpm run eslint && pnpm run check-types",
-        "format": "npx prettier --write \"src/**/*.{ts,tsx,js,jsx,json,css,scss,md}\"",
+        "format": "prettier --write \"src/**/*.{ts,tsx,js,jsx,json,css,scss,md}\"",
-        "check-format": "npx prettier --check \"src/**/*.{ts,tsx,js,jsx,json,css,scss,md}\""
+        "check-format": "prettier --check \"src/**/*.{ts,tsx,js,jsx,json,css,scss,md}\""
     },
     "type": "module",
     "devDependencies": {
         "@capacitor/assets": "^2.0.4",
         "@capacitor/cli": "^5.2.2",
+        "@ianvs/prettier-plugin-sort-imports": "^4.1.0",
         "@playwright/test": "^1.36.2",
         "@types/node": "^18.17.1",
         "@typescript-eslint/eslint-plugin": "^6.2.0",
@@ -31,7 +32,8 @@
         "eslint-plugin-prettier": "4.2.1",
         "eslint-plugin-solid": "0.11.0",
         "postcss": "^8.4.27",
-        "prettier": "^2.8.8",
+        "prettier": "^3.0.2",
+        "prettier-plugin-tailwindcss": "^0.5.3",
         "solid-start-node": "^0.2.29",
         "tailwindcss": "^3.3.3",
         "typescript": "^5.1.6",

pnpm-lock.yaml

@@ -78,6 +78,9 @@ importers:
       '@capacitor/cli':
         specifier: ^5.2.2
         version: 5.2.2
+      '@ianvs/prettier-plugin-sort-imports':
+        specifier: ^4.1.0
+        version: 4.1.0(prettier@3.0.2)
       '@playwright/test':
         specifier: ^1.36.2
         version: 1.36.2
@@ -107,7 +110,7 @@ importers:
         version: 2.27.5(@typescript-eslint/parser@6.2.0)(eslint-import-resolver-typescript@2.7.1)(eslint@8.46.0)
       eslint-plugin-prettier:
         specifier: 4.2.1
-        version: 4.2.1(eslint@8.46.0)(prettier@2.8.8)
+        version: 4.2.1(eslint@8.46.0)(prettier@3.0.2)
       eslint-plugin-solid:
         specifier: 0.11.0
         version: 0.11.0(eslint@8.46.0)(typescript@5.1.6)
@@ -115,8 +118,11 @@ importers:
         specifier: ^8.4.27
         version: 8.4.27
       prettier:
-        specifier: ^2.8.8
+        specifier: ^3.0.2
-        version: 2.8.8
+        version: 3.0.2
+      prettier-plugin-tailwindcss:
+        specifier: ^0.5.3
+        version: 0.5.3(@ianvs/prettier-plugin-sort-imports@4.1.0)(prettier@3.0.2)
       solid-start-node:
         specifier: ^0.2.29
         version: 0.2.29(solid-start@0.2.29)(undici@5.22.1)(vite@4.4.7)
@@ -2101,6 +2107,26 @@ packages:
     engines: {node: '>=6.9.0'}
     dev: true
 
+  /@ianvs/prettier-plugin-sort-imports@4.1.0(prettier@3.0.2):
+    resolution: {integrity: sha512-IAXeTLU24k6mRPa6mFbW1qZJ/j0m3OeH44wyijWyr+YqqdNtBnfHxAntOAATS9iDfrT01NesKGsdzqnXdDQa/A==}
+    peerDependencies:
+      '@vue/compiler-sfc': '>=3.0.0'
+      prettier: 2 || 3
+    peerDependenciesMeta:
+      '@vue/compiler-sfc':
+        optional: true
+    dependencies:
+      '@babel/core': 7.22.10
+      '@babel/generator': 7.22.10
+      '@babel/parser': 7.22.10
+      '@babel/traverse': 7.22.10
+      '@babel/types': 7.22.10
+      prettier: 3.0.2
+      semver: 7.5.4
+    transitivePeerDependencies:
+      - supports-color
+    dev: true
+
   /@internationalized/date@3.4.0:
     resolution: {integrity: sha512-QUDSGCsvrEVITVf+kv9VSAraAmCgjQmU5CiXtesUBBhBe374NmnEIIaOFBZ72t29dfGMBP0zF+v6toVnbcc6jg==}
     dependencies:
@@ -2490,7 +2516,7 @@ packages:
     resolution: {integrity: sha512-UWRmygBsyj4bVXvDiqSccwT1kmsorcwQwaIy30yVh8T+Gspx4OlC0shX1y+ZuwXZvgnafmpRYKks0bAu9urJew==}
     dependencies:
       '@xml-tools/parser': 1.0.11
-      prettier: 2.8.8
+      prettier: 3.0.2
     dev: true
 
   /@radix-ui/number@1.0.1:
@@ -7678,7 +7704,7 @@ packages:
       eslint-import-resolver-webpack:
         optional: true
     dependencies:
-      '@typescript-eslint/parser': 6.2.0(eslint@8.46.0)(typescript@5.1.6)
+      '@typescript-eslint/parser': 6.2.0(eslint@8.46.0)(typescript@4.9.5)
       debug: 3.2.7(supports-color@5.5.0)
       eslint: 8.46.0
       eslint-import-resolver-node: 0.3.9
@@ -7697,7 +7723,7 @@ packages:
       '@typescript-eslint/parser':
         optional: true
     dependencies:
-      '@typescript-eslint/parser': 6.2.0(eslint@8.46.0)(typescript@5.1.6)
+      '@typescript-eslint/parser': 6.2.0(eslint@8.46.0)(typescript@4.9.5)
       array-includes: 3.1.6
       array.prototype.flat: 1.3.1
       array.prototype.flatmap: 1.3.1
@@ -7736,6 +7762,22 @@ packages:
       prettier-linter-helpers: 1.0.0
     dev: true
 
+  /eslint-plugin-prettier@4.2.1(eslint@8.46.0)(prettier@3.0.2):
+    resolution: {integrity: sha512-f/0rXLXUt0oFYs8ra4w49wYZBG5GKZpAYsJSm6rnYL5uVDjd+zowwMwVZHnAjf4edNrKpCDYfXDgmRE/Ak7QyQ==}
+    engines: {node: '>=12.0.0'}
+    peerDependencies:
+      eslint: '>=7.28.0'
+      eslint-config-prettier: '*'
+      prettier: '>=2.0.0'
+    peerDependenciesMeta:
+      eslint-config-prettier:
+        optional: true
+    dependencies:
+      eslint: 8.46.0
+      prettier: 3.0.2
+      prettier-linter-helpers: 1.0.0
+    dev: true
+
   /eslint-plugin-solid@0.11.0(eslint@8.46.0)(typescript@4.9.5):
     resolution: {integrity: sha512-3ve6IpEtl8nOvJnjaJACqlBmv449l6dMMhMczjQWvvLlRqkzLemgsJ9H+Isu8GLSBTNxDIm5oSKx/lO2j8vKbA==}
     engines: {node: '>=12.0.0'}
@@ -10578,12 +10620,74 @@ packages:
       fast-diff: 1.3.0
     dev: true
 
+  /prettier-plugin-tailwindcss@0.5.3(@ianvs/prettier-plugin-sort-imports@4.1.0)(prettier@3.0.2):
+    resolution: {integrity: sha512-M5K80V21yM+CTm/FEFYRv9/9LyInYbCSXpIoPAKMm8zy89IOwdiA2e4JVbcO7tvRtAQWz32zdj7/WKcsmFyAVg==}
+    engines: {node: '>=14.21.3'}
+    peerDependencies:
+      '@ianvs/prettier-plugin-sort-imports': '*'
+      '@prettier/plugin-pug': '*'
+      '@shopify/prettier-plugin-liquid': '*'
+      '@shufo/prettier-plugin-blade': '*'
+      '@trivago/prettier-plugin-sort-imports': '*'
+      prettier: ^3.0
+      prettier-plugin-astro: '*'
+      prettier-plugin-css-order: '*'
+      prettier-plugin-import-sort: '*'
+      prettier-plugin-jsdoc: '*'
+      prettier-plugin-marko: '*'
+      prettier-plugin-organize-attributes: '*'
+      prettier-plugin-organize-imports: '*'
+      prettier-plugin-style-order: '*'
+      prettier-plugin-svelte: '*'
+      prettier-plugin-twig-melody: '*'
+    peerDependenciesMeta:
+      '@ianvs/prettier-plugin-sort-imports':
+        optional: true
+      '@prettier/plugin-pug':
+        optional: true
+      '@shopify/prettier-plugin-liquid':
+        optional: true
+      '@shufo/prettier-plugin-blade':
+        optional: true
+      '@trivago/prettier-plugin-sort-imports':
+        optional: true
+      prettier-plugin-astro:
+        optional: true
+      prettier-plugin-css-order:
+        optional: true
+      prettier-plugin-import-sort:
+        optional: true
+      prettier-plugin-jsdoc:
+        optional: true
+      prettier-plugin-marko:
+        optional: true
+      prettier-plugin-organize-attributes:
+        optional: true
+      prettier-plugin-organize-imports:
+        optional: true
+      prettier-plugin-style-order:
+        optional: true
+      prettier-plugin-svelte:
+        optional: true
+      prettier-plugin-twig-melody:
+        optional: true
+    dependencies:
+      '@ianvs/prettier-plugin-sort-imports': 4.1.0(prettier@3.0.2)
+      prettier: 3.0.2
+    dev: true
+
   /prettier@2.8.8:
     resolution: {integrity: sha512-tdN8qQGvNjw4CHbY+XXk0JgCXn9QiF21a55rBe5LJAU+kDyC4WQn4+awm2Xfk2lQMk5fKup9XgzTZtGkjBdP9Q==}
     engines: {node: '>=10.13.0'}
     hasBin: true
     dev: true
 
+  /prettier@3.0.2:
+    resolution: {integrity: sha512-o2YR9qtniXvwEZlOKbveKfDQVyqxbEIWn48Z8m3ZJjBjcCmUy3xZGIv+7AkaeuaTr6yPXJjwv07ZWlsWbEy1rQ==}
+    engines: {node: '>=14'}
+    hasBin: true
+    dev: true
+
   /pretty-bytes@5.6.0:
     resolution: {integrity: sha512-FFw039TmrBqFK8ma/7OL3sDz/VytdtJr044/QUJtH0wK9lb9jLq9tJyIxUwtQJHwar2BqtiA4iCWSwo9JLkzFg==}
     engines: {node: '>=6'}

prettier.config.mjs

@@ -0,0 +1,19 @@
+/** @type {import("prettier").Options} */
+export default {
+  trailingComma: "none",
+  tabWidth: 4,
+  semi: true,
+  singleQuote: false,
+  arrowParens: "always",
+  printWidth: 80,
+  useTabs: false,
+
+  plugins: [
+    "@ianvs/prettier-plugin-sort-imports",
+    "prettier-plugin-tailwindcss", // MUST come last
+  ],
+
+  tailwindFunctions: ["classList"],
+
+  importOrder: ["<THIRD_PARTY_MODULES>", "", "^[~/]", "", "^[./]"],
+};