Node/Yarn to Bun

.github/workflows/build-and-deploy-images.yaml

@@ -50,16 +50,14 @@ jobs:
         with:
           fetch-depth: 0 # to get all tags
 
-      - name: Set up Node
-        uses: actions/setup-node@v3
-        with:
-          node-version: "18"
+      - name: Set up Bun
+        uses: oven-sh/setup-bun@v1
 
       - name: Install packages
-        run: yarn install
+        run: bun install
 
       - name: Build app
-        run: yarn build
+        run: bun run build
 
       - name: Generate Image Tag for Frontend Dir
         id: get-tag

.github/workflows/test-frontend.yaml

@@ -12,130 +12,97 @@ defaults:
     working-directory: ./frontend
 
 jobs:
-  # build cache for rest of jobs
-  install-cache:
-    runs-on: ubuntu-latest
-    steps:
-      - name: Checkout code
-        uses: actions/checkout@v4
-
-      - name: Set up Node
-        uses: actions/setup-node@v4
-        with:
-          node-version: "18"
-
-      - name: Install packages
-        run: yarn install
-
-      - name: Install Playwright
-        run: npx playwright install
-
-      - name: Define cache key
-        id: define-key
-        run: echo "key=${{ hashFiles('frontend/yarn.lock') }}" >> $GITHUB_OUTPUT
-
-      - name: Store cache
-        uses: actions/cache@v4
-        with:
-          path: ${{ env.CACHE_PATH }}
-          key: ${{ steps.define-key.outputs.key }}
-
-    outputs:
-      cache-key: ${{ steps.define-key.outputs.key }}
-
   # test that app can build without issues
   test-build:
     runs-on: ubuntu-latest
-    needs: install-cache
     steps:
       - name: Checkout code
         uses: actions/checkout@v4
 
-      - name: Restore cache
-        uses: actions/cache@v4
-        with:
-          path: ${{ env.CACHE_PATH }}
-          key: ${{ needs.install-cache.outputs.cache-key }}
+      - name: Set up Bun
+        uses: oven-sh/setup-bun@v1
+
+      - name: Install packages
+        run: bun install
 
       - if: runner.debug == '1'
         uses: mxschmitt/action-tmate@v3
 
       - name: Run test
-        run: yarn build
+        run: bun run build
 
   # test that app has no typescript errors
   test-types:
     runs-on: ubuntu-latest
-    needs: install-cache
     steps:
       - name: Checkout code
         uses: actions/checkout@v4
 
-      - name: Restore cache
-        uses: actions/cache@v4
-        with:
-          path: ${{ env.CACHE_PATH }}
-          key: ${{ needs.install-cache.outputs.cache-key }}
+      - name: Set up Bun
+        uses: oven-sh/setup-bun@v1
+
+      - name: Install packages
+        run: bun install
 
       - if: runner.debug == '1'
         uses: mxschmitt/action-tmate@v3
 
       - name: Run test
-        run: yarn test:types
+        run: bun run test:types
 
   # test that app is properly formatted and linted
   test-lint:
     runs-on: ubuntu-latest
-    needs: install-cache
     steps:
       - name: Checkout code
         uses: actions/checkout@v4
 
-      - name: Restore cache
-        uses: actions/cache@v4
-        with:
-          path: ${{ env.CACHE_PATH }}
-          key: ${{ needs.install-cache.outputs.cache-key }}
+      - name: Set up Bun
+        uses: oven-sh/setup-bun@v1
+
+      - name: Install packages
+        run: bun install
 
       - if: runner.debug == '1'
         uses: mxschmitt/action-tmate@v3
 
       - name: Run test
-        run: yarn test:lint
+        run: bun run test:lint
 
   # run unit tests
   test-unit:
     runs-on: ubuntu-latest
-    needs: install-cache
     steps:
       - name: Checkout code
         uses: actions/checkout@v4
 
-      - name: Restore cache
-        uses: actions/cache@v4
-        with:
-          path: ${{ env.CACHE_PATH }}
-          key: ${{ needs.install-cache.outputs.cache-key }}
+      - name: Set up Bun
+        uses: oven-sh/setup-bun@v1
+
+      - name: Install packages
+        run: bun install
 
       - name: Run test
-        run: yarn test:unit
+        run: bun run test:unit
 
   # run end to end integration tests
   test-e2e:
     runs-on: ubuntu-latest
-    needs: install-cache
     steps:
       - name: Checkout code
         uses: actions/checkout@v4
 
-      - name: Restore cache
-        uses: actions/cache@v4
-        with:
-          path: ${{ env.CACHE_PATH }}
-          key: ${{ needs.install-cache.outputs.cache-key }}
+      - name: Set up Bun
+        uses: oven-sh/setup-bun@v1
+
+      - name: Install packages
+        run: bun install
+
+      - name: Install Playwright
+        run: bunx playwright install
 
       - if: runner.debug == '1'
         uses: mxschmitt/action-tmate@v3
 
       - name: Run test
-        run: yarn test:e2e
+        run: bun run test:e2e

Makefile

@@ -71,8 +71,8 @@ install-backend:
 .PHONY: install-frontend
 install-frontend:
 	cd frontend && \
-		yarn install && \
-		npx playwright install
+		bun install && \
+		bunx playwright install
 
 
 .PHONY: model
@@ -134,15 +134,15 @@ test-backend:
 .PHONY: test-frontend
 test-frontend: 
 	cd frontend && \
-		yarn test
+		bun run test
 
 
 ### Development ###
 
 .PHONY: dev-frontend
 dev-frontend: frontend/src/api/model.ts
 	cd frontend && \
-		VITE_API=local yarn dev
+		VITE_API=local bun run dev
 
 
 .PHONY: dev-api
@@ -190,7 +190,7 @@ lint: lint-frontend lint-backend
 .PHONY: lint-frontend
 lint-frontend: 
 	cd frontend && \
-		yarn test:lint
+		bun run test:lint
 
 
 .PHONY: lint-backend
@@ -212,4 +212,4 @@ format-backend:
 .PHONY: format-frontend
 format-frontend:
 	cd frontend && \
-		yarn lint
+		bun run lint

frontend/.eslintrc

@@ -0,0 +1,35 @@
+{
+  "root": true,
+  "extends": [
+    "plugin:vue/vue3-recommended",
+    "plugin:vuejs-accessibility/recommended",
+    "eslint:recommended",
+    "@vue/eslint-config-typescript",
+    "@vue/eslint-config-prettier/skip-formatting",
+  ],
+  "parserOptions": {
+    "ecmaVersion": "latest",
+  },
+  "rules": {
+    "prettier/prettier": "warn",
+    "vuejs-accessibility/anchor-has-content": [
+      "error",
+      {
+        "accessibleDirectives": ["tooltip"],
+      },
+    ],
+    "vuejs-accessibility/label-has-for": [
+      "error",
+      {
+        "controlComponents": ["AppInput"],
+        "required": {
+          "some": ["nesting", "id"],
+        },
+        "allowChildren": true,
+      },
+    ],
+    "vue/no-v-html": ["off"],
+    "vue/no-v-text-v-html-on-component": ["off"],
+    "vuejs-accessibility/mouse-events-have-key-events": ["off"],
+  },
+}