feat: implement S3 static asset hosting for persistent chunk availability

- Configure Next.js to serve static assets from S3 using assetPrefix
- Add upload script to push static assets to S3 during Docker build
- Update Dockerfile to include S3 upload step with proper cache control
- Update GitHub workflow to pass S3 credentials and bucket info
- Enable zero-downtime deployments by keeping old chunks accessible
- Use git commit SHA for asset versioning and cache invalidation

Author: geclos

.github/workflows/build-and-push.yml

@@ -194,15 +194,20 @@ jobs:
           cache-from: type=registry,ref=${{ matrix.private && format('{0}/{1}', env.ECR_REGISTRY, matrix.repo_name) || format('{0}/{1}/{2}', matrix.registry, matrix.owner, matrix.repo_name) }}:latest
           cache-to: type=inline
           secrets: ${{ matrix.private && format('SENTRY_AUTH_TOKEN={0}', secrets.SENTRY_AUTH_TOKEN) || '' }}
-          build-args: |
-            NEXT_PUBLIC_DOCS_URL=${{ matrix.private && vars.NEXT_PUBLIC_DOCS_URL || '' }}
-            NEXT_PUBLIC_LATITUDE_CLOUD_PAYMENT_URL=${{ matrix.private && vars.NEXT_PUBLIC_LATITUDE_CLOUD_PAYMENT_URL || '' }}
-            NEXT_PUBLIC_POSTHOG_HOST=${{ matrix.private && secrets.NEXT_PUBLIC_POSTHOG_HOST || '' }}
-            NEXT_PUBLIC_POSTHOG_KEY=${{ matrix.private && secrets.NEXT_PUBLIC_POSTHOG_KEY || '' }}
-            NEXT_PUBLIC_SENTRY_WEB_DSN=${{ matrix.private && vars.SENTRY_WEB_DSN || '' }}
-            SENTRY_ORG=${{ matrix.private && secrets.SENTRY_ORG || '' }}
-            SENTRY_PROJECT=${{ matrix.private && secrets.SENTRY_PROJECT || '' }}
-            NEXT_SERVER_ACTIONS_ENCRYPTION_KEY=${{ secrets.NEXT_SERVER_ACTIONS_ENCRYPTION_KEY }}
+           build-args: |
+             NEXT_PUBLIC_DOCS_URL=${{ matrix.private && vars.NEXT_PUBLIC_DOCS_URL || '' }}
+             NEXT_PUBLIC_LATITUDE_CLOUD_PAYMENT_URL=${{ matrix.private && vars.NEXT_PUBLIC_LATITUDE_CLOUD_PAYMENT_URL || '' }}
+             NEXT_PUBLIC_POSTHOG_HOST=${{ matrix.private && secrets.NEXT_PUBLIC_POSTHOG_HOST || '' }}
+             NEXT_PUBLIC_POSTHOG_KEY=${{ matrix.private && secrets.NEXT_PUBLIC_POSTHOG_KEY || '' }}
+             NEXT_PUBLIC_SENTRY_WEB_DSN=${{ matrix.private && vars.SENTRY_WEB_DSN || '' }}
+             SENTRY_ORG=${{ matrix.private && secrets.SENTRY_ORG || '' }}
+             SENTRY_PROJECT=${{ matrix.private && secrets.SENTRY_PROJECT || '' }}
+             NEXT_SERVER_ACTIONS_ENCRYPTION_KEY=${{ secrets.NEXT_SERVER_ACTIONS_ENCRYPTION_KEY }}
+             AWS_ACCESS_KEY_ID=${{ matrix.private && secrets.AWS_ACCESS_KEY_ID || '' }}
+             AWS_SECRET_ACCESS_KEY=${{ matrix.private && secrets.AWS_SECRET_ACCESS_KEY || '' }}
+             AWS_REGION=${{ matrix.private && vars.AWS_REGION || '' }}
+             S3_BUCKET=${{ matrix.private && vars.STATIC_ASSETS_S3_BUCKET || '' }}
+             BUILD_ID=${{ github.sha }}
 
   run-migrations:
     needs: [build-and-push]

apps/web/docker/Dockerfile

@@ -108,6 +108,27 @@ RUN --mount=type=cache,id=pnpm,target=/pnpm/store \
   NODE_OPTIONS="--max-old-space-size=8192" \
   pnpm turbo build --filter="${PROJECT}..."
 
+# Upload static assets to S3 for persistent availability
+ARG AWS_ACCESS_KEY_ID
+ARG AWS_SECRET_ACCESS_KEY
+ARG AWS_REGION
+ARG S3_BUCKET
+ARG BUILD_ID
+ENV AWS_ACCESS_KEY_ID=$AWS_ACCESS_KEY_ID
+ENV AWS_SECRET_ACCESS_KEY=$AWS_SECRET_ACCESS_KEY
+ENV AWS_REGION=$AWS_REGION
+ENV S3_BUCKET=$S3_BUCKET
+ENV BUILD_ID=$BUILD_ID
+
+RUN if [ -n "$S3_BUCKET" ] && [ -n "$BUILD_ID" ]; then \
+  echo "Uploading static assets to S3..."; \
+  chmod +x ./apps/web/scripts/upload-static-assets.sh && \
+  cd apps/web && \
+  ./scripts/upload-static-assets.sh; \
+else \
+  echo "Skipping S3 upload - S3_BUCKET or BUILD_ID not provided"; \
+fi
+
 RUN --mount=type=cache,id=pnpm,target=/pnpm/store pnpm prune --prod --no-optional
 
 # PRODUCTION

apps/web/next.config.mjs

@@ -38,6 +38,8 @@ const nextConfig = {
   images: {
     remotePatterns: [new URL('https://assets.pipedream.net/**')],
   },
+  // Serve static assets from S3 for persistent chunk availability
+  assetPrefix: process.env.NEXT_PUBLIC_STATIC_ASSETS_URL,
 }
 
 let config

apps/web/scripts/upload-static-assets.sh

@@ -0,0 +1,56 @@
+#!/bin/bash
+
+# Script to upload Next.js static assets to S3
+# This ensures persistent availability of chunks across deployments
+
+set -e
+
+# Environment variables required:
+# AWS_ACCESS_KEY_ID - AWS access key
+# AWS_SECRET_ACCESS_KEY - AWS secret key
+# AWS_REGION - AWS region
+# S3_BUCKET - S3 bucket name for static assets
+# BUILD_ID - Unique build identifier (e.g., git commit SHA)
+
+if [ -z "$AWS_ACCESS_KEY_ID" ] || [ -z "$AWS_SECRET_ACCESS_KEY" ] || [ -z "$AWS_REGION" ] || [ -z "$S3_BUCKET" ] || [ -z "$BUILD_ID" ]; then
+  echo "Error: Missing required environment variables"
+  echo "Required: AWS_ACCESS_KEY_ID, AWS_SECRET_ACCESS_KEY, AWS_REGION, S3_BUCKET, BUILD_ID"
+  exit 1
+fi
+
+STATIC_DIR="./.next/static"
+S3_PREFIX="static-assets/$BUILD_ID"
+
+echo "Uploading static assets to S3..."
+echo "Bucket: $S3_BUCKET"
+echo "Prefix: $S3_PREFIX"
+echo "Source: $STATIC_DIR"
+
+if [ ! -d "$STATIC_DIR" ]; then
+  echo "Error: Static directory $STATIC_DIR does not exist"
+  exit 1
+fi
+
+# Upload static assets with appropriate cache control headers
+# JS/CSS chunks: cache for 1 year (immutable)
+# Other assets: cache for 1 hour
+aws s3 cp "$STATIC_DIR" "s3://$S3_BUCKET/$S3_PREFIX/" \
+  --recursive \
+  --cache-control "public, max-age=31536000, immutable" \
+  --exclude "*" \
+  --include "*.js" \
+  --include "*.css"
+
+# Upload other static assets (images, fonts, etc.) with shorter cache
+aws s3 cp "$STATIC_DIR" "s3://$S3_BUCKET/$S3_PREFIX/" \
+  --recursive \
+  --cache-control "public, max-age=3600" \
+  --exclude "*.js" \
+  --exclude "*.css"
+
+echo "Static assets uploaded successfully to s3://$S3_BUCKET/$S3_PREFIX/"
+
+# Output the S3 URL for use in Next.js configuration
+S3_URL="https://$S3_BUCKET.s3.$AWS_REGION.amazonaws.com/$S3_PREFIX"
+echo "Static assets URL: $S3_URL"
+echo "NEXT_PUBLIC_STATIC_ASSETS_URL=$S3_URL" >> $GITHUB_ENV