Feature(point-of-sale): AB testing (#235)

* feat(point-of-sale): add git tag info component

* CI(point-of-sale): add GitHub action for AB test build

.github/workflows/point-of-sale-docker-ab.yml

@@ -0,0 +1,76 @@
+name: Point of Sale - Dockerize - AB Test
+
+on:
+  workflow_dispatch:
+  push:
+    branches: [ develop ]
+  pull_request:
+    branches: [ develop ]
+
+concurrency:
+  group: ${{ github.workflow }}-${{ github.ref }}
+  cancel-in-progress: true
+
+jobs:
+  dockerize:
+    runs-on: ubuntu-latest
+    container:
+      image: docker:dind
+    steps:
+      - name: upgrade git
+        run: |
+          apk add --update
+          apk add git
+          git --version 
+
+      - name: Checkout repository
+        uses: actions/checkout@v4
+        with:
+          path: .
+          fetch-depth: 0
+          fetch-tags: true
+
+      - name: Set up environment - main
+        env:
+          ENV_FILE: ${{ vars.ENV_FILE_PRODUCTION }}
+        run: |
+          echo "${ENV_FILE}" > ./apps/point-of-sale/.env
+
+      - name: Get Docker meta (for tags)
+        id: meta
+        uses: docker/metadata-action@v4
+        with:
+          # list of Docker images to use as base name for tags
+          images: |
+            ${{ vars.DOCKER_REGISTRY }}/${{ vars.DOCKER_TAG_POS }}
+          # generate Docker tags based on the following events/attributes
+          tags: |
+            type=ref,event=branch,pattern={{branch}}-AB
+            type=semver,pattern={{version}}
+
+      - name: Set up QEMU
+        uses: docker/setup-qemu-action@v2
+
+      - name: Set up Docker Buildx
+        uses: docker/setup-buildx-action@v2
+
+      - name: Login to SudoSOS Container Registry
+        if: ${{ github.event_name == 'push' || github.event_name == 'workflow_dispatch' }}
+        uses: docker/login-action@v2
+        with:
+          registry: ${{ vars.DOCKER_REGISTRY }}
+          username: ${{ secrets.SVC_GH_SUDOSOS_USERNAME }}
+          password: ${{ secrets.SVC_GH_SUDOSOS_PWD }}
+
+      # Build and push Docker image with Buildx
+      - name: Build and push
+        uses: docker/build-push-action@v3
+        with:
+          context: .
+          platforms: linux/amd64 #SudoSOS does not run on linux/arm64
+          push: ${{ github.event_name == 'push' || github.event_name == 'workflow_dispatch' }}
+          tags: ${{ steps.meta.outputs.tags }}
+          labels: ${{ steps.meta.outputs.labels }}
+          cache-from: type=gha
+          cache-to: type=gha,mode=max
+          file: "apps/point-of-sale/Dockerfile"

.github/workflows/point-of-sale-docker.yml

@@ -21,6 +21,8 @@ jobs:
         uses: actions/checkout@v4
         with:
           path: .
+          fetch-depth: 0
+          fetch-tags: true
 
       - name: Set up environment - main
         env:

apps/point-of-sale/Dockerfile

@@ -4,6 +4,7 @@ WORKDIR /app
 COPY lib/common/ lib/common/
 COPY apps/point-of-sale/package.json apps/point-of-sale/
 COPY ./package.json ./package-lock.json ./
+COPY ./.git ./
 RUN npm install
 COPY apps/point-of-sale/ apps/point-of-sale/
 RUN npm run build --workspace=sudosos-point-of-sale

apps/point-of-sale/env.d.ts

@@ -1 +1,3 @@
 /// <reference types="vite/client" />
+declare const __GIT_BRANCH__: string;
+declare const __GIT_COMMIT__: string;

apps/point-of-sale/src/components/GitInfo.vue

@@ -0,0 +1,15 @@
+<template>
+  <div class="absolute tag font-bold opacity-30"> {{branch}}#{{commit}} </div>
+</template>
+
+<script setup lang="ts">
+const branch = __GIT_BRANCH__;
+const commit = __GIT_COMMIT__;
+</script>
+
+<style scoped lang="scss">
+.tag {
+  bottom: 10px;
+  right: 10px;
+}
+</style>

apps/point-of-sale/src/views/LoginView.vue

@@ -29,6 +29,7 @@
     </div>
   </div>
   <SettingsIconComponent />
+  <GitInfo/>
   <EanLoginComponent :handle-login="eanLogin"/>
 </template>
 
@@ -43,6 +44,7 @@ import { useCartStore } from '@/stores/cart.store';
 import apiService from '@/services/ApiService';
 import BannerComponent from '@/components/Banner/BannerComponent.vue';
 import EanLoginComponent from "@/components/EanLoginComponent.vue";
+import GitInfo from "@/components/GitInfo.vue";
 
 const userStore = useUserStore();
 const authStore = useAuthStore();

apps/point-of-sale/vite.config.plugin-git-info.ts

@@ -0,0 +1,20 @@
+import { execSync } from 'child_process';
+
+export default function useGitInfo(): Record<string, any> {
+  let branch: string, commit: string;
+  try {
+    branch = execSync('git rev-parse --abbrev-ref HEAD').toString().trim();
+    commit = execSync('git rev-parse --short HEAD').toString().trim();
+  } catch (error) {
+    console.error(error);
+    branch = 'unknown';
+    commit = 'unknown';
+  }
+
+  console.error(branch, commit);
+
+  return {
+    __GIT_BRANCH__: JSON.stringify(branch),
+    __GIT_COMMIT__: JSON.stringify(commit),
+  };
+}

apps/point-of-sale/vite.config.ts

@@ -1,6 +1,7 @@
 import { fileURLToPath, URL } from 'node:url';
 import { defineConfig } from 'vite';
 import vue from '@vitejs/plugin-vue';
+import useGitInfo from "./vite.config.plugin-git-info";
 
 // https://vitejs.dev/config/
 export default defineConfig({
@@ -23,5 +24,8 @@ export default defineConfig({
   },
   server: {
     port: 5174
+  },
+  define: {
+    ...useGitInfo(),
   }
 });