From b20c8cdacade37e9d7a4112c10c445626ce9c90e Mon Sep 17 00:00:00 2001 From: Clemence Kyara Date: Mon, 24 Jun 2024 14:23:46 +0300 Subject: [PATCH 1/6] Update .editorconfig --- .editorconfig | 9 ++++----- 1 file changed, 4 insertions(+), 5 deletions(-) diff --git a/.editorconfig b/.editorconfig index 6ab7b6cbb..4be6792be 100644 --- a/.editorconfig +++ b/.editorconfig @@ -1,14 +1,13 @@ # http://editorconfig.org - root = true [*] -end_of_line = lf charset = utf-8 -trim_trailing_whitespace = true -insert_final_newline = true -indent_style = space +end_of_line = lf indent_size = 2 +indent_style = space +insert_final_newline = true +trim_trailing_whitespace = true [*.{diff,md}] trim_trailing_whitespace = false From 64a476b21c0d00c9e71f6ddcb859661cf7ac128f Mon Sep 17 00:00:00 2001 From: Clemence Kyara Date: Mon, 24 Jun 2024 16:15:52 +0300 Subject: [PATCH 2/6] output: "standalone" doesn't work with custom server https://nextjs.org/docs/pages/building-your-application/configuring/custom-server --- apps/codeforafrica/next.config.js | 11 ----------- apps/codeforafrica/turbo.json | 1 - 2 files changed, 12 deletions(-) diff --git a/apps/codeforafrica/next.config.js b/apps/codeforafrica/next.config.js index c3a5a867a..db92419f2 100644 --- a/apps/codeforafrica/next.config.js +++ b/apps/codeforafrica/next.config.js @@ -1,12 +1,5 @@ -const path = require("path"); - const { withSentryConfig } = require("@sentry/nextjs"); -const PROJECT_ROOT = process.env.PROJECT_ROOT?.trim(); -const outputFileTracingRoot = PROJECT_ROOT - ? path.resolve(__dirname, PROJECT_ROOT) - : undefined; - const nextConfig = { images: { domains: process.env.NEXT_PUBLIC_IMAGE_DOMAINS?.split(",") @@ -16,16 +9,12 @@ const nextConfig = { process.env.NEXT_PUBLIC_IMAGE_UNOPTIMIZED?.trim()?.toLowerCase() === "true", }, - experimental: { - outputFileTracingRoot, - }, modularizeImports: { // NOTE: only transform @mui/material and not any of sub-modules e.g. @mui/material/styles. "@mui/material^": { transform: "@mui/material/{{member}}", }, }, - output: "standalone", pageExtensions: ["page.js"], reactStrictMode: true, transpilePackages: ["@commons-ui/core", "@commons-ui/next"], diff --git a/apps/codeforafrica/turbo.json b/apps/codeforafrica/turbo.json index e40a53bb8..c0ced17a2 100644 --- a/apps/codeforafrica/turbo.json +++ b/apps/codeforafrica/turbo.json @@ -21,7 +21,6 @@ "PAYLOAD_PUBLIC_APP_URL", "PAYLOAD_PUBLIC_DEFAULT_LOCALE", "PAYLOAD_PUBLIC_LOCALES", - "PROJECT_ROOT", "SENTRY_AUTH_TOKEN", "SENTRY_ORG", "SENTRY_PROJECT" From 1787ea559901bf0a3777eb1c41e126e4ff91c55b Mon Sep 17 00:00:00 2001 From: Clemence Kyara Date: Mon, 24 Jun 2024 16:19:31 +0300 Subject: [PATCH 3/6] Move codeforafrica build into Dockerfile --- Dockerfile | 115 +++++++++++++++++++++++++++++++++++++++ codeforafrica.Dockerfile | 81 --------------------------- 2 files changed, 115 insertions(+), 81 deletions(-) delete mode 100644 codeforafrica.Dockerfile diff --git a/Dockerfile b/Dockerfile index 55263a788..16103232b 100644 --- a/Dockerfile +++ b/Dockerfile @@ -115,6 +115,121 @@ RUN set -ex \ EXPOSE ${PORT} +# ============================================================================ +# Code for Africa +# ============================================================================ + +# +# codeforafrica-desp: image with all pesayetu dependencies +# -------------------------------------------------------- + +FROM base-deps as codeforafrica-deps + +# TODO(kilemensi): Figure out why this is needed +COPY packages/commons-ui-testing-library/package.json ./packages/commons-ui-testing-library/package.json + +COPY apps/codeforafrica/package.json ./apps/codeforafrica/package.json + +RUN pnpm --filter "./apps/codeforafrica/" install --offline --frozen-lockfile + +# +# codeforafrica-builder: image that uses deps to build shippable output +# --------------------------------------------------------------------- + +FROM base-builder as codeforafrica-builder + +ARG NEXT_TELEMETRY_DISABLED \ + # Next.js / Payload (build time) + PORT \ + # Next.js (runtime) + NEXT_PUBLIC_APP_NAME="Code for Africa" \ + NEXT_PUBLIC_APP_URL=http://localhost:3000 \ + NEXT_PUBLIC_SENTRY_DSN="" \ + # Payload (runtime) + MONGODB_URL \ + PAYLOAD_SECRET \ + # Sentry (build time) + SENTRY_AUTH_TOKEN \ + SENTRY_ENVIRONMENT \ + SENTRY_ORG="" \ + SENTRY_PROJECT="" + +COPY --from=codeforafrica-deps /workspace/node_modules ./node_modules + +# TODO(kilemensi): Investigate why we need @commons-ui sources. +# Could it be TS related? We don't need this in PesaYetu. +COPY packages ./packages + +COPY --from=codeforafrica-deps /workspace/packages/commons-ui-core/node_modules ./packages/commons-ui-core/node_modules +COPY --from=codeforafrica-deps /workspace/packages/commons-ui-next/node_modules ./packages/commons-ui-next/node_modules +COPY --from=codeforafrica-deps /workspace/packages/commons-ui-testing-library/node_modules ./packages/commons-ui-testing-library/node_modules +COPY --from=codeforafrica-deps /workspace/packages/eslint-config-commons-ui/node_modules ./packages/eslint-config-commons-ui/node_modules +COPY --from=codeforafrica-deps /workspace/apps/codeforafrica/node_modules ./apps/codeforafrica/node_modules + +COPY apps/codeforafrica ./apps/codeforafrica/ + +RUN pnpm --filter "./apps/codeforafrica/" build-next + +# Since we're using another arg to initialise this, it must be a separate ARG +ARG PAYLOAD_PUBLIC_APP_URL=${NEXT_PUBLIC_APP_URL} + +RUN pnpm --filter "./apps/codeforafrica/" build-payload + +# +# codeforafrica-runner: final deployable image +# -------------------------------------------- + +FROM base-runner as codeforafrica-runner + +# TODO(koech): Standadise naming of Mongo DB URL. Our options: +# - MONGODB_URL (codeforafrica) +# - MONGO_URL (charterafrica) +ARG MONGODB_URL \ + NEXT_PUBLIC_APP_LOGO_URL \ + PAYLOAD_CONFIG_PATH="dist/payload.config.js" \ + PAYLOAD_PUBLIC_APP_URL + +ENV MONGODB_URL=${MONGODB_URL} \ + # TODO(koech): Standadise naming of GA MEASUREMENT ID. Our options: + # - GA_MEASUREMENT_ID (charterafrica, codeforafrica) + # - GOOGLE_ANALYTICS (pesayetu, vpnmanager) + # This is only needed at runtime + NEXT_PUBLIC_APP_LOGO_URL=${NEXT_PUBLIC_APP_LOGO_URL} \ + PAYLOAD_PUBLIC_APP_URL=${PAYLOAD_PUBLIC_APP_URL} \ + PAYLOAD_CONFIG_PATH=${PAYLOAD_CONFIG_PATH} \ + PAYLOAD_SECRET=${PAYLOAD_SECRET} + +RUN set -ex \ + # Create nextjs cache dir w/ correct permissions + && mkdir -p ./apps/codeforafrica//.next \ + && chown nextjs:nodejs ./apps/codeforafrica/.next + +# PNPM +# symlink some dependencies +COPY --from=codeforafrica-builder --chown=nextjs:nodejs /workspace/node_modules ./node_modules + +COPY --from=codeforafrica-builder --chown=nextjs:nodejs /workspace/apps/codeforafrica/node_modules ./apps/codeforafrica/node_modules + +# Next.js +# Public assets +COPY --from=codeforafrica-builder --chown=nextjs:nodejs /workspace/apps/codeforafrica/public ./apps/codeforafrica/public + +# Since we can't use output: "standalone", lets copy .next folder +# TODO(kilemensi): Figure out which files in .next folder are not needed +COPY --from=codeforafrica-builder --chown=nextjs:nodejs /workspace/apps/codeforafrica/.next ./apps/codeforafrica/.next + +# Payload +COPY --from=codeforafrica-builder /workspace/apps/codeforafrica/dist ./apps/codeforafrica/dist +COPY --from=codeforafrica-builder /workspace/apps/codeforafrica/build ./apps/codeforafrica/build + +# Since we're can't use output: "standalone", switch to specific app folder +WORKDIR /workspace/apps/codeforafrica + +USER nextjs + +# Custom server to run Payload and Next.js in the same app +CMD ["node", "dist/server.js"] + # ============================================================================ # PesaYetu # ============================================================================ diff --git a/codeforafrica.Dockerfile b/codeforafrica.Dockerfile deleted file mode 100644 index 2076be28b..000000000 --- a/codeforafrica.Dockerfile +++ /dev/null @@ -1,81 +0,0 @@ -FROM node:20.14-alpine as node-alpine - -RUN apk update \ - && apk upgrade - - -FROM node-alpine as base - -RUN apk add --no-cache libc6-compat - -ARG PNPM_VERSION=9.1.4 - -RUN corepack enable && corepack prepare pnpm@${PNPM_VERSION} --activate - -WORKDIR /workspace - -COPY pnpm-lock.yaml . - -RUN pnpm fetch - -FROM base as builder - - -WORKDIR /workspace - -COPY *.yaml *.json ./ -COPY packages ./packages -COPY apps/codeforafrica ./apps/codeforafrica - -# Use virtual store: https://pnpm.io/cli/fetch#usage-scenario -RUN pnpm install --recursive --offline --frozen-lockfile - -ARG PORT=3000 \ - MONGODB_URL \ - PAYLOAD_SECRET \ - NEXT_PUBLIC_APP_URL=http://localhost:3000 \ - NEXT_PUBLIC_SENTRY_DSN="" \ - # Sentry config for source maps upload (needed at build time only) - SENTRY_AUTH_TOKEN="" \ - SENTRY_ENVIRONMENT="" \ - SENTRY_ORG="" \ - SENTRY_PROJECT="" - -RUN pnpm build-next --filter=codeforafrica - -ARG PAYLOAD_PUBLIC_APP_URL=${NEXT_PUBLIC_APP_URL} - -RUN pnpm build-payload --filter=codeforafrica - -FROM builder as runner - -RUN rm -rf /var/cache/apk/* - -ARG NEXT_PUBLIC_APP_NAME \ - NEXT_PUBLIC_APP_URL \ - NEXT_PUBLIC_GA_MEASUREMENT_ID \ - NEXT_PUBLIC_SEO_DISABLED \ - PAYLOAD_CONFIG_PATH="dist/payload.config.js" \ - PAYLOAD_PUBLIC_APP_URL \ - NEXT_PUBLIC_APP_LOGO_URL \ - NEXT_PUBLIC_SENTRY_DSN \ - PORT \ - SENTRY_ENV - -ENV NODE_ENV=production \ - PAYLOAD_PUBLIC_APP_URL=${NEXT_PUBLIC_APP_URL} \ - PORT=${PORT} \ - PAYLOAD_CONFIG_PATH=${PAYLOAD_CONFIG_PATH} \ - PAYLOAD_SECRET=${PAYLOAD_SECRET} \ - MONGODB_URL=${MONGODB_URL} \ - NEXT_PUBLIC_APP_LOGO_URL=${NEXT_PUBLIC_APP_LOGO_URL} \ - NEXT_PUBLIC_APP_NAME=${NEXT_PUBLIC_APP_NAME} \ - NEXT_PUBLIC_APP_URL=${NEXT_PUBLIC_APP_URL} \ - NEXT_PUBLIC_SENTRY_DSN=${NEXT_PUBLIC_SENTRY_DSN} \ - SENTRY_ENVIRONMENT=${SENTRY_ENVIRONMENT} - -WORKDIR /workspace/apps/codeforafrica - -EXPOSE ${PORT} - -CMD [ "node", "dist/server.js" ] From d052e5467857e6dd010e7c5e72161ba193d0d631 Mon Sep 17 00:00:00 2001 From: Clemence Kyara Date: Mon, 24 Jun 2024 16:20:34 +0300 Subject: [PATCH 4/6] Switch to target build --- docker-compose.yml | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/docker-compose.yml b/docker-compose.yml index 139564295..5d8a7a862 100644 --- a/docker-compose.yml +++ b/docker-compose.yml @@ -33,7 +33,7 @@ services: condition: service_healthy build: context: . - dockerfile: codeforafrica.Dockerfile + target: codeforafrica-runner args: - MONGO_URL=mongodb://${MONGO_INITDB_ROOT_USERNAME:-root}:${MONGO_INITDB_ROOT_PASSWORD:-rootpassword}@host.docker.internal:${MONGODB_PORT:-27017}/codeforafrica?authSource=admin&directConnection=true - PAYLOAD_SECRET From c4057bb8d5ede1aa2c4cd9cdfcccbc34cfc4f0c8 Mon Sep 17 00:00:00 2001 From: Clemence Kyara Date: Mon, 24 Jun 2024 16:23:01 +0300 Subject: [PATCH 5/6] Update GitHub Actions to use Dockerfile + target --- .github/workflows/codeforafrica-deploy-dev-app.yml | 4 ++-- .github/workflows/codeforafrica-deploy-prod.yml | 2 +- .github/workflows/codeforafrica-deploy-review-app.yml | 4 ++-- 3 files changed, 5 insertions(+), 5 deletions(-) diff --git a/.github/workflows/codeforafrica-deploy-dev-app.yml b/.github/workflows/codeforafrica-deploy-dev-app.yml index 819212eb9..2f760fcdf 100644 --- a/.github/workflows/codeforafrica-deploy-dev-app.yml +++ b/.github/workflows/codeforafrica-deploy-dev-app.yml @@ -5,7 +5,7 @@ on: branches: [main] paths: - "apps/codeforafrica/**" - - "codeforafrica.Dockerfile" + - "Dockerfile" - ".github/workflows/codeforafrica-deploy-dev-app.yml" concurrency: @@ -67,7 +67,7 @@ jobs: cache-from: type=local,src=/tmp/.buildx-cache cache-to: type=local,dest=/tmp/.buildx-cache-new context: . - file: ./codeforafrica.Dockerfile + target: codeforafrica-runner push: true tags: "${{ env.IMAGE_NAME }}:${{ github.sha }}" diff --git a/.github/workflows/codeforafrica-deploy-prod.yml b/.github/workflows/codeforafrica-deploy-prod.yml index a5b8fb3a7..84f6c1816 100644 --- a/.github/workflows/codeforafrica-deploy-prod.yml +++ b/.github/workflows/codeforafrica-deploy-prod.yml @@ -88,7 +88,7 @@ jobs: cache-from: type=local,src=/tmp/.buildx-cache cache-to: type=local,dest=/tmp/.buildx-cache-new context: . - file: ./codeforafrica.Dockerfile + target: codeforafrica-runner push: true tags: "${{ env.IMAGE_NAME }}:${{ steps.version-check.outputs.version }}" diff --git a/.github/workflows/codeforafrica-deploy-review-app.yml b/.github/workflows/codeforafrica-deploy-review-app.yml index 13ebaea89..6076dfa3c 100644 --- a/.github/workflows/codeforafrica-deploy-review-app.yml +++ b/.github/workflows/codeforafrica-deploy-review-app.yml @@ -4,7 +4,7 @@ on: pull_request: paths: - "apps/codeforafrica/**" - - "codeforafrica.Dockerfile" + - "Dockerfile" - ".github/workflows/codeforafrica-deploy-review-app.yml" # By default, a workflow only runs when a pull_request event's activity # type is opened, synchronize, or reopened. We need at least closed to @@ -66,7 +66,7 @@ jobs: cache-from: type=local,src=/tmp/.buildx-cache cache-to: type=local,dest=/tmp/.buildx-cache-new context: . - file: ./codeforafrica.Dockerfile + target: codeforafrica-runner push: true tags: "${{ env.IMAGE_NAME }}:${{ github.sha }}" From ad0719bb98990c23f5f265391f7e5e50d16475bf Mon Sep 17 00:00:00 2001 From: Clemence Kyara Date: Mon, 24 Jun 2024 17:08:52 +0300 Subject: [PATCH 6/6] Clean up comments --- Dockerfile | 11 +++++------ 1 file changed, 5 insertions(+), 6 deletions(-) diff --git a/Dockerfile b/Dockerfile index 16103232b..41e5aa852 100644 --- a/Dockerfile +++ b/Dockerfile @@ -120,8 +120,8 @@ EXPOSE ${PORT} # ============================================================================ # -# codeforafrica-desp: image with all pesayetu dependencies -# -------------------------------------------------------- +# codeforafrica-desp: image with all codeforafrica dependencies +# ------------------------------------------------------------- FROM base-deps as codeforafrica-deps @@ -157,7 +157,6 @@ ARG NEXT_TELEMETRY_DISABLED \ COPY --from=codeforafrica-deps /workspace/node_modules ./node_modules # TODO(kilemensi): Investigate why we need @commons-ui sources. -# Could it be TS related? We don't need this in PesaYetu. COPY packages ./packages COPY --from=codeforafrica-deps /workspace/packages/commons-ui-core/node_modules ./packages/commons-ui-core/node_modules @@ -170,7 +169,6 @@ COPY apps/codeforafrica ./apps/codeforafrica/ RUN pnpm --filter "./apps/codeforafrica/" build-next -# Since we're using another arg to initialise this, it must be a separate ARG ARG PAYLOAD_PUBLIC_APP_URL=${NEXT_PUBLIC_APP_URL} RUN pnpm --filter "./apps/codeforafrica/" build-payload @@ -208,13 +206,14 @@ RUN set -ex \ # symlink some dependencies COPY --from=codeforafrica-builder --chown=nextjs:nodejs /workspace/node_modules ./node_modules +# Since we can't use output: "standalone", copy all app's dependencies COPY --from=codeforafrica-builder --chown=nextjs:nodejs /workspace/apps/codeforafrica/node_modules ./apps/codeforafrica/node_modules # Next.js # Public assets COPY --from=codeforafrica-builder --chown=nextjs:nodejs /workspace/apps/codeforafrica/public ./apps/codeforafrica/public -# Since we can't use output: "standalone", lets copy .next folder +# Since we can't use output: "standalone", copy the whole app's .next folder # TODO(kilemensi): Figure out which files in .next folder are not needed COPY --from=codeforafrica-builder --chown=nextjs:nodejs /workspace/apps/codeforafrica/.next ./apps/codeforafrica/.next @@ -222,7 +221,7 @@ COPY --from=codeforafrica-builder --chown=nextjs:nodejs /workspace/apps/codefora COPY --from=codeforafrica-builder /workspace/apps/codeforafrica/dist ./apps/codeforafrica/dist COPY --from=codeforafrica-builder /workspace/apps/codeforafrica/build ./apps/codeforafrica/build -# Since we're can't use output: "standalone", switch to specific app folder +# Since we can't use output: "standalone", switch to specific app's folder WORKDIR /workspace/apps/codeforafrica USER nextjs