V3

.devcontainer/devcontainer.json

@@ -3,7 +3,7 @@
 {
 	"name": "Ganymede Frontend",
 	// Or use a Dockerfile or Docker Compose file. More info: https://containers.dev/guide/dockerfile
-	"image": "mcr.microsoft.com/devcontainers/javascript-node:0-20",
+	"image": "mcr.microsoft.com/devcontainers/typescript-node:20",
 
 	// Features to add to the dev container. More info: https://containers.dev/features.
 	// "features": {},
@@ -16,7 +16,9 @@
 	"customizations": {
 		"vscode": {
 			"extensions": [
-				"eamodio.gitlens"
+				"eamodio.gitlens",
+				"vunguyentuan.vscode-postcss",
+				"vunguyentuan.vscode-css-variables"
 			]
 		}
 	}

.dockerignore

@@ -3,4 +3,6 @@ Dockerfile
 node_modules
 npm-debug.log
 README.md
-.next
+.next
+!.next/static
+!.next/standalone

.github/workflows/docker-publish.yml

@@ -22,55 +22,45 @@ env:
 jobs:
   build:
     runs-on: ubuntu-latest
-    permissions:
-      contents: read
-      packages: write
-      # This is used to complete the identity challenge
-      # with sigstore/fulcio when running outside of PRs.
-      id-token: write
-
     steps:
       - name: Checkout repository
-        uses: actions/checkout@v3.3.0
+        uses: actions/checkout@v4
 
+      # Set up QEMU for Arm64
       - name: Set up QEMU
-        uses: docker/[email protected]
-        with:
-          platforms: all
+        uses: docker/setup-qemu-action@v3
 
-      # Workaround: https://github.com/docker/build-push-action/issues/461
-      - name: Setup Docker buildx
-        uses: docker/setup-buildx-action@v2.2.1
+      # Set up Docker Buildx
+      - name: Set up Docker Buildx
+        uses: docker/setup-buildx-action@v3
 
-      # Login against a Docker registry except on PR
-      # https://github.com/docker/login-action
+      # Login into GitHub Container Registry except on PR
       - name: Log into registry ${{ env.REGISTRY }}
-        if: github.event_name != 'pull_request'
-        uses: docker/login-action@v2.1.0
+        # if: github.event_name != 'pull_request' TODO: remove this line
+        uses: docker/login-action@v3
         with:
           registry: ${{ env.REGISTRY }}
           username: ${{ github.actor }}
           password: ${{ secrets.GITHUB_TOKEN }}
 
       # Extract metadata (tags, labels) for Docker
-      # https://github.com/docker/metadata-action
-      - name: Extract Docker metadata
+      - name: Extract Docker metadata (release)
         id: meta
-        uses: docker/metadata-action@v4.3.0
+        uses: docker/metadata-action@v5
         with:
           images: ${{ env.REGISTRY }}/${{ env.IMAGE_NAME }}
+          flavor: |
+            latest=auto
+          tags: |
+            type=semver,pattern={{version}}
+            type=raw,value=dev
 
-      # Build and push Docker image with Buildx (don't push on PR)
-      # https://github.com/docker/build-push-action
-      - name: Build and push Docker image
-        id: build-and-push
-        uses: docker/[email protected]
+      - name: Build and push
+        uses: docker/build-push-action@v6
         with:
-          context: .
-          push: ${{ github.event_name != 'pull_request' }}
-          tags: ${{ steps.meta.outputs.tags }}
-          labels: ${{ steps.meta.outputs.labels }}
           platforms: linux/amd64,linux/arm64
-          provenance: false
-          cache-from: type=gha,scope=${{ env.IMAGE_NAME }}
-          cache-to: type=gha,scope=${{ env.IMAGE_NAME }},mode=max
+          push: true # TODO: remove this line
+          # push: ${{ github.event_name != 'pull_request' }}
+          tags: ${{ steps.meta.outputs.tags }}
+          context: .
+          dockerfile: ./Dockerfile

.vscode/settings.json

@@ -0,0 +1,9 @@
+{
+  "cssVariables.lookupFiles": [
+    "**/*.css",
+    "**/*.scss",
+    "**/*.sass",
+    "**/*.less",
+    "node_modules/@mantine/core/styles.css"
+  ]
+}

Dockerfile

@@ -1,3 +1,5 @@
+ARG GITHUB_SHA
+
 # Install dependencies only when needed
 FROM node:18-alpine AS deps
 # Check https://github.com/nodejs/docker-node/tree/b4117f9333da4138b03a546ec926ef50a31506c3#nodealpine to understand why libc6-compat might be needed.
@@ -8,6 +10,9 @@ RUN npm install
 
 # Rebuild the source code only when needed
 FROM node:18-alpine AS builder
+
+ENV NEXT_PUBLIC_GIT_COMMIT=$GITHUB_SHA
+
 RUN apk add --no-cache git
 WORKDIR /app
 COPY --from=deps /app/node_modules ./node_modules
@@ -20,7 +25,6 @@ RUN npm i sharp -y
 
 RUN npm run build
 
-
 # Production image, copy all the files and run next
 FROM node:18-alpine AS runner
 WORKDIR /app