From ae6a25fe6d978ba2d336dc544ef84e5354c7157d Mon Sep 17 00:00:00 2001 From: Tom Rogers Date: Wed, 5 Feb 2025 15:37:58 +0100 Subject: [PATCH] Create a Docker Image for Web (#4533) --- .../build-self-host-docker-images.yml | 10 +++++++++ packages/web/Dockerfile-self | 12 +++-------- packages/web/env.sh | 21 +++++++++++++++++++ packages/web/lib/appConfig.ts | 18 ++++++++++------ packages/web/pages/_document.tsx | 2 ++ packages/web/public/env.js | 4 ++++ .../docker-compose/docker-compose.yml | 10 +-------- 7 files changed, 53 insertions(+), 24 deletions(-) create mode 100644 packages/web/env.sh create mode 100644 packages/web/public/env.js diff --git a/.github/workflows/build-self-host-docker-images.yml b/.github/workflows/build-self-host-docker-images.yml index d9be97afd..5f1503781 100644 --- a/.github/workflows/build-self-host-docker-images.yml +++ b/.github/workflows/build-self-host-docker-images.yml @@ -34,6 +34,16 @@ jobs: - name: Set up Docker Buildx uses: docker/setup-buildx-action@v3 + - name: Build and push web + uses: docker/build-push-action@v6 + with: + platforms: linux/amd64,linux/arm64 + push: true + tags: ghcr.io/omnivore-app/sh-web:latest,ghcr.io/omnivore-app/sh-web:${{ github.sha }} + file: packages/web/Dockerfile-self + cache-from: type=registry,ref=ghcr.io/omnivore-app/sh-web:${{ github.sha }} + cache-to: type=registry,ref=ghcr.io/omnivore-app/sh-web:${{ github.sha }},mode=max + - name: Build and push image-proxy uses: docker/build-push-action@v6 with: diff --git a/packages/web/Dockerfile-self b/packages/web/Dockerfile-self index 1488400e5..5baea958c 100644 --- a/packages/web/Dockerfile-self +++ b/packages/web/Dockerfile-self @@ -3,14 +3,6 @@ FROM node:22.12-alpine as builder ENV NODE_OPTIONS=--max-old-space-size=8192 -ARG APP_ENV -ARG BASE_URL -ARG SERVER_BASE_URL -ARG HIGHLIGHTS_BASE_URL -ENV NEXT_PUBLIC_APP_ENV=$APP_ENV -ENV NEXT_PUBLIC_BASE_URL=$BASE_URL -ENV NEXT_PUBLIC_SERVER_BASE_URL=$SERVER_BASE_URL -ENV NEXT_PUBLIC_HIGHLIGHTS_BASE_URL=$HIGHLIGHTS_BASE_URL RUN apk add g++ make python3 py3-setuptools @@ -50,4 +42,6 @@ COPY --from=builder /app/node_modules /app/node_modules COPY --from=builder /app/package.json /app/package.json EXPOSE 8080 -CMD ["yarn", "workspace", "@omnivore/web", "start"] +COPY ./packages/web/env.sh /app/packages/web/env.sh +RUN chmod +x /app/packages/web/env.sh +ENTRYPOINT ["/app/packages/web/env.sh"] diff --git a/packages/web/env.sh b/packages/web/env.sh new file mode 100644 index 000000000..350f8d2f3 --- /dev/null +++ b/packages/web/env.sh @@ -0,0 +1,21 @@ +#!/bin/sh + +if [ -z "$SERVER_BASE_URL" ]; then + echo "Error: SERVER_BASE_URL environment variable is not set." + exit 1 +fi + +file_contents=$(cat /app/packages/web/public/env.js) +new_contents=${file_contents//\{\{SERVER_BASE_URL\}\}/$SERVER_BASE_URL} +echo "$new_contents" > /app/packages/web/public/env.js + +if [ -z "$BASE_URL" ]; then + echo "Error: BASE_URL environment variable is not set." + exit 1 +fi + +file_contents=$(cat /app/packages/web/public/env.js) +new_contents=${file_contents//\{\{BASE_URL\}\}/$BASE_URL} +echo "$new_contents" > /app/packages/web/public/env.js + +yarn workspace @omnivore/web start diff --git a/packages/web/lib/appConfig.ts b/packages/web/lib/appConfig.ts index 17b3b66df..e8dbab8e4 100644 --- a/packages/web/lib/appConfig.ts +++ b/packages/web/lib/appConfig.ts @@ -30,20 +30,26 @@ const baseURLRecords: BaseURLRecords = { function serverBaseURL(env: AppEnvironment): string { const value = baseURLRecords[appEnv].serverBaseURL - if (value.length == 0) { - throw new Error( - `Couldn't find environment variable for server base url in ${env} environment` + if (value.length == 0 && global.window) { + const windowEnv = (window as any).omnivoreEnv + console.warn( + `Couldn't find environment variable for server base url in ${env} environment, using ${windowEnv.SERVER_BASE_URL}` ) + + return windowEnv.SERVER_BASE_URL ?? '' } return value } function webURL(env: AppEnvironment): string { const value = baseURLRecords[appEnv].webBaseURL - if (value.length == 0) { - throw new Error( - `Couldn't find environment variable for web base url in ${env} environment` + if (value.length == 0 && global.window) { + const windowEnv = (window as any).omnivoreEnv + console.warn( + `Couldn't find environment variable for base url in ${env} environment, using ${windowEnv.BASE_URL}` ) + + return windowEnv.BASE_URL ?? '' } return value } diff --git a/packages/web/pages/_document.tsx b/packages/web/pages/_document.tsx index bed2d4684..3fd64f3d2 100644 --- a/packages/web/pages/_document.tsx +++ b/packages/web/pages/_document.tsx @@ -3,6 +3,7 @@ import NextDocument, { Html, Head, Main, NextScript } from 'next/document' import { getCssText, globalStyles } from '../components/tokens/stitches.config' import { Toaster } from 'react-hot-toast' +import Script from 'next/script' export default class Document extends NextDocument { render() { @@ -18,6 +19,7 @@ export default class Document extends NextDocument {