diff --git a/Dockerfile b/Dockerfile index 25d4ae3..7aa43fb 100644 --- a/Dockerfile +++ b/Dockerfile @@ -1,5 +1,9 @@ # Arguments ARG NODE_VERSION=lts-alpine +ARG API_BASE_URL=http://localhost:5050 +ARG AUTH_ENABLED=FALSE +ARG PAYER_SIM_BRAND_ICON="" +ARG PAYEE_SIM_BRAND_ICON="" # NOTE: Ensure you set NODE_VERSION Build Argument as follows... # @@ -28,25 +32,48 @@ COPY index.html vite.config.js eslint.config.js tsconfig.json /opt/app/ RUN NODE_OPTIONS="--max-old-space-size=4096" npm run build -FROM nginx:1.28-alpine -WORKDIR /usr/share/nginx/html +# Use an intermediate stage with a shell to prepare nginx configuration +FROM alpine:3.19 as config +WORKDIR /tmp -# Replace the nginx config files -RUN rm -f /etc/nginx/conf.d/default.conf /etc/nginx/nginx.conf -COPY nginx/nginx.conf /etc/nginx/nginx.conf +# Environment variables +ARG API_BASE_URL +ARG AUTH_ENABLED +ARG PAYER_SIM_BRAND_ICON +ARG PAYEE_SIM_BRAND_ICON -# Create a non-root user: ml-user -RUN adduser -D ml-user +# Copy nginx config +COPY nginx/nginx.conf /tmp/nginx.conf +COPY nginx/prestart.sh /tmp/prestart.sh -# Change permissions for nginx folders -RUN chown -R ml-user:ml-user /var/log/nginx -RUN chown -R ml-user:ml-user /var/cache/nginx -RUN chown -R ml-user:ml-user /usr/share/nginx +# Create necessary directories for Chainguard nginx +RUN mkdir -p /tmp/var/lib/nginx/tmp \ + /tmp/var/run \ + /tmp/etc/nginx \ + /tmp/usr/share/nginx/html -USER ml-user +# Copy build artifacts +COPY --from=builder /opt/app/build /tmp/usr/share/nginx/html/ -COPY --chown=ml-user --from=builder /opt/app/build . -COPY nginx/start.sh /usr/share/nginx/start.sh +# Apply environment variable substitution +RUN chmod +x /tmp/prestart.sh && \ + cd /tmp && \ + API_BASE_URL=${API_BASE_URL} \ + AUTH_ENABLED=${AUTH_ENABLED} \ + PAYER_SIM_BRAND_ICON="${PAYER_SIM_BRAND_ICON}" \ + PAYEE_SIM_BRAND_ICON="${PAYEE_SIM_BRAND_ICON}" \ + ./prestart.sh +# Final image +FROM cgr.dev/chainguard/nginx:latest + +# Copy pre-prepared nginx configuration +COPY --from=config /tmp/nginx.conf /etc/nginx/nginx.conf + +# Copy the prepared html directory and required tmp/run directories +COPY --from=config /tmp/usr/share/nginx/html /usr/share/nginx/html +COPY --from=config /tmp/var/lib/nginx/tmp /var/lib/nginx/tmp +COPY --from=config /tmp/var/run /var/run + +# Configuration done - use the default entrypoint/cmd EXPOSE 6060 -CMD ["sh", "/usr/share/nginx/start.sh"] diff --git a/docker-compose.yml b/docker-compose.yml index 962f0c7..40bd141 100644 --- a/docker-compose.yml +++ b/docker-compose.yml @@ -1,16 +1,43 @@ version: "3.7" services: + # Init container to prepare static files with environment variables + config-init: + image: alpine:3.19 + volumes: + - app-html:/app-html + - ./nginx/start.sh:/start.sh + environment: + - API_BASE_URL=http://localhost:5050 + - AUTH_ENABLED=FALSE + # - PAYEE_SIM_BRAND_ICON=some_image + command: + - /bin/sh + - -c + - | + cp -r /usr/share/nginx/html/* /app-html/ || true + chmod +x /start.sh + sh /start.sh + + # Main application container mojaloop-testing-toolkit-ui: image: mojaloop-testing-toolkit-ui:local build: context: . + args: + - API_BASE_URL=http://localhost:5050 + - AUTH_ENABLED=FALSE + # - PAYER_SIM_BRAND_ICON=some_image + # - PAYEE_SIM_BRAND_ICON=some_image ports: - "6060:6060" - environment: - - API_BASE_URL=http://localhost:5050 - - AUTH_ENABLED=FALSE - # - PAYEE_SIM_BRAND_ICON=some_image - command: - - sh - - /usr/share/nginx/start.sh + volumes: + - app-html:/usr/share/nginx/html + tmpfs: + - /var/lib/nginx/tmp + - /var/run + depends_on: + - config-init + +volumes: + app-html: diff --git a/nginx/nginx.conf b/nginx/nginx.conf index 041036f..8e19e02 100644 --- a/nginx/nginx.conf +++ b/nginx/nginx.conf @@ -1,6 +1,6 @@ # auto detects a good number of processes to run worker_processes auto; -pid /usr/share/nginx/nginx.pid; +pid /var/run/nginx.pid; #Provides the configuration file context in which the directives that affect connection processing are specified. events { diff --git a/nginx/prestart.sh b/nginx/prestart.sh new file mode 100644 index 0000000..f2ea1a6 --- /dev/null +++ b/nginx/prestart.sh @@ -0,0 +1,22 @@ +#!/bin/sh +# This script is used during the Docker build to substitute environment variables + +# Default values if not provided +API_BASE_URL=${API_BASE_URL:-http://localhost:5050} +echo "Applying API_BASE_URL: ${API_BASE_URL}" +AUTH_ENABLED=${AUTH_ENABLED:-FALSE} +PAYER_SIM_BRAND_ICON=${PAYER_SIM_BRAND_ICON:-} +PAYEE_SIM_BRAND_ICON=${PAYEE_SIM_BRAND_ICON:-} + +# Substitute environment variables in all HTML and JS files +find /usr/share/nginx/html -type f -name "*.html" -o -name "*.js" | xargs sed -i "s|TTK_API_BASE_URL|$API_BASE_URL|g" +find /usr/share/nginx/html -type f -name "*.html" -o -name "*.js" | xargs sed -i "s|TTK_AUTH_ENABLED|$AUTH_ENABLED|g" + +# Only substitute these if they're set +if [ ! -z "$PAYER_SIM_BRAND_ICON" ]; then + find /usr/share/nginx/html -type f -name "*.html" -o -name "*.js" | xargs sed -i "s|TTK_PAYER_SIM_BRAND_ICON|$PAYER_SIM_BRAND_ICON|g" +fi + +if [ ! -z "$PAYEE_SIM_BRAND_ICON" ]; then + find /usr/share/nginx/html -type f -name "*.html" -o -name "*.js" | xargs sed -i "s|TTK_PAYEE_SIM_BRAND_ICON|$PAYEE_SIM_BRAND_ICON|g" +fi \ No newline at end of file diff --git a/nginx/start.sh b/nginx/start.sh index 723b9ba..631f694 100644 --- a/nginx/start.sh +++ b/nginx/start.sh @@ -1,3 +1,7 @@ +# This script is not used directly in the Chainguard nginx image since it's distroless +# The functionality is now built into the image at build time +# Keeping this file for reference only + if [[ ! -z "${API_BASE_URL}" ]]; then find /usr/share/nginx/html -type f -name "*.*" -exec sed -i -e "s|TTK_API_BASE_URL|$API_BASE_URL|g" {} \; fi