Add GitHub Actions Workflow

.github/actions/cached-deps/action.yml

@@ -0,0 +1,30 @@
+name: "Get & Cache Dependencies"
+description: "Get the dependencies (via npm) and cache them for later use."
+inputs:
+  caching:
+    description: "Whether to cache the dependencies or not."
+    required: false
+    default: "true"
+outputs:
+  used-cache:
+    description: "Whether the cache was used or not."
+    value: ${{ steps.set-output.outputs.used-cache }}
+runs:
+  using: "composite"
+  steps:
+    - name: Cache dependencies
+      uses: actions/cache@v4
+      if: inputs.caching == 'true'
+      id: cache
+      with:
+        path: node_modules
+        key: deps-node-modules-${{ hashFiles('**/package-lock.json') }}
+    - name: Install dependencies
+      id: install
+      if: steps.cache.outputs.cache-hit != 'true' || inputs.caching != 'true'
+      shell: bash
+      run: npm ci
+    - name: Set output
+      id: set-output
+      shell: bash
+      run: echo "used-cache='${{ steps.cache.outputs.cache-hit }}'" >> $GITHUB_OUTPUT

.github/workflows/build.yml

@@ -0,0 +1,65 @@
+name: Test and Build the Application
+on:
+  push:
+    branches:
+      - main
+  pull_request:
+    branches:
+      - main
+jobs:
+  lint:
+    runs-on: ubuntu-latest
+    steps:
+      - name: Checkout the code
+        uses: actions/checkout@v4
+      - name: Set up Node.js
+        uses: actions/setup-node@v4
+        with:
+          node-version: "20.11.1"
+      - name: Load & cache dependencies
+        uses: ./.github/actions/cached-deps
+      - name: Run the linter
+        run: npm run lint -- --max-warnings=0
+  test:
+    runs-on: ubuntu-latest
+    steps:
+      - name: Checkout the code
+        uses: actions/checkout@v4
+      - name: Set up Node.js
+        uses: actions/setup-node@v4
+        with:
+          node-version: "20.11.1"
+      - name: Load & cache dependencies
+        uses: ./.github/actions/cached-deps
+      - name: Run tests
+        run: npm test
+  build:
+    runs-on: ubuntu-latest
+    needs: test
+    steps:
+      - name: Checkout the code
+        uses: actions/checkout@v4
+      - name: Set up Node.js
+        uses: actions/setup-node@v4
+        with:
+          node-version: "20.11.1"
+      - name: Load & cache dependencies
+        uses: ./.github/actions/cached-deps
+        id: chached-deps
+      - name: Build the application
+        run: npm run build
+      - name: Upload artifacts
+        if: success()
+        uses: actions/upload-artifact@v4
+        with:
+          name: dist-files
+          path: dist
+  report:
+    runs-on: ubuntu-latest
+    needs: [lint, build]
+    if: failure()
+    steps:
+      - name: Output information
+        run: |
+          echo "Something went wrong!"
+          echo "${{ toJson(github)}}"

.vscode/settings.json

@@ -5,6 +5,10 @@
   "material-icon-theme.files.associations": {
     ".tool-versions": "nodejs_alt"
   },
+  "material-icon-theme.folders.associations": {
+    "actions": "gh-workflows",
+    "cached-deps": "temp"
+  },
   "tailwindCSS.experimental.classRegex": [
     ["[cC]lasses\\s*\\+?=\\s*([^;]*);", "'([^']*)'"],
     ["[cC]lasses\\s*\\+?=\\s*([^;]*);", "\"([^\"]*)\""],

src/pages/AuthenticationPage.test.tsx

@@ -2,6 +2,9 @@ import { render, screen } from "@testing-library/react";
 
 import AuthenticationPage from "./AuthenticationPage";
 
+vi.mock("firebase/auth");
+vi.mock("@/utils/firebase");
+
 test("should render the sign in form", function () {
   render(<AuthenticationPage />);
   expect(screen.getByRole("heading", { name: /sign in/i })).toBeInTheDocument();