From 127593b01c97e5e42ba7cdd7c098088856c40f14 Mon Sep 17 00:00:00 2001 From: Mihir Samdarshi Date: Mon, 22 Apr 2024 18:45:07 -0700 Subject: [PATCH] build: add dev Dockerfile and update CD action --- .github/workflows/deploy.yml | 61 ++++++++++++++++----- Dockerfile.dev | 102 +++++++++++++++++++++++++++++++++++ docker-compose.dev.yaml | 42 +++++++++++++++ package.json | 2 +- 4 files changed, 194 insertions(+), 13 deletions(-) create mode 100644 Dockerfile.dev create mode 100644 docker-compose.dev.yaml diff --git a/.github/workflows/deploy.yml b/.github/workflows/deploy.yml index a60d8d27..c6c7e859 100644 --- a/.github/workflows/deploy.yml +++ b/.github/workflows/deploy.yml @@ -164,23 +164,60 @@ jobs: run: | echo "PACKAGE_VERSION=$(jq -r '.version' package.json)" >> $GITHUB_ENV - - name: Select project based on base branch - id: select-project - run: | - if [[ ${{ github.ref }} == 'refs/heads/master' ]]; then - echo "PROJECT_ID=motrpac-portal" >> $GITHUB_ENV - else - echo "PROJECT_ID=motrpac-portal-dev" >> $GITHUB_ENV - fi + - name: Build and push server image (prod) + if: github.ref == 'refs/heads/master' + uses: docker/build-push-action@v5 + with: + push: true + file: Dockerfile + tags: | + us-docker.pkg.dev/motrpac-portal/datahub/frontend:${{ github.sha }} + us-docker.pkg.dev/motrpac-portal/datahub/frontend:${{ env.PACKAGE_VERSION }} + us-docker.pkg.dev/motrpac-portal/datahub/frontend:latest + cache-from: type=gha + cache-to: type=gha,mode=max + build-args: | + REACT_APP_ES_PROXY_HOST="${{secrets.REACT_APP_ES_PROXY_HOST}}" + REACT_APP_ES_PROXY_HOST_DEV="${{secrets.REACT_APP_ES_PROXY_HOST_DEV}}" + REACT_APP_API_SERVICE_ADDRESS="${{secrets.REACT_APP_API_SERVICE_ADDRESS}}" + REACT_APP_API_SERVICE_ADDRESS_DEV="${{secrets.REACT_APP_API_SERVICE_ADDRESS_DEV}}" + REACT_APP_API_SERVICE_KEY="${{secrets.REACT_APP_API_SERVICE_KEY}}" + REACT_APP_API_SERVICE_KEY_DEV="${{secrets.REACT_APP_API_SERVICE_KEY_DEV}}" + REACT_APP_SIGNED_URL_ENDPOINT="${{secrets.REACT_APP_SIGNED_URL_ENDPOINT}}" + REACT_APP_USER_REGISTRATION_ENDPOINT="${{secrets.REACT_APP_USER_REGISTRATION_ENDPOINT}}" + REACT_APP_SEND_EMAIL_ENDPOINT="${{secrets.REACT_APP_SEND_EMAIL_ENDPOINT}}" + REACT_APP_FILE_DOWNLOAD_ENDPOINT="${{secrets.REACT_APP_FILE_DOWNLOAD_ENDPOINT}}" + REACT_APP_QC_DATA_ENDPOINT="${{secrets.REACT_APP_QC_DATA_ENDPOINT}}" + REACT_APP_ES_ENDPOINT="${{secrets.REACT_APP_ES_ENDPOINT}}" + REACT_APP_FILE_SEARCH_ENDPOINT="${{secrets.REACT_APP_FILE_SEARCH_ENDPOINT}}" + REACT_APP_DATA_FILE_BUCKET="${{secrets.REACT_APP_DATA_FILE_BUCKET}}" + REACT_APP_QC_REPORT_BUCKET="${{secrets.REACT_APP_QC_REPORT_BUCKET}}" + REACT_APP_QC_REPORT_BUCKET_DEV="${{secrets.REACT_APP_QC_REPORT_BUCKET_DEV}}" + REACT_APP_ES_ACCESS_TOKEN="${{secrets.REACT_APP_ES_ACCESS_TOKEN}}" + REACT_APP_ES_ACCESS_TOKEN_DEV="${{secrets.REACT_APP_ES_ACCESS_TOKEN_DEV}}" + REACT_APP_reCAPTCHA_SITE_KEY="${{secrets.REACT_APP_reCAPTCHA_SITE_KEY}}" + REACT_APP_AUTH0_CLIENT_ID="${{secrets.REACT_APP_AUTH0_CLIENT_ID}}" + REACT_APP_QUALTRICS_SURVEY_URL="${{secrets.REACT_APP_QUALTRICS_SURVEY_URL}}" + REACT_APP_USER_SURVEY_SUBMIT_URL="${{secrets.REACT_APP_USER_SURVEY_SUBMIT_URL}}" + REACT_APP_USER_SURVEY_INPUT_1="${{secrets.REACT_APP_USER_SURVEY_INPUT_1}}" + REACT_APP_USER_SURVEY_INPUT_2="${{secrets.REACT_APP_USER_SURVEY_INPUT_2}}" + REACT_APP_USER_SURVEY_INPUT_3="${{secrets.REACT_APP_USER_SURVEY_INPUT_3}}" + REACT_APP_USER_SURVEY_INPUT_4="${{secrets.REACT_APP_USER_SURVEY_INPUT_4}}" + REACT_APP_USER_SURVEY_INPUT_5="${{secrets.REACT_APP_USER_SURVEY_INPUT_5}}" + REACT_APP_OFFICE_HOUR_DAY="${{secrets.REACT_APP_OFFICE_HOUR_DAY}}" + REACT_APP_OFFICE_HOUR_DATE="${{secrets.REACT_APP_OFFICE_HOUR_DATE}}" + REACT_APP_OFFICE_HOUR_SIGNUP_URL="${{secrets.REACT_APP_OFFICE_HOUR_SIGNUP_URL}}" - - name: Build and push server image + - name: Build and push server image (dev) + if: github.ref != 'refs/heads/master' uses: docker/build-push-action@v5 with: push: true + file: Dockerfile.dev tags: | - us-docker.pkg.dev/${{ env.PROJECT_ID }}/datahub/frontend:${{ github.sha }} - us-docker.pkg.dev/${{ env.PROJECT_ID }}/datahub/frontend:${{ env.PACKAGE_VERSION }} - us-docker.pkg.dev/${{ env.PROJECT_ID }}/datahub/frontend:latest + us-docker.pkg.dev/motrpac-portal-dev/datahub/frontend:${{ github.sha }} + us-docker.pkg.dev/motrpac-portal-dev/datahub/frontend:${{ env.PACKAGE_VERSION }} + us-docker.pkg.dev/motrpac-portal-dev/datahub/frontend:latest cache-from: type=gha cache-to: type=gha,mode=max build-args: | diff --git a/Dockerfile.dev b/Dockerfile.dev new file mode 100644 index 00000000..b8b92f3a --- /dev/null +++ b/Dockerfile.dev @@ -0,0 +1,102 @@ +# create-react-app build environment +FROM node:20-alpine as react-build +WORKDIR /app +ENV PATH /app/node_modules/.bin:$PATH + +COPY package*.json yarn.lock ./ +RUN --mount=type=cache,target=/root/.yarn \ + YARN_CACHE_FOLDER=/root/.yarn JOBS=max \ + yarn install --network-timeout 1000000 + +COPY src ./src +COPY public ./public +RUN --mount=type=cache,target=/root/.yarn \ + YARN_CACHE_FOLDER=/root/.yarn JOBS=max \ + yarn sass + +ARG REACT_APP_ES_PROXY_HOST +ARG REACT_APP_ES_PROXY_HOST_DEV +ARG REACT_APP_API_SERVICE_ADDRESS +ARG REACT_APP_API_SERVICE_ADDRESS_DEV +ARG REACT_APP_API_SERVICE_KEY +ARG REACT_APP_API_SERVICE_KEY_DEV +ARG REACT_APP_SIGNED_URL_ENDPOINT +ARG REACT_APP_USER_REGISTRATION_ENDPOINT +ARG REACT_APP_SEND_EMAIL_ENDPOINT +ARG REACT_APP_FILE_DOWNLOAD_ENDPOINT +ARG REACT_APP_QC_DATA_ENDPOINT +ARG REACT_APP_ES_ENDPOINT +ARG REACT_APP_FILE_SEARCH_ENDPOINT +ARG REACT_APP_DATA_FILE_BUCKET +ARG REACT_APP_QC_REPORT_BUCKET +ARG REACT_APP_QC_REPORT_BUCKET_DEV +ARG REACT_APP_ES_ACCESS_TOKEN +ARG REACT_APP_ES_ACCESS_TOKEN_DEV +ARG REACT_APP_reCAPTCHA_SITE_KEY +ARG REACT_APP_AUTH0_CLIENT_ID +ARG REACT_APP_QUALTRICS_SURVEY_URL +ARG REACT_APP_USER_SURVEY_SUBMIT_URL +ARG REACT_APP_USER_SURVEY_INPUT_1 +ARG REACT_APP_USER_SURVEY_INPUT_2 +ARG REACT_APP_USER_SURVEY_INPUT_3 +ARG REACT_APP_USER_SURVEY_INPUT_4 +ARG REACT_APP_USER_SURVEY_INPUT_5 +ARG REACT_APP_OFFICE_HOUR_DAY +ARG REACT_APP_OFFICE_HOUR_DATE +ARG REACT_APP_OFFICE_HOUR_SIGNUP_URL + +ENV ESLINT_NO_DEV_ERRORS true +ENV DISABLE_ESLINT_PLUGIN true +ENV REACT_APP_ES_PROXY_HOST $REACT_APP_ES_PROXY_HOST +ENV REACT_APP_ES_PROXY_HOST_DEV $REACT_APP_ES_PROXY_HOST_DEV +ENV REACT_APP_API_SERVICE_ADDRESS $REACT_APP_API_SERVICE_ADDRESS +ENV REACT_APP_API_SERVICE_ADDRESS_DEV $REACT_APP_API_SERVICE_ADDRESS_DEV +ENV REACT_APP_API_SERVICE_KEY $REACT_APP_API_SERVICE_KEY +ENV REACT_APP_API_SERVICE_KEY_DEV $REACT_APP_API_SERVICE_KEY_DEV +ENV REACT_APP_SIGNED_URL_ENDPOINT $REACT_APP_SIGNED_URL_ENDPOINT +ENV REACT_APP_USER_REGISTRATION_ENDPOINT $REACT_APP_USER_REGISTRATION_ENDPOINT +ENV REACT_APP_SEND_EMAIL_ENDPOINT $REACT_APP_SEND_EMAIL_ENDPOINT +ENV REACT_APP_FILE_DOWNLOAD_ENDPOINT $REACT_APP_FILE_DOWNLOAD_ENDPOINT +ENV REACT_APP_QC_DATA_ENDPOINT $REACT_APP_QC_DATA_ENDPOINT +ENV REACT_APP_ES_ENDPOINT $REACT_APP_ES_ENDPOINT +ENV REACT_APP_FILE_SEARCH_ENDPOINT $REACT_APP_FILE_SEARCH_ENDPOINT +ENV REACT_APP_DATA_FILE_BUCKET $REACT_APP_DATA_FILE_BUCKET +ENV REACT_APP_QC_REPORT_BUCKET $REACT_APP_QC_REPORT_BUCKET +ENV REACT_APP_QC_REPORT_BUCKET_DEV $REACT_APP_QC_REPORT_BUCKET_DEV +ENV REACT_APP_ES_ACCESS_TOKEN $REACT_APP_ES_ACCESS_TOKEN +ENV REACT_APP_ES_ACCESS_TOKEN_DEV $REACT_APP_ES_ACCESS_TOKEN_DEV +ENV REACT_APP_reCAPTCHA_SITE_KEY $REACT_APP_reCAPTCHA_SITE_KEY +ENV REACT_APP_AUTH0_CLIENT_ID $REACT_APP_AUTH0_CLIENT_ID +ENV REACT_APP_QUALTRICS_SURVEY_URL $REACT_APP_QUALTRICS_SURVEY_URL +ENV REACT_APP_USER_SURVEY_SUBMIT_URL $REACT_APP_USER_SURVEY_SUBMIT_URL +ENV REACT_APP_USER_SURVEY_INPUT_1 $REACT_APP_USER_SURVEY_INPUT_1 +ENV REACT_APP_USER_SURVEY_INPUT_2 $REACT_APP_USER_SURVEY_INPUT_2 +ENV REACT_APP_USER_SURVEY_INPUT_3 $REACT_APP_USER_SURVEY_INPUT_3 +ENV REACT_APP_USER_SURVEY_INPUT_4 $REACT_APP_USER_SURVEY_INPUT_4 +ENV REACT_APP_USER_SURVEY_INPUT_5 $REACT_APP_USER_SURVEY_INPUT_5 +ENV REACT_APP_OFFICE_HOUR_DAY $REACT_APP_OFFICE_HOUR_DAY +ENV REACT_APP_OFFICE_HOUR_DATE $REACT_APP_OFFICE_HOUR_DATE +ENV REACT_APP_OFFICE_HOUR_SIGNUP_URL $REACT_APP_OFFICE_HOUR_SIGNUP_URL +ENV NODE_ENV development + +RUN --mount=type=cache,target=/root/.yarn \ + YARN_CACHE_FOLDER=/root/.yarn JOBS=max \ + yarn build + +# nginx server environment +FROM nginxinc/nginx-unprivileged:1.25-alpine + +COPY nginx.conf /etc/nginx/conf.d/default.conf +COPY --from=react-build /app/build /usr/share/nginx/html + +LABEL org.opencontainers.image.description="MoTrPAC Data Portal Docker Image" +LABEL org.opencontainers.image.documentation="https://github.com/MoTrPAC/motrpac-frontend" +LABEL org.opencontainers.image.title="MoTrPAC Data Portal Web Client Server" +LABEL org.opencontainers.image.url="https://motrpac-data.org" +LABEL org.opencontainers.image.vendor="MoTrPAC" +LABEL org.opencontainers.image.version=$IMAGE_VERSION + +ENV NODE_ENV dev + +EXPOSE 8080 + diff --git a/docker-compose.dev.yaml b/docker-compose.dev.yaml new file mode 100644 index 00000000..5dca4861 --- /dev/null +++ b/docker-compose.dev.yaml @@ -0,0 +1,42 @@ +services: + web: + platform: linux/amd64 + image: motrpac-frontend:latest + ports: + - 34928:8080 + build: + context: . + dockerfile: Dockerfile.dev + args: + ESLINT_NO_DEV_ERRORS: true + DISABLE_ESLINT_PLUGIN: true + REACT_APP_ES_PROXY_HOST: ${REACT_APP_ES_PROXY_HOST} + REACT_APP_ES_PROXY_HOST_DEV: ${REACT_APP_ES_PROXY_HOST_DEV} + REACT_APP_API_SERVICE_ADDRESS: ${REACT_APP_API_SERVICE_ADDRESS} + REACT_APP_API_SERVICE_ADDRESS_DEV: ${REACT_APP_API_SERVICE_ADDRESS_DEV} + REACT_APP_API_SERVICE_KEY: ${REACT_APP_API_SERVICE_KEY} + REACT_APP_API_SERVICE_KEY_DEV: ${REACT_APP_API_SERVICE_KEY_DEV} + REACT_APP_SIGNED_URL_ENDPOINT: ${REACT_APP_SIGNED_URL_ENDPOINT} + REACT_APP_USER_REGISTRATION_ENDPOINT: ${REACT_APP_USER_REGISTRATION_ENDPOINT} + REACT_APP_SEND_EMAIL_ENDPOINT: ${REACT_APP_SEND_EMAIL_ENDPOINT} + REACT_APP_FILE_DOWNLOAD_ENDPOINT: ${REACT_APP_FILE_DOWNLOAD_ENDPOINT} + REACT_APP_QC_DATA_ENDPOINT: ${REACT_APP_QC_DATA_ENDPOINT} + REACT_APP_ES_ENDPOINT: ${REACT_APP_ES_ENDPOINT} + REACT_APP_FILE_SEARCH_ENDPOINT: ${REACT_APP_FILE_SEARCH_ENDPOINT} + REACT_APP_DATA_FILE_BUCKET: ${REACT_APP_DATA_FILE_BUCKET} + REACT_APP_QC_REPORT_BUCKET: ${REACT_APP_QC_REPORT_BUCKET} + REACT_APP_QC_REPORT_BUCKET_DEV: ${REACT_APP_QC_REPORT_BUCKET_DEV} + REACT_APP_ES_ACCESS_TOKEN: ${REACT_APP_ES_ACCESS_TOKEN} + REACT_APP_ES_ACCESS_TOKEN_DEV: ${REACT_APP_ES_ACCESS_TOKEN_DEV} + REACT_APP_reCAPTCHA_SITE_KEY: ${REACT_APP_reCAPTCHA_SITE_KEY} + REACT_APP_AUTH0_CLIENT_ID: ${REACT_APP_AUTH0_CLIENT_ID} + REACT_APP_QUALTRICS_SURVEY_URL: ${REACT_APP_QUALTRICS_SURVEY_URL} + REACT_APP_USER_SURVEY_SUBMIT_URL: ${REACT_APP_USER_SURVEY_SUBMIT_URL} + REACT_APP_USER_SURVEY_INPUT_1: ${REACT_APP_USER_SURVEY_INPUT_1} + REACT_APP_USER_SURVEY_INPUT_2: ${REACT_APP_USER_SURVEY_INPUT_2} + REACT_APP_USER_SURVEY_INPUT_3: ${REACT_APP_USER_SURVEY_INPUT_3} + REACT_APP_USER_SURVEY_INPUT_4: ${REACT_APP_USER_SURVEY_INPUT_4} + REACT_APP_USER_SURVEY_INPUT_5: ${REACT_APP_USER_SURVEY_INPUT_5} + REACT_APP_OFFICE_HOUR_DAY: ${REACT_APP_OFFICE_HOUR_DAY} + REACT_APP_OFFICE_HOUR_DATE: ${REACT_APP_OFFICE_HOUR_DATE} + REACT_APP_OFFICE_HOUR_SIGNUP_URL: ${REACT_APP_OFFICE_HOUR_SIGNUP_URL} diff --git a/package.json b/package.json index 86972b44..9b4b6c8a 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "MoTrPAC", - "version": "2.0.0-dev.3", + "version": "2.0.0-dev.5", "private": true, "dependencies": { "auth0-js": "9.20.0",