Ansible playbooks for deploying UI stack.

.github/workflows/images.yml

@@ -48,6 +48,90 @@ jobs:
           cache-to: type=gha,mode=max
           file: gobot/Containerfile
 
+  push_to_registries_ui:
+    name: Push UI container image to GHCR
+    runs-on: ubuntu-latest
+    permissions:
+      packages: write
+      contents: read
+    steps:
+      - name: Check out the repo
+        uses: actions/checkout@v4
+
+      - name: Log in to the Container registry
+        uses: docker/login-action@v3
+        with:
+          registry: ghcr.io
+          username: ${{ github.actor }}
+          password: ${{ secrets.GITHUB_TOKEN }}
+
+      - uses: docker/setup-buildx-action@v3
+
+      - name: Extract metadata (tags, labels) for UI image
+        id: ui_meta
+        uses: docker/metadata-action@v5
+        with:
+          images: |
+            ghcr.io/${{ github.repository }}/bot-ui
+
+      - name: Build and push ui image
+        uses: docker/build-push-action@v5
+        with:
+          context: .
+          platforms: linux/amd64,linux/arm64
+          build-args: |
+            GITHUB_USER=instructlab-bot
+            GITHUB_TOKEN=${{ secrets.BOT_GITHUB_TOKEN }}
+          target: ui
+          push: true
+          tags: ${{ steps.ui_meta.outputs.tags }}
+          labels: ${{ steps.ui_meta.outputs.labels }}
+          cache-from: type=gha
+          cache-to: type=gha,mode=max
+          file: ui/Containerfile
+
+  push_to_registries_apiserver:
+    name: Push apiserver container image to GHCR
+    runs-on: ubuntu-latest
+    permissions:
+      packages: write
+      contents: read
+    steps:
+      - name: Check out the repo
+        uses: actions/checkout@v4
+
+      - name: Log in to the Container registry
+        uses: docker/login-action@v3
+        with:
+          registry: ghcr.io
+          username: ${{ github.actor }}
+          password: ${{ secrets.GITHUB_TOKEN }}
+
+      - uses: docker/setup-buildx-action@v3
+
+      - name: Extract metadata (tags, labels) for apiserver image
+        id: apiserver_meta
+        uses: docker/metadata-action@v5
+        with:
+          images: |
+            ghcr.io/${{ github.repository }}/apiserver
+
+      - name: Build and push apiserver image
+        uses: docker/build-push-action@v5
+        with:
+          context: .
+          platforms: linux/amd64,linux/arm64
+          build-args: |
+            GITHUB_USER=instructlab-bot
+            GITHUB_TOKEN=${{ secrets.BOT_GITHUB_TOKEN }}
+          target: ui
+          push: true
+          tags: ${{ steps.apiserver_meta.outputs.tags }}
+          labels: ${{ steps.apiserver_meta.outputs.labels }}
+          cache-from: type=gha
+          cache-to: type=gha,mode=max
+          file: ui/apiserver/Containerfile
+
   push_to_registries_serve:
     name: Push serve container image to GHCR
     runs-on: ubuntu-latest

deploy/ansible/README.md

@@ -117,6 +117,14 @@ This playbook installs all the components in the containers.
 ansible-playbook -i inventory.txt  -e @secrets.enc --ask-vault-pass deploy-bot-stack.yml
 ```
 
+## Install the UI stack that works with the Bot stack
+
+This playbook installs all the required UI components in the containers.
+
+```console
+ansible-playbook -i inventory.txt  -e @secrets.enc --ask-vault-pass deploy-ui-stack.yml
+```
+
 ## Install the Worker stack (first time installation)
 
 This playbook installs all the required component on the host itself

deploy/ansible/deploy-ui-stack.yml

@@ -0,0 +1,18 @@
+# Description: This file is used to deploy the UI stack on the bot node.
+# It assumes that the gobot and redis is already deployed on the bot node.
+- name: Deploy UI stack on bot node
+  hosts: botNode
+  roles:
+    - role: geerlingguy.docker
+      become: true
+    - role: packages
+      become: true
+    - role: nexodus
+      become: true
+    - role: ui
+      become: true
+  vars_files:
+    - vars.yml
+  environment:
+    API_USER: "${API_USER:-<username>}"
+    API_PASS: "${API_PASS:-<password>}"

deploy/ansible/gobot/tasks/main.yml

@@ -12,14 +12,16 @@
     image: ghcr.io/instructlab/instructlab-bot/instructlab-gobot:main
     state: started
     pull: always
+    ports:
+      - 8081:8081
     env:
       ILBOT_GITHUB_INTEGRATION_ID: "{{ app_id }}"  # Github App Id after bot's registration.
       ILBOT_GITHUB_APP_PRIVATE_KEY: "{{ private_key }}"  # Private key generate for the bot app
       ILBOT_GITHUB_WEBHOOK_SECRET: "{{ webhook_secret }}"  # Webhook secret created during bot registration
       ILBOT_WEBHOOK_PROXY_URL: "{{ webhook_proxy_url }}"  # Webhook URL set for the bot application to receive webhook events
       ILBOT_REDIS: "{{ redis_ip }}:6379"  # Redis address to push and pull the jobs and results
       ILBOT_HTTP_ADDRESS: "127.0.0.1"  # Bot's local http server ip address
-      ILBOT_HTTP_PORT: "8080"  # Bot's local http server port
+      ILBOT_HTTP_PORT: "8081"  # Bot's local http server port
       # List of teams that are allowed to run bot commands on the PR
       ILBOT_MAINTAINERS: "taxonomy-triagers,taxonomy-approvers,taxonomy-maintainers,labrador-org-maintainers,instruct-lab-bot-maintainers"
       ILBOT_REQUIRED_LABELS: "skill,knowledge"  # Labels required on each PR to run any bot command.

deploy/ansible/ui/tasks/main.yaml

@@ -0,0 +1,31 @@
+---
+- name: Log into GHCR
+  community.docker.docker_login:
+    registry_url: ghcr.io
+    username: instructlab-bot
+    password: "{{ github_token }}"
+    reauthorize: true
+
+- name: Start the apiserver container
+  community.docker.docker_container:
+    name: apiserver
+    image: ghcr.io/instructlab/instructlab-bot/apiserver:main
+    state: started
+    pull: always
+    env:
+      LISTEN_ADDRESS: "${LISTEN_ADDRESS:-:3000}"
+      REDIS_SERVER: "${REDIS_SERVER:-redis:6379}"
+      DEBUG_MODE: "${DEBUG_MODE:-false}"
+      TEST_MODE: "${TEST_MODE:-false}"
+      BOT_URL: "${BOT_URL:-http://instructlab-bot:8081}"
+    ports:
+      - 3000:3000
+
+- name: Start the ui container
+  community.docker.docker_container:
+    name: ui
+    image: ghcr.io/instructlab/instructlab-bot/bot-ui:main
+    state: started
+    pull: always
+    ports:
+      - 8080:8080

deploy/compose/dev-single-worker-with-ui.yaml

@@ -37,6 +37,7 @@ services:
       API_PASS: "${API_PASS:-floofykittens}"
       DEBUG_MODE: "${DEBUG_MODE:-true}"
       TEST_MODE: "${TEST_MODE:-true}"
+      BOT_URL: "${BOT_URL:-http://bot:8081}"
     ports:
       - 3000:3000
 

ui/apiserver/Containerfile

@@ -40,4 +40,4 @@ WORKDIR /data
 COPY --from=builder /app/instructlab-bot/ui/apiserver/apiserver /usr/local/bin/apiserver
 
 # Run the apiserver binary with environment variables
-CMD /usr/local/bin/apiserver --listen-address=${LISTEN_ADDRESS:-localhost:3000} --redis-server=${REDIS_SERVER:-localhost:6379} --api-user=${API_USER:-kitteh} --api-pass=${API_PASS:-floofykittens} --debug=${DEBUG_MODE:-false} --test-mode=${TEST_MODE:-false}
+CMD /usr/local/bin/apiserver --listen-address=${LISTEN_ADDRESS:-localhost:3000} --bot-url ${BOT_URL:-http://instructlab-bot:8081}  --redis-server=${REDIS_SERVER:-localhost:6379} --api-user=${API_USER:-kitteh} --api-pass=${API_PASS:-floofykittens} --debug=${DEBUG_MODE:-false} --test-mode=${TEST_MODE:-false}

ui/src/app/Contribute/Knowledge/Knowledge.css

@@ -80,4 +80,4 @@
 	text-shadow: #45a049;
 	font-size: large;
 	color: rgb(4, 4, 135);
-}
+}