DONE: cicd pipeline for frontend that uses ip first

fe/web/.env.example

@@ -0,0 +1,12 @@
+# Host ports (change if they collide on the single server)
+ADMIN_HOST_PORT=5000
+TELLER_HOST_PORT=3001
+
+# Baked into the Vite images at build time (set in Gitea secret/variable VITE_API_URL too)
+VITE_API_URL=http://YOUR_SERVER_IP:8080
+VITE_CUSTOMER_APP_URL=http://YOUR_SERVER_IP:3000
+
+# Registry images (used by compose / deploy)
+ADMIN_IMAGE=git.koppkb.com/kopkb/qms-fe-admin
+TELLER_IMAGE=git.koppkb.com/kopkb/qms-fe-teller
+IMAGE_TAG=local

fe/web/.env.production

@@ -0,0 +1,13 @@
+# Host ports (change if they collide on the single server)
+ADMIN_HOST_PORT=5000
+TELLER_HOST_PORT=3001
+
+# Replace YOUR_SERVER_IP with the production server IP (API is on :8080)
+# Also set the same value as Gitea secret/variable VITE_API_URL for CI image builds
+VITE_API_URL=http://172.16.6.200:8080
+VITE_CUSTOMER_APP_URL=http://172.16.6.200:3000
+
+# Registry images (used by compose / deploy)
+ADMIN_IMAGE=git.koppkb.com/kopkb/qms-fe-admin
+TELLER_IMAGE=git.koppkb.com/kopkb/qms-fe-teller
+IMAGE_TAG=local

fe/web/.gitignore

@@ -0,0 +1,3 @@
+.env
+!.env.example
+!.env.production

fe/web/admin-app/.dockerignore

@@ -0,0 +1,8 @@
+node_modules
+dist
+.git
+.gitignore
+*.md
+.env
+.env.*
+.DS_Store

fe/web/admin-app/Dockerfile

@@ -1,10 +1,21 @@
-FROM node:21-alpine AS build
-WORKDIR /admin-app
-COPY package*.json .
-RUN npm install
+# Build stage
+FROM node:20-bookworm AS build
+WORKDIR /app
+
+ARG VITE_API_URL=http://localhost:8080
+ARG VITE_CUSTOMER_APP_URL=http://localhost:3000
+ENV VITE_API_URL=$VITE_API_URL
+ENV VITE_CUSTOMER_APP_URL=$VITE_CUSTOMER_APP_URL
+
+COPY package.json package-lock.json ./
+RUN npm ci
 
 COPY . .
 RUN npm run build
 
-EXPOSE 5001
-CMD ["npm", "run", "preview"]
+# Runtime stage — static SPA
+FROM nginx:alpine
+COPY nginx.conf /etc/nginx/conf.d/default.conf
+COPY --from=build /app/dist /usr/share/nginx/html
+EXPOSE 80
+CMD ["nginx", "-g", "daemon off;"]

fe/web/admin-app/nginx.conf

@@ -0,0 +1,10 @@
+server {
+    listen 80;
+    server_name _;
+    root /usr/share/nginx/html;
+    index index.html;
+
+    location / {
+        try_files $uri $uri/ /index.html;
+    }
+}

fe/web/admin-app/src/constants.js

@@ -1,4 +1,5 @@
-export const SERVER_URL = 'http://localhost:8080';
+export const SERVER_URL =
+    import.meta.env.VITE_API_URL ?? 'http://localhost:8080';
 
 export const CUSTOMER_APP_URL =
     import.meta.env.VITE_CUSTOMER_APP_URL ?? 'http://localhost:3000';
@@ -6,4 +7,4 @@ export const CUSTOMER_APP_URL =
 export const ROLES = {
     ROLE_SUPER_ADMIN : "ROLE_SUPER_ADMIN",
     ROLE_BRANCH_ADMIN : "ROLE_BRANCH_ADMIN"
-}
+}

fe/web/docker-compose.yml

@@ -0,0 +1,25 @@
+services:
+  admin:
+    image: ${ADMIN_IMAGE:-qms-fe-admin}:${IMAGE_TAG:-local}
+    build:
+      context: ./admin-app
+      dockerfile: Dockerfile
+      args:
+        VITE_API_URL: ${VITE_API_URL:-http://localhost:8080}
+        VITE_CUSTOMER_APP_URL: ${VITE_CUSTOMER_APP_URL:-http://localhost:3000}
+    container_name: qms-fe-admin
+    restart: unless-stopped
+    ports:
+      - "${ADMIN_HOST_PORT:-5000}:80"
+
+  teller:
+    image: ${TELLER_IMAGE:-qms-fe-teller}:${IMAGE_TAG:-local}
+    build:
+      context: ./teller-app
+      dockerfile: Dockerfile
+      args:
+        VITE_API_URL: ${VITE_API_URL:-http://localhost:8080}
+    container_name: qms-fe-teller
+    restart: unless-stopped
+    ports:
+      - "${TELLER_HOST_PORT:-3001}:80"

fe/web/teller-app/.dockerignore

@@ -0,0 +1,8 @@
+node_modules
+dist
+.git
+.gitignore
+*.md
+.env
+.env.*
+.DS_Store

fe/web/teller-app/Dockerfile

@@ -1,10 +1,21 @@
-FROM node:21-alpine AS build
-WORKDIR /teller-app
-COPY package*.json .
-RUN npm install
+# Build stage
+FROM node:20-bookworm AS build
+WORKDIR /app
+
+ARG VITE_API_URL=http://localhost:8080
+ARG VITE_GOLD_PRICE_URL
+ENV VITE_API_URL=$VITE_API_URL
+ENV VITE_GOLD_PRICE_URL=$VITE_GOLD_PRICE_URL
+
+COPY package.json package-lock.json ./
+RUN npm ci
 
 COPY . .
 RUN npm run build
 
-EXPOSE 3000
-CMD ["npm", "run", "preview"]
+# Runtime stage — static SPA
+FROM nginx:alpine
+COPY nginx.conf /etc/nginx/conf.d/default.conf
+COPY --from=build /app/dist /usr/share/nginx/html
+EXPOSE 80
+CMD ["nginx", "-g", "daemon off;"]

fe/web/teller-app/nginx.conf

@@ -0,0 +1,10 @@
+server {
+    listen 80;
+    server_name _;
+    root /usr/share/nginx/html;
+    index index.html;
+
+    location / {
+        try_files $uri $uri/ /index.html;
+    }
+}

fe/web/teller-app/src/constants.js

@@ -1,4 +1,5 @@
-export const SERVER_URL = 'http://localhost:8080';
+export const SERVER_URL =
+    import.meta.env.VITE_API_URL ?? 'http://localhost:8080';
 
 export const GOLD_PRICE_URL =
     import.meta.env.VITE_GOLD_PRICE_URL ??