build: 🔧 migrate npm to pnpm

.github/workflows/main-ci.yml

@@ -16,11 +16,15 @@ jobs:
       - uses: actions/checkout@v4
       - name: Install Pre-commit
         run: pip install pre-commit
+      - name: Install pnpm
+        uses: pnpm/action-setup@v4
+        with:
+          version: 9
       - name: Install Prettier
-        working-directory: frontend
+        working-directory: ./frontend
         run: |
-          npm ci
-          npm run format-check
+          pnpm install --frozen-lockfile
+          pnpm run format-check
       - run: pre-commit run --all-files
 
   build-backend:
@@ -57,17 +61,22 @@ jobs:
           path: ./backend/coverage.xml
           publish: true
           threshold: 80
+          diff-storage: _xml_coverage_reports_backend
 
   test-frontend-format:
     name: Test Frontend Formatting
     runs-on: ubuntu-latest
     steps:
       - uses: actions/checkout@v4
+      - name: Install pnpm
+        uses: pnpm/action-setup@v4
+        with:
+          version: 9
       - name: Run Prettier check
-        working-directory: frontend
+        working-directory: ./frontend
         run: |
-          npm ci
-          npm run format-check
+          pnpm install --frozen-lockfile
+          pnpm run format-check
 
   test-e2e:
     name: Run E2E tests
@@ -80,13 +89,17 @@ jobs:
       - uses: actions/checkout@v3
       - name: Start stack using docker compose
         run: IMAGE_TAG=${{ needs.build-backend.outputs.image_tag }} docker compose -f docker-compose.yml -f docker-compose.ci.yml up -d
+      - name: Install pnpm
+        uses: pnpm/action-setup@v4
+        with:
+          version: 9
       - name: Cypress run
         uses: cypress-io/github-action@v6
         with:
           working-directory: ./frontend
-          build: npm run build
-          start: npm run start
-          command: npm run test:e2e-ci
+          build: pnpm run build
+          start: pnpm run start
+          command: pnpm run test:e2e-ci
       - name: Install pycobertura
         run: pip install pycobertura
       - name: Generate cobertura report
@@ -99,6 +112,7 @@ jobs:
           path: ./frontend/coverage/cobertura-coverage.xml
           publish: true
           threshold: 75
+          diff-storage: _xml_coverage_reports_frontend
       - name: Send artifacts
         uses: actions/upload-artifact@v3
         if: ${{ failure() }}

.pre-commit-config.yaml

@@ -14,6 +14,6 @@ repos:
     hooks:
     -   id: prettier
         name: prettier
-        entry: bash -c 'cd ./frontend && npm run format'
+        entry: bash -c 'cd ./frontend && pnpm run format'
         language: system
         files: ^frontend/

README.md

@@ -23,6 +23,7 @@ Dependancies:
 * make
 * docker
 * docker-compose
+* pnpm
 
 See also [Debugging](https://github.com/dnum-mi/Basegun/blob/develop/backend/README.md#debugging) section for all the env variables needed for the website to work fully operationally.
 ### Install
@@ -60,7 +61,7 @@ make down
 
 ## Testing the website like you were a police or gendarme user with Keycloak
 1. Set your User Agent to 'SAID'
-2. Click on the button 'Contacter un expert' on the result page or go to localhost:3000/expert-contact
+2. Click on the button 'Contacter un expert' on the result page or go to localhost:5173/expert-contact
 This will redirect you to a login page where you have two options :
 * If you want to test the police path, use `police` as username and `password` as password.
 * For the gendarmerie path, use `gendarmerie` as username and `password` as password.

frontend/Dockerfile

@@ -2,14 +2,16 @@ FROM node:20-slim AS base
 
 WORKDIR /app
 
-COPY ./package.json ./package-lock.json ./
-RUN npm ci
+RUN npm install -g pnpm
+
+COPY ./package.json ./ ./pnpm-lock.yaml ./
+RUN pnpm install --frozen-lockfile
 
 COPY . .
 
 FROM base AS build
 
-RUN npm run build
+RUN pnpm run build
 
 FROM nginxinc/nginx-unprivileged:1.24-alpine AS prod
 

frontend/README.md

@@ -3,18 +3,18 @@
 ## How to run ?
 
 ```bash
-npm install
-npm run start
+pnpm install
+pnpm run start
 ```
 
 ## How to run automated tests ?
 
 1. Make sure the bakend stack is running by running `docker compose up -d` in the backend folder.
-2. Make sure all the dependencies are installed by running `npm install` in the frontend folder.
-3. Make sure the frontend is running : `npm run start`
+2. Make sure all the dependencies are installed by running `pnpm install` in the frontend folder.
+3. Make sure the frontend is running : `pnpm run start`
 
 ```bash
-npm run test:e2e-ci
+pnpm run test:e2e-ci
 ```
 
 ## How to check code coverage ?