discord · somethingnew2-0 · Aug 15, 2025 · Aug 4, 2025 · Aug 4, 2025 · Aug 4, 2025
diff --git a/.env.production.example b/.env.production.example
@@ -6,7 +6,7 @@ OKTA_DOMAIN=<YOUR_OKTA_DOMAIN>
 OKTA_API_TOKEN=<YOUR_OKTA_API_TOKEN>
 DATABASE_URI=<YOUR_DATABASE_URI>
 CLIENT_ORIGIN_URL=http://localhost:3000
-REACT_APP_API_SERVER_URL=""
+VITE_API_SERVER_URL=""
 FLASK_SENTRY_DSN=https://<key>@sentry.io/<project>
 REACT_SENTRY_DSN=https://<key>@sentry.io/<project>
 CLOUDFLARE_TEAM_DOMAIN=<CLOUDFLARE_ACCESS_TEAM_DOMAIN>

diff --git a/.github/workflows/docker-image.yml b/.github/workflows/docker-image.yml
@@ -48,4 +48,6 @@ jobs:
             SENTRY_RELEASE=${{ github.sha }}
             PUSH_SENTRY_RELEASE=true
           secrets: |
-            "SENTRY_CLI_RC=${{ secrets.SENTRY_CLI_RC }}"
+            "SENTRY_ORG=${{ secrets.SENTRY_ORG }}"
+            "SENTRY_PROJECT=${{ secrets.SENTRY_PROJECT }}"
+            "SENTRY_AUTH_TOKEN=${{ secrets.SENTRY_AUTH_TOKEN }}"
diff --git a/Dockerfile b/Dockerfile
@@ -4,30 +4,34 @@ ARG PUSH_SENTRY_RELEASE="false"
 
 # Build step #1: build the React front end
 FROM node:22-alpine AS build-step
-ARG SENTRY_RELEASE=""
 WORKDIR /app
 ENV PATH=/app/node_modules/.bin:$PATH
-COPY craco.config.js package.json package-lock.json tsconfig.json tsconfig.paths.json .env.production* ./
+COPY index.html package.json package-lock.json tsconfig.json tsconfig.paths.json vite.config.ts .env.production* ./
 COPY ./src ./src
 COPY ./public ./public
 COPY ./config ./config
 
 RUN npm install
 RUN touch .env.production
-ENV REACT_APP_SENTRY_RELEASE=$SENTRY_RELEASE
-ENV REACT_APP_API_SERVER_URL=""
+# Set Vite environment variables
+ENV VITE_API_SERVER_URL=""
+# Set Sentry plugin environment variables for production build
+ENV NODE_ENV=production
 RUN npm run build
 
-# Optional build step #2: upload the source maps by pushing a release to sentry
-FROM getsentry/sentry-cli:2 AS sentry
+# Optional build step #2: upload source maps to Sentry
+FROM build-step AS sentry
 ARG SENTRY_RELEASE=""
-RUN --mount=type=secret,id=SENTRY_CLI_RC \
-  cp /run/secrets/SENTRY_CLI_RC ~/.sentryclirc
-WORKDIR /app
-COPY --from=build-step /app/build ./build
-RUN sentry-cli releases new ${SENTRY_RELEASE}
-RUN sentry-cli releases files ${SENTRY_RELEASE} upload-sourcemaps /app/build/static/js
-RUN sentry-cli releases finalize ${SENTRY_RELEASE}
+ENV SENTRY_RELEASE=$SENTRY_RELEASE
+# Use secret mount for SENTRY_AUTH_TOKEN, SENTRY_ORG, SENTRY_PROJECT
+RUN --mount=type=secret,id=SENTRY_AUTH_TOKEN \
+  --mount=type=secret,id=SENTRY_ORG \
+  --mount=type=secret,id=SENTRY_PROJECT \
+  SENTRY_AUTH_TOKEN=$(cat /run/secrets/SENTRY_AUTH_TOKEN) \
+  SENTRY_ORG=$(cat /run/secrets/SENTRY_ORG) \
+  SENTRY_PROJECT=$(cat /run/secrets/SENTRY_PROJECT) \
+  npm run build
+# Source maps are automatically uploaded and deleted by Vite Sentry plugin during build
 RUN touch sentry
 
 # Build step #3: build the API with the client as static files
@@ -36,7 +40,6 @@ ARG SENTRY_RELEASE=""
 WORKDIR /app
 COPY --from=build-step /app/build ./build
 
-RUN rm ./build/static/js/*.map
 RUN mkdir ./api && mkdir ./migrations
 COPY requirements.txt api/ ./api/
 COPY migrations/ ./migrations/

diff --git a/craco.config.js b/craco.config.js
diff --git a/public/index.html → index.html b/public/index.html → index.html
@@ -2,25 +2,16 @@
 <html lang="en">
   <head>
     <meta charset="utf-8" />
-    <link rel="icon" href="%PUBLIC_URL%/favicon.ico" />
+    <link rel="icon" href="/favicon.ico" />
     <meta name="viewport" content="width=device-width, initial-scale=1" />
     <meta name="theme-color" content="#000000" />
     <meta name="description" content="Access!" />
-    <link rel="apple-touch-icon" href="%PUBLIC_URL%/logo192.png" />
+    <link rel="apple-touch-icon" href="/logo192.png" />
     <!--
       manifest.json provides metadata used when your web app is installed on a
       user's mobile device or desktop. See https://developers.google.com/web/fundamentals/web-app-manifest/
     -->
-    <link rel="manifest" href="%PUBLIC_URL%/manifest.json" />
-    <!--
-      Notice the use of %PUBLIC_URL% in the tags above.
-      It will be replaced with the URL of the `public` folder during the build.
-      Only files inside the `public` folder can be referenced from the HTML.
-
-      Unlike "/favicon.ico" or "favicon.ico", "%PUBLIC_URL%/favicon.ico" will
-      work correctly both with client-side routing and a non-root public URL.
-      Learn how to configure a non-root public URL by running `npm run build`.
-    -->
+    <link rel="manifest" href="/manifest.json" />
     <title>Access</title>
     <!-- Fonts to support Material Design -->
     <link
@@ -41,5 +32,6 @@
       To begin the development, run `npm start` or `yarn start`.
       To create a production bundle, use `npm run build` or `yarn build`.
     -->
+    <script type="module" src="/src/index.tsx"></script>
   </body>
 </html>