feat: add docker publish ci configs

.github/actions/docker-publish/action.yaml

@@ -0,0 +1,79 @@
+name: 'Build & Plush Docker'
+
+inputs:
+  compose-version:
+    description: 'Docker Dompose version'
+    default: 2.6.0
+  registry:
+    description: 'Docker registry service'
+    default: ghcr.io
+  username:
+    description: 'Username for https://ghcr.io'
+    required: true
+  password:
+    description: 'Password for https://ghcr.io'
+    required: true
+  image:
+    description: 'Image name with provider url'
+    required: true
+  dockerfile:
+    description: 'Path to the Dockerfile'
+    required: true
+  build-args:
+    description: 'List of build-time variables'
+    required: false
+
+outputs:
+  image:
+    description: 'Image url'
+    value: ${{ steps.imageOuput.outputs.imageUrl }}
+  imageid:
+    description: 'Image ID'
+    value: ${{ steps.publish.outputs.imageId }}
+  digest:
+    description: 'Image digest'
+    value: ${{ steps.publish.outputs.digest }}
+  metadata:
+    description: 'Build result metadata'
+    value: ${{ steps.publish.outputs.metadata }}
+
+runs:
+  using: 'composite'
+  steps:
+    - name: Log in to the ghcr.io registry
+      uses: docker/login-action@v2
+      with:
+        registry: ${{ inputs.registry }}
+        username: ${{ inputs.username }}
+        password: ${{ inputs.password }}
+
+    - name: Docker meta
+      id: meta
+      uses: docker/metadata-action@v3
+      with:
+        images: |
+          ${{ inputs.image }}
+        tags: |
+          type=ref,event=branch
+          type=sha,prefix=
+          type=semver,pattern={{raw}}
+
+    - name: Set up Docker Buildx
+      uses: docker/setup-buildx-action@v1
+
+    - name: Build and push the image to ghcr.io
+      uses: docker/build-push-action@v4
+      id: publish
+      with:
+        context: .
+        file: ${{ inputs.dockerfile }}
+        push: true
+        tags: ${{ steps.meta.outputs.tags }}
+        labels: ${{ steps.meta.outputs.labels }}
+        build-args: ${{ inputs.build-args }}
+        cache-from: type=gha
+        cache-to: type=gha,mode=max
+    - id: imageOuput
+      shell: bash
+      run: |
+        echo "imageUrl=${{ fromJSON(steps.publish.outputs.metadata)['image.name'] }}" >> $GITHUB_OUTPUT

.github/workflows/docker-publish.yml

@@ -0,0 +1,32 @@
+name: Build ad publish Docker image
+
+on:
+  push:
+    branches:
+      - main
+  pull_request:
+    types: [opened, synchronize]
+  release:
+    types: [published]
+
+concurrency:
+  group: ${{ github.workflow }}-${{ github.event.pull_request.number || github.ref }}
+  cancel-in-progress: true
+
+jobs:
+  build-and-publish-image:
+    runs-on: buildjet-4vcpu-ubuntu-2204
+    if: |
+      (github.event_name == 'release' && github.event.action == 'published') ||
+      github.ref == 'refs/heads/main' || github.event_name == 'pull_request'
+    steps:
+      - uses: actions/checkout@v3
+
+      - name: Build and push Fuel Explorer Server Only image
+        uses: ./.github/actions/docker-publish
+        id: publish
+        with:
+          username: ${{ github.repository_owner }}
+          password: ${{ secrets.GITHUB_TOKEN }}
+          image: ghcr.io/fuellabs/fuel-explorer
+          dockerfile: deployment/Dockerfile

.github/workflows/pr-preview.yml

@@ -9,22 +9,38 @@ jobs:
   deploy:
     permissions:
       contents: read
+      packages: write
       deployments: write
       pull-requests: write
       statuses: write
     name: deploy
-    runs-on: ubuntu-latest
+    runs-on: buildjet-4vcpu-ubuntu-2204
     timeout-minutes: 30
     steps:
       - uses: actions/checkout@v3
 
+      - name: Build and push Fuel Explorer Preview image
+        if: ${{ github.event.action == 'opened' || github.event.action == 'synchronize' }}
+        uses: ./.github/actions/docker-publish
+        id: publish
+        with:
+          username: ${{ github.repository_owner }}
+          password: ${{ secrets.GITHUB_TOKEN }}
+          image: ghcr.io/fuellabs/fuel-explorer-preview
+          dockerfile: deployment/preview.Dockerfile
+
       - name: Add pullpreview label
         if: ${{ github.event.action == 'opened' || github.event.action == 'synchronize' }}
         uses: KeisukeYamashita/attach-labels@v1
         with:
           labels: pullpreview
           token: ${{ secrets.GITHUB_TOKEN }}
 
+      - name: Create .env config
+        shell: bash
+        run: |
+          echo "FUEL_EXPLORER_PREVIEW_IMAGE=${{ steps.publish.outputs.image }}" >> .preview/.env
+
       - uses: pullpreview/[email protected]
         with:
           github_token: ${{ secrets.GITHUB_TOKEN }}

.preview/docker-compose.yml

@@ -4,13 +4,11 @@ services:
   fuel-explorer:
     platform: linux/amd64
     container_name: fuel-explorer
-    build:
-      context: ../
-      dockerfile: ./.preview/Dockerfile
-      args:
-        IS_PREVIEW: true
-        GRAPHQL_API: http://localhost:4444/graphql
-        FUEL_PROVIDER_URL: http://beta-4.fuel.network/graphql
+    image: ${FUEL_EXPLORER_PREVIEW_IMAGE}
+    env_file:
+      - .env
+    environment:
+      FUEL_PROVIDER_URL: 'http://beta-4.fuel.network/graphql'
     ports:
       - '80:3000'
       - '4000:4444'

deployment/Dockerfile

@@ -0,0 +1,23 @@
+# This image contains the graphql server
+# built for the fuel-explorer
+FROM node:20-slim AS base
+
+# Expose the ENVs to the env of the container
+ENV PORT="${PORT}"
+ENV FUEL_PROVIDER_URL="${FUEL_PROVIDER_URL}"
+ENV PNPM_HOME="/pnpm"
+ENV PATH="$PNPM_HOME:$PATH"
+
+# Enable pnpm using corepack form node.js
+RUN corepack enable
+
+COPY . /app
+WORKDIR /app
+
+RUN pnpm install --frozen-lockfile
+
+EXPOSE 4444
+
+WORKDIR /app/packages/graphql
+
+CMD ["pnpm", "start"]

.preview/Dockerfile → deployment/preview.Dockerfile

@@ -1,27 +1,31 @@
+# This image contains a preview environment
+# of the fuel-explorer containing;
+# graphql server, next.js app ui, and storybooks
 FROM node:20-slim AS base
 
 # Receive envs on build time
-ARG IS_PREVIEW
-ARG GRAPHQL_API
-ARG FUEL_PROVIDER_URL
+ARG IS_PREVIEW=true
+ARG GRAPHQL_API=http://localhost:4444/graphql
 
 # Expose the args to the env of the container
 ENV IS_PREVIEW="${IS_PREVIEW}"
 ENV GRAPHQL_API="${GRAPHQL_API}"
-ENV FUEL_PROVIDER_URL="${FUEL_PROVIDER_URL}"
 
+# Expose the ENVs to the env of the container
+ENV FUEL_PROVIDER_URL="${FUEL_PROVIDER_URL}"
 ENV PNPM_HOME="/pnpm"
 ENV PATH="$PNPM_HOME:$PATH"
 
+# Enable pnpm using corepack form node.js
 RUN corepack enable
 
 COPY . /preview
-
 WORKDIR /preview
 
 RUN pnpm install --frozen-lockfile
 RUN pnpm build:preview
 
 EXPOSE 3000
+EXPOSE 4444
 
-CMD ["pnpm", "start"]
+CMD ["pnpm", "start"]