feat: publishing images per environment

.env.production

@@ -0,0 +1,5 @@
+REACT_APP_AAD_CLIENT_ID=e8a0f8e6-059b-426f-9011-40f463640285
+REACT_APP_AAD_TENANT_ID=3aa4a235-b6e2-48d5-9195-7fcf05b459b0
+REACT_APP_AAD_REDIRECT_URI=/
+REACT_APP_BACKEND_URL=https://api-pepm-dev.radix.equinor.com
+REACT_APP_BACKEND_API_SCOPE=api://e8a0f8e6-059b-426f-9011-40f463640285/read

.env.test

@@ -0,0 +1,5 @@
+REACT_APP_AAD_CLIENT_ID=968bcf2a-6292-441d-bbd9-755a3a8f3ec1
+REACT_APP_AAD_TENANT_ID=3aa4a235-b6e2-48d5-9195-7fcf05b459b0
+REACT_APP_AAD_REDIRECT_URI=/
+REACT_APP_BACKEND_URL=https://api-pepm-test.radix.equinor.com/
+REACT_APP_BACKEND_API_SCOPE=api://968bcf2a-6292-441d-bbd9-755a3a8f3ec1/read

.github/workflows/on-push-main.yaml

@@ -1,6 +1,17 @@
 on: 
-  workflow_call
+  push:
+    branches:
+      main
+
 
 jobs:
-  publish-latest:
+  publish-image:
+    strategy:
+      matrix:
+        environment: [dev, test, production]
+
     uses: ./.github/workflows/publish.yaml
+    with:
+      ENVIRONMENT: ${{ matrix.environment }}
+
+

.github/workflows/on-tag.yaml

@@ -23,10 +23,10 @@ jobs:
   publish-prod:
     uses: ./.github/workflows/publish.yaml
     with:
-      IMAGE_TAG: production
+      ENVIRONMENT: production
 
   publish-tag:
     needs: [set-tag-ref]
     uses: ./.github/workflows/publish.yaml
     with:
-      IMAGE_TAG: ${{ needs.set-tag-ref.outputs.tag-ref }}
+      ENVIRONMENT: ${{ needs.set-tag-ref.outputs.tag-ref }}

.github/workflows/publish.yaml

@@ -1,24 +1,24 @@
 on:
   workflow_call:
     inputs:
-      IMAGE_TAG:
-        default: latest
+      ENVIRONMENT:
         type: string
 
 jobs:
   build-and-publish:
     name: Build and Publish
     runs-on: ubuntu-latest
+    environment: ${{inputs.ENVIRONMENT}}
 
     steps:
       - uses: actions/checkout@master
-      - run: echo "Tagging with ${{inputs.IMAGE_TAG}}"
+      - run: echo "Tagging with ${{inputs.ENVIRONMENT}}"
 
       - name: Build Container Image
-        run: IMAGE_TAG=${{inputs.IMAGE_TAG}} docker compose build
+        run: ENVIRONMENT=${{inputs.ENVIRONMENT}} docker compose build
 
       - name: Authenticate Against Container Registry
         run: echo ${{ secrets.GITHUB_TOKEN }} | docker login ghcr.io -u $GITHUB_ACTOR --password-stdin
 
       - name: Publish Container Image
-        run: IMAGE_TAG=${{inputs.IMAGE_TAG}} docker compose push
+        run: ENVIRONMENT=${{inputs.ENVIRONMENT}} docker compose push

Dockerfile

@@ -6,14 +6,40 @@ COPY package.json yarn.lock ./
 RUN yarn install --ignore-scripts --frozen-lockfile --link-duplicates
 COPY . .
 
-FROM base AS development
+FROM base AS local
 CMD ["yarn", "start"]
 
-FROM base AS production
+FROM base AS dev
+
+RUN yarn global add serve
+RUN yarn run build:dev
+# Add non-root user
+RUN deluser --remove-home node \
+    && addgroup -S node -g 1001 \
+    && adduser -S -G node -u 1001 node
+
+USER 1001
+EXPOSE 3000
+CMD ["serve", "build", "--listen", "3000"]
+
+
+FROM base AS test
 
 RUN yarn global add serve
-RUN yarn build
+RUN yarn run build:test
+# Add non-root user
+RUN deluser --remove-home node \
+    && addgroup -S node -g 1001 \
+    && adduser -S -G node -u 1001 node
 
+USER 1001
+EXPOSE 3000
+CMD ["serve", "build", "--listen", "3000"]
+
+FROM base AS production
+
+RUN yarn global add serve
+RUN yarn run build:production
 # Add non-root user
 RUN deluser --remove-home node \
     && addgroup -S node -g 1001 \

docker-compose.yaml

@@ -1,9 +1,10 @@
 version: '3.9'
 services:
+
   pepm-ui:
-    image: ghcr.io/equinor/pepm-ui/pepm-ui:${IMAGE_TAG:-latest}
+    image: ghcr.io/equinor/pepm-ui/pepm-ui:${ENVIRONMENT}.latest
     build:
-      target: production
+      target: ${ENVIRONMENT}
       context: .
     ports:
       - 3000:3000

package.json

@@ -21,6 +21,7 @@
     "@types/react": "^18.0.0",
     "@types/react-dom": "^18.0.0",
     "axios": "^1.6.0",
+    "env-cmd": "^10.1.0",
     "openapi-fetch": "^0.7.2",
     "openapi-typescript-codegen": "^0.25.0",
     "react": "^18.2.0",
@@ -34,7 +35,10 @@
     "zod": "^3.22.4"
   },
   "scripts": {
-    "start": "react-scripts start",
+    "start": "env-cmd -f .env.local react-scripts start",
+    "build:dev": "env-cmd -f .env.dev react-scripts build",
+    "build:test": "env-cmd -f .env.test react-scripts build",
+    "build:production": "env-cmd -f .env.production react-scripts build",
     "build": "react-scripts build",
     "test": "react-scripts test --transformIgnorePatterns \"node_modules/(?!axios)/\"",
     "test:ts": "tsc --noEmit",

radixconfig.yaml

@@ -12,21 +12,18 @@ spec:
     - name: prod
   components:
     - name: web
-      src: .
+      image: ghcr.io/equinor/pepm-core-api/pepm-api:{imageTagName}
       publicPort: http
       ports:
         - name: http
           port: 3000
-      variables:
-        REACT_APP_AAD_TENANT_ID: ""
-        REACT_APP_AAD_CLIENT_ID: ""
-        REACT_APP_AAD_REDIRECT_URI: ""
-        REACT_APP_BACKEND_URL: ""
-        REACT_APP_BACKEND_API_SCOPE: ""
       environmentConfig:
         - environment: dev
+            imageTagName: dev.latest
         - environment: test
+            imageTagName: test.latest
         - environment: prod
+            imageTagName: production.latest
     - name: api
       image: ghcr.io/equinor/pepm-core-api/pepm-api:{imageTagName}
       publicPort: http

yarn.lock

@@ -3851,7 +3851,7 @@ cosmiconfig@^7.0.0:
     path-type "^4.0.0"
     yaml "^1.10.0"
 
-cross-spawn@^7.0.2, cross-spawn@^7.0.3:
+cross-spawn@^7.0.0, cross-spawn@^7.0.2, cross-spawn@^7.0.3:
   version "7.0.3"
   resolved "https://registry.npmjs.org/cross-spawn/-/cross-spawn-7.0.3.tgz"
   integrity sha512-iRDPJKUPVEND7dHPO8rkbOnPpyDygcDFtWjpeWNCgy8WP2rXcxXL8TskReQl6OrB2G7+UJrags1q15Fudc7G6w==
@@ -4459,6 +4459,14 @@ entities@^2.0.0:
   resolved "https://registry.npmjs.org/entities/-/entities-2.2.0.tgz"
   integrity sha512-p92if5Nz619I0w+akJrLZH0MX0Pb5DX39XOwQTtXSdQQOaYH03S1uIQp4mhOZtAXrxq4ViO67YTiLBo2638o9A==
 
+env-cmd@^10.1.0:
+  version "10.1.0"
+  resolved "https://registry.yarnpkg.com/env-cmd/-/env-cmd-10.1.0.tgz#c7f5d3b550c9519f137fdac4dd8fb6866a8c8c4b"
+  integrity sha512-mMdWTT9XKN7yNth/6N6g2GuKuJTsKMDHlQFUDacb/heQRRWOTIZ42t1rMHnQu4jYxU1ajdTeJM+9eEETlqToMA==
+  dependencies:
+    commander "^4.0.0"
+    cross-spawn "^7.0.0"
+
 error-ex@^1.3.1:
   version "1.3.2"
   resolved "https://registry.npmjs.org/error-ex/-/error-ex-1.3.2.tgz"