Add required variables for Nuxt Sentry setup (#5284)

* Add required variables

* Try another setup

* Try another setup

* Use unstable_sentryBundlerPluginOptions

* Remove checkout and change secret setup

* Remove checkout and change secret setup

* Change secret setup

* Remove logging

* Make the Sentry release conditional

* Try setting auth token in nuxt config

* debug

* Remove locale setup from setup-env

* Check if auth token works as an env variable without file

* Check if auth token works as an env variable without file

* Set token secret conditionally

* Test if conditional setting works by inverting condition

* Correct secret setup

* Re-add locale setup to nuxt-load-test

* Revert locales changes and remove i18n from Dockerfile

* Fix conditional for secret

.github/workflows/ci_cd.yml

@@ -181,6 +181,9 @@ jobs:
       - name: Build image `${{ matrix.image }}`
         uses: docker/build-push-action@v6
         with:
+          # The Sentry auth token is only set for the production release of the frontend (on push to main or manual release).
+          secrets: |
+            ${{ matrix.image == 'frontend' && ((github.event_name == 'push' && github.repository == 'WordPress/openverse') || (github.event_name == 'workflow_dispatch' && inputs.perform_deploy)) && format('sentry_auth_token={0}', secrets.SENTRY_AUTH_TOKEN) || '' }}
           context: ${{ matrix.context }}
           target: ${{ matrix.target }}
           push: false
@@ -191,7 +194,6 @@ jobs:
           outputs: type=docker,dest=/tmp/${{ matrix.image }}.tar
           build-contexts: ${{ matrix.build-contexts }}
           build-args: |
-            SENTRY_AUTH_TOKEN=${{ secrets.SENTRY_AUTH_TOKEN }}
             SEMANTIC_VERSION=${{ needs.get-image-tag.outputs.image_tag }}
             OV_PDM_VERSION=${{ steps.prepare-build-args.outputs.ov_pdm_version }}
             CATALOG_PY_VERSION=${{ steps.prepare-build-args.outputs.catalog_py_version }}
@@ -798,7 +800,6 @@ jobs:
         with:
           setup_python: false
           install_recipe: node-install
-          locales: "test"
 
       - name: Run check recipe
         run: just ${{ matrix.recipe }}

frontend/Dockerfile

@@ -10,6 +10,8 @@ ARG FRONTEND_NODE_VERSION
 
 FROM docker.io/node:${FRONTEND_NODE_VERSION}-alpine AS builder
 
+ARG SEMANTIC_VERSION
+
 # Install system packages needed to build on macOS
 RUN apk add --no-cache --virtual .gyp python3 make g++ \
   && corepack enable pnpm
@@ -35,16 +37,25 @@ ENV SKIP_PRE_COMMIT=true
 # Get rid of the lockfile as it won't be accurate for the build without workspace.
 # Then install dependencies, and in the process:
 #   - fix the missing lockfile by writing a new one
-RUN pnpm install && pnpm i18n
+RUN pnpm install
 
 # disable telemetry when building the app
 ENV NUXT_TELEMETRY_DISABLED=1
 ENV NODE_ENV=production
 
 # Increase memory limit for the build process (necessary for i18n routes)
 ENV NODE_OPTIONS="--max_old_space_size=4096"
+ENV SEMANTIC_VERSION=${SEMANTIC_VERSION}
+
+# Use the Sentry auth token secret to send the sourcemaps to Sentry only if the secret is provided
+RUN --mount=type=secret,id=sentry_auth_token,mode=0444 \
+    sh -c 'if [ -f /run/secrets/sentry_auth_token ]; then \
+      SENTRY_AUTH_TOKEN="$(cat /run/secrets/sentry_auth_token)"; \
+      echo "Using Sentry Auth Token: $SENTRY_AUTH_TOKEN"; \
+    else \
+      echo "No Sentry Auth Token provided"; \
+    fi' && pnpm build
 
-RUN pnpm build
 
 ############
 # Nuxt app #

frontend/nuxt.config.ts

@@ -131,6 +131,16 @@ export default defineNuxtConfig({
     sourceMapsUploadOptions: {
       org: "openverse",
       project: "openverse-frontend",
+      /**
+       * This token is only used in the CI to upload source maps to Sentry when building the production
+       * image of the frontend.
+       */
+      authToken: process.env.SENTRY_AUTH_TOKEN,
+    },
+    unstable_sentryBundlerPluginOptions: {
+      release: {
+        name: process.env.SEMANTIC_VERSION,
+      },
     },
   },
   sourcemap: {

frontend/package.json

@@ -7,9 +7,9 @@
   "scripts": {
     "predev": "pnpm install && pnpm i18n:en",
     "dev": "run-p dev:only 'i18n:en --watch'",
-    "dev:only": "nuxt dev --host 0.0.0.0",
+    "dev:only": "npx nuxi dev --host 0.0.0.0",
     "dev:secure": "LOCAL_SSL=enabled pnpm dev",
-    "build": "NODE_ENV=production nuxt build",
+    "build": "npx nuxi build",
     "build:clean": "rm -rf .nuxt",
     "docker:build": "docker build . -t openverse-frontend:latest",
     "docker:run": "docker run --rm -it -p 127.0.0.1:8443:8443/tcp openverse-frontend:latest",

justfile

@@ -48,7 +48,6 @@ node-install:
     pnpm i
     pnpm --filter './packages/js/*' run build
     pnpm prepare:nuxt
-    just frontend/run i18n:en
 
 
 # Set up locales for the frontend