CI set-up frontend container image continuous creation

.github/workflows/build-push-images.yaml

@@ -0,0 +1,145 @@
+name: Reusable Build and Push Image
+
+on:
+  workflow_call:
+    inputs:
+      registry:
+        description: Registry hostname + namespace of image
+        required: true
+        type: string
+      image_name:
+        description: The name of the image
+        required: true
+        type: string
+      containerfile:
+        description: Path to Dockerfile or Containerfile for build
+        required: true
+        type: string
+      pre_build_cmd:
+        description: "Command to run before building images"
+        required: false
+        type: string
+      architectures:
+        description: Valid JSON string representing architectures to build
+        default: '["amd64", "arm64"]'
+        type: string
+        required: false
+      extra-args:
+        description: "Extra args to be passed to buildah bud. Separate arguments by newline. Do not use quotes."
+        default: ""
+        required: false
+        type: string
+      context:
+        description: "Path to directory to use as the build context."
+        default: ""
+        required: false
+        type: string
+    secrets:
+      registry_username:
+        description: "Registry username"
+        required: true
+      registry_password:
+        description: "Registry password"
+        required: true
+
+env:
+  tag: ${{ github.ref == 'refs/heads/main' && 'latest' || github.ref_name }}
+
+jobs:
+  build:
+    runs-on: ubuntu-latest
+    strategy:
+      matrix:
+        architecture: ${{ fromJSON(inputs.architectures) }}
+    steps:
+      - name: Maximize disk space
+        shell: bash
+        run: |
+          echo "Space before clearing:"
+          df . -h
+          sudo rm -rf /usr/share/dotnet
+          sudo rm -rf /opt/ghc
+          sudo rm -rf "/usr/local/share/boost"
+          sudo rm -rf "$AGENT_TOOLSDIRECTORY"
+          echo "Space after clearing:"
+          df . -h
+
+      - name: Checkout
+        uses: actions/checkout@v4
+
+      - name: Configure QEMU
+        uses: docker/setup-qemu-action@master
+        with:
+          platforms: all
+
+      - name: Image meta
+        id: meta
+        uses: docker/metadata-action@v4
+        with:
+          images: ${{ inputs.registry }}/${{ inputs.image_name }}
+          tags: |
+            type=schedule
+            type=semver,pattern={{version}}
+            type=semver,pattern={{major}}.{{minor}}
+            type=semver,pattern={{major}}
+            type=ref,event=branch
+            type=ref,event=pr
+            type=sha
+
+      - name: Run pre build command
+        shell: bash
+        run: "${{ inputs.pre_build_cmd }}"
+        if: "${{ inputs.pre_build_cmd != '' }}"
+
+      - name: Build Image
+        id: build
+        uses: redhat-actions/buildah-build@v2
+        with:
+          image: ${{ inputs.image_name }}
+          tags: ${{ env.tag }}-${{ matrix.architecture }}
+          extra-args: "--no-cache --rm ${{ inputs.extra-args }}"
+          archs: ${{ matrix.architecture }}
+          labels: ${{ steps.meta.outputs.labels }}
+          containerfiles: ${{ inputs.containerfile }}
+          context: ${{ inputs.context }}
+
+      - name: Push To Registry
+        uses: redhat-actions/push-to-registry@v2
+        id: push
+        with:
+          image: ${{ steps.build.outputs.image }}
+          tags: ${{ env.tag }}-${{ matrix.architecture }}
+          username: ${{ secrets.registry_username }}
+          password: ${{ secrets.registry_password }}
+          registry: ${{ inputs.registry }}
+
+  manifest:
+    needs: build
+    runs-on: ubuntu-latest
+    steps:
+      - name: Log in to registry
+        uses: redhat-actions/podman-login@v1
+        with:
+          username: ${{ secrets.registry_username }}
+          password: ${{ secrets.registry_password }}
+          registry: ${{ inputs.registry }}
+
+      - name: Create manifest
+        shell: bash
+        run: |
+          podman manifest create "${{ inputs.registry }}/${{ inputs.image_name }}:${{ env.tag }}"
+          for arch in $(echo '${{ inputs.architectures }}' | jq -r '.[]'); do
+            podman manifest add \
+              "${{ inputs.registry }}/${{ inputs.image_name }}:${{ env.tag }}" \
+              "${{ inputs.registry }}/${{ inputs.image_name }}:${{ env.tag }}-${arch}"
+          done
+
+      - name: Push To Registry
+        uses: redhat-actions/push-to-registry@v2
+        id: push
+        with:
+          image: ${{ inputs.image_name }}
+          tags: ${{ env.tag }}
+          username: ${{ secrets.registry_username }}
+          password: ${{ secrets.registry_password }}
+          registry: ${{ inputs.registry }}

.github/workflows/frontend-image-build.yaml

@@ -0,0 +1,31 @@
+name: Frontend Multiple Architecture Image Build
+
+on:
+  workflow_dispatch:
+  push:
+    branches:
+      - "main"
+      - "release-*"
+    paths:
+      - "frontend/**"
+      - ".github/workflows/**"
+    tags:
+      - "v*"
+
+concurrency:
+  group: build-${{ github.ref }}
+  cancel-in-progress: true
+
+jobs:
+  image-build:
+    uses: ./.github/workflows/build-push-images.yaml
+    with:
+      registry: "ghcr.io"
+      image_name: "${{ github.repository_owner }}/trustify-ui"
+      containerfile: "./frontend/Containerfile"
+      architectures: '[ "amd64" ]'
+      extra-args: "--ulimit nofile=4096:4096"
+      context: "frontend"
+    secrets:
+      registry_username: ${{ github.actor }}
+      registry_password: ${{ secrets.GITHUB_TOKEN }}

frontend/.npmrc

@@ -1 +1,2 @@
 engine-strict=true
+fetch-timeout=60000

frontend/Dockerfile → frontend/Containerfile

@@ -15,18 +15,18 @@ RUN microdnf -y install tar procps-ng && microdnf clean all
 
 USER 1001
 
-LABEL name="trustification/trustification-ui" \
-      description="Trustification - User Interface" \
+LABEL name="trustify/trustify-ui" \
+      description="Trustify - User Interface" \
       help="For more information visit https://trustification.github.io/" \
       license="Apache License 2.0" \
       maintainer="[email protected]" \
-      summary="Trustification - User Interface" \
-      url="https://quay.io/repository/trustification/trustification-ui" \
-      usage="podman run -p 80 -v trustification/trustification-ui:latest" \
-      io.k8s.display-name="trustification-ui" \
-      io.k8s.description="Trustification - User Interface" \
+      summary="Trustify - User Interface" \
+      url="https://ghcr.io/trustification/trustify-ui" \
+      usage="podman run -p 80 -v trustification/trustify-ui:latest" \
+      io.k8s.display-name="trustify-ui" \
+      io.k8s.description="Trustify - User Interface" \
       io.openshift.expose-services="80:http" \
-      io.openshift.tags="operator,trustification,ui,nodejs18" \
+      io.openshift.tags="operator,trustification,trustify,ui,nodejs20" \
       io.openshift.min-cpu="100m" \
       io.openshift.min-memory="350Mi"
 

frontend/README.md

@@ -27,8 +27,12 @@ npm clean-install --ignore-scripts
 npm run start:dev
 ```
 
-> Known issue: after installing the dependencies for the first time and then executing `npm run start:dev` you will see an error `config/webpack.dev.ts(18,8): error TS2307: Cannot find module '@trustification-ui/common' or its corresponding type declarations`
-> Stop the comand with Ctrl+C and run the command `npm run start:dev` again and the error should be gone. This only happens the very first time we install dependencies in a clean environment, subsequent commands `npm run start:dev` should not give that error. (bug under investigation)
+> Known issue: after installing the dependencies for the first time and then executing `npm run start:dev` you will see
+> an error
+> `config/webpack.dev.ts(18,8): error TS2307: Cannot find module '@trustification-ui/common' or its corresponding type declarations`
+> Stop the comand with Ctrl+C and run the command `npm run start:dev` again and the error should be gone. This only
+> happens the very first time we install dependencies in a clean environment, subsequent commands `npm run start:dev`
+> should not give that error. (bug under investigation)
 
 Open browser at <http://localhost:3000>
 
@@ -40,6 +44,6 @@ Open browser at <http://localhost:3000>
 | AUTH_REQUIRED          | Enable/Disable authentication | false                                |
 | OIDC_CLIENT_ID         | Set Oidc Client               | frontend                             |
 | OIDC_SERVER_URL        | Set Oidc Server URL           | http://localhost:8090/realms/chicken |
-| OIDC_Scope             | Set Oidc Scope                | openid                               |
+| OIDC_SCOPE             | Set Oidc Scope                | openid                               |
 | ANALYTICS_ENABLED      | Enable/Disable analytics      | false                                |
 | ANALYTICS_WRITE_KEY    | Set Segment Write key         | null                                 |