Vf 144 update dependencies (#277)

* feat: 🔧 change package manager to pnpm

* chore: 🔧 update linting rules

* style: 🎨 format code

* ci: 👷 update github actions

* ci: 💚 fix github actions

* revert: 🔥 remove build artifacts

* chore: 🔧 fix config

* fix: 🚨 fix lint

* fix: 🐛 fix import

* chore: 🔧 update package.json

remove package manager setting

* chore: ➕ add biome

* chore: 🔧 update biome config

import/migrate linting rules from eslint and formatting rules from prettier

* chore: 🔨 update scripts

replace eslint & prettier with biome in lint and format scripts. Add "check" script which both lints and formats. All scripts apply safe fixed

* style: 🚨 format and lint all files

* chore: 🔧 move scope settings to biome config

* style: 🎨 format config files

* chore: ✏️ fix script

* fix: 🚨 fix lint errors

* ci: 👷 update github actions

Optimize biome job

* chore: ➖ remove eslint & prettier

* chore: ⬆️ update node

* chore: ⬆️ update react to 18

* chore: ➖ remove react-scripts

* chore: ⬆️ upgrade vite

* chore: 🔧 convert repo to module with esm

* chore: ⬆️ upgrade vitest

* refactor: ♻️ update import aliasing with modern vite

Remove vite-plugin-svgr & vite-tsconfig-paths. Configure import aliasing in tsconfig and vite.config. Temporary solution, as baseUrl was ./src, therefore absolute paths resolved to src. Migrate to @/**/* to correspond to ./src/**/*.

* chore: ⬆️ upgrade typescript

* chore: 📌 lock dependency versions

* ci: 💚 pin node to an existing version

* chore: 🔧 remove conflicting vite version

* chore: 🧑‍💻 add extension recommendations

* refactor: 🚚 rename github action

* chore: 🔧 ignore hidden folders on linting

* refactor: 🔥 remove dead code

* refactor: 🚚 move TextPictureCard to components

* chore: 🔧 add @ as import alias

* chore: ➖ remove unused vite plugins

.github/workflows/node.js.yml → .github/workflows/code-quality-check.yml

@@ -1,10 +1,10 @@
 # This workflow will do a clean install of node dependencies, build the source code and run tests across different versions of node
 # For more information see: https://help.github.com/actions/language-and-framework-guides/using-nodejs-with-github-actions
 
-name: Node.js Build CI
+name: Code Quality Check
 
 env:
-  NODE_VERSION: 16.14.2
+  NODE_VERSION: 20.12.2
 
 on:
   push:

.vscode/extensions.json

@@ -0,0 +1,36 @@
+{
+  "recommendations": [
+    // Conventional Commits
+    // Helps with writing commit messages
+    "vivaxy.vscode-conventional-commits",
+    // Github Actions
+    "github.vscode-github-actions",
+    // Github Copilot
+    "GitHub.copilot",
+    // GitHub Pull Requests and Issues
+    "GitHub.vscode-pull-request-github",
+    // GitLens
+    "eamodio.gitlens",
+    // Live Share
+    "ms-vsliveshare.vsliveshare",
+    // Vitest
+    "vitest.explorer",
+    // YAML
+    "redhat.vscode-yaml",
+    // Material Icon Theme
+    "PKief.material-icon-theme",
+
+    // Biome
+    // for linting and formatting
+    "biomejs.biome",
+    // Pretty TypeScript Errors
+    "YoavBls.pretty-ts-errors",
+    // Tailwind CSS IntelliSense
+    "bradlc.vscode-tailwindcss",
+    // npm Intellisense
+    "christian-kohler.npm-intellisense",
+
+    // Playwright Test for VS Code
+    "ms-playwright.playwright"
+  ]
+}

biome.json

@@ -2,7 +2,7 @@
   "$schema": "https://biomejs.dev/schemas/1.7.1/schema.json",
   "files": {
     "include": ["**/*.js", "**/*.jsx", "**/*.ts", "**/*.tsx", "**/*.json"],
-    "ignore": ["node_modules", "build"]
+    "ignore": ["node_modules", "build", ".vscode", ".github"]
   },
   "formatter": {
     "enabled": true,

package.json

@@ -2,32 +2,34 @@
   "name": "vektor-frontend",
   "version": "0.1.0",
   "private": true,
+  "type": "module",
   "dependencies": {
     "@fortawesome/fontawesome-svg-core": "^6.5.2",
     "@fortawesome/free-brands-svg-icons": "^6.5.2",
     "@fortawesome/free-solid-svg-icons": "^6.5.2",
     "@fortawesome/react-fontawesome": "^0.2.0",
-    "@types/node": "^16.18.96",
-    "@types/react": "^17.0.80",
-    "@types/react-dom": "^17.0.25",
+    "@types/node": "^20.12.2",
+    "@types/react": "^18.2.79",
+    "@types/react-dom": "^18.2.25",
     "autoprefixer": "^10.4.19",
     "daisyui": "^2.52.0",
     "dayjs": "^1.11.10",
+    "node": "^20.12.2",
     "norwegian-utils": "^0.4.1",
     "postcss": "^8.4.38",
     "postcss-import": "^15.1.0",
     "quill-image-resize-module-react": "^3.0.0",
     "quill-image-uploader": "^1.3.0",
-    "react": "^17.0.2",
-    "react-dom": "^17.0.2",
+    "react": "^18.2.0",
+    "react-dom": "^18.2.0",
     "react-hook-form": "^7.51.3",
     "react-quill": "^2.0.0",
     "react-remove-scroll": "^2.5.9",
     "react-router-dom": "^6.23.0",
-    "react-scripts": "5.0.1",
     "react-tailwindcss-datepicker": "^1.6.6",
     "tailwindcss": "^3.4.3",
-    "typescript": "^4.9.5",
+    "typescript": "^5.4.5",
+    "vite": "^5.2.10",
     "web-vitals": "^2.1.4"
   },
   "scripts": {
@@ -42,7 +44,11 @@
     "format": "biome format ./ --apply"
   },
   "browserslist": {
-    "production": [">0.2%", "not dead", "not op_mini all"],
+    "production": [
+      ">0.2%",
+      "not dead",
+      "not op_mini all"
+    ],
     "development": [
       "last 1 chrome version",
       "last 1 firefox version",
@@ -55,12 +61,10 @@
     "@testing-library/react": "^14.3.1",
     "@testing-library/user-event": "^14.5.2",
     "@types/jest": "^29.5.12",
-    "@vitejs/plugin-react": "^3.1.0",
+    "@vitejs/plugin-react": "^4.2.1",
     "cypress": "12.8.1",
     "vite": "^3.1.0",
-    "vite-plugin-svgr": "^2.2.1",
-    "vite-tsconfig-paths": "^3.5.0",
-    "vitest": "^0.29.0"
+    "vitest": "^1.5.1"
   },
   "packageManager": "[email protected]"
 }