From c2f6b5af7b5b35794e14b02fabbc6c7990128938 Mon Sep 17 00:00:00 2001
From: Emnaghz <emnaghzaiel176@gmail.com>
Date: Fri, 27 Sep 2024 18:23:48 +0100
Subject: [PATCH] fix: add ui production target + improve code

---
 .github/workflows/docker.yml  |  1 +
 docker/docker-compose.dev.yml |  2 --
 frontend/Dockerfile           | 44 +++++++++++++++++------------------
 frontend/next.config.mjs      | 17 +++++++-------
 4 files changed, 31 insertions(+), 33 deletions(-)

diff --git a/.github/workflows/docker.yml b/.github/workflows/docker.yml
index 9323e6e6..4bafe0d7 100644
--- a/.github/workflows/docker.yml
+++ b/.github/workflows/docker.yml
@@ -58,6 +58,7 @@ jobs:
           file: ./frontend/Dockerfile
           platforms: linux/amd64,linux/arm64
           push: true
+          target: production
           tags: hexastack/hexabot-ui:latest
 
       - name: Build and push API Docker image
diff --git a/docker/docker-compose.dev.yml b/docker/docker-compose.dev.yml
index 7c280b73..7dd4d495 100644
--- a/docker/docker-compose.dev.yml
+++ b/docker/docker-compose.dev.yml
@@ -49,8 +49,6 @@ services:
       - WATCHPACK_POLLING=true
     volumes:
       - ../frontend/:/app/frontend/
-    ports:
-      - 8081:8081
 
   widget:
     build:
diff --git a/frontend/Dockerfile b/frontend/Dockerfile
index 747e042e..3431aeb6 100644
--- a/frontend/Dockerfile
+++ b/frontend/Dockerfile
@@ -41,11 +41,29 @@ RUN \
     else echo "Lockfile not found." && exit 1; \
     fi
 
-# Production image, copy all the files and run next
-FROM base AS runner
+FROM base AS development
+
+WORKDIR /app
+
+COPY package.json yarn.lock* package-lock.json* pnpm-lock.yaml* ./
+
+COPY . .
+
+RUN npm install
+
+ENV NODE_ENV=development
+ENV CHOKIDAR_USEPOLLING=true
+ENV WATCHPACK_POLLING=true
+
 WORKDIR /app/frontend
 
-ENV NODE_ENV production
+CMD ["npm", "run", "dev", "--", "-p", "8080"]
+
+# Production image, copy all the files and run next
+FROM base AS production
+WORKDIR /app/frontend
+
+ENV NODE_ENV=production
 # Uncomment the following line in case you want to disable telemetry during runtime.
 ENV NEXT_TELEMETRY_DISABLED 1
 
@@ -73,23 +91,3 @@ ENV PORT 8080
 # server.js is created by next build from the standalone output
 # https://nextjs.org/docs/pages/api-reference/next-config-js/output
 CMD HOSTNAME="0.0.0.0" node server.js
-
-FROM base AS development
-
-WORKDIR /app
-
-COPY package.json yarn.lock* package-lock.json* pnpm-lock.yaml* ./
-
-COPY . .
-
-RUN npm install
-
-ENV NODE_ENV=development
-ENV CHOKIDAR_USEPOLLING=true
-ENV WATCHPACK_POLLING=true
-
-EXPOSE 8081
-
-WORKDIR /app/frontend
-
-CMD ["npm", "run", "dev"]
\ No newline at end of file
diff --git a/frontend/next.config.mjs b/frontend/next.config.mjs
index 567a49d1..7db4e621 100644
--- a/frontend/next.config.mjs
+++ b/frontend/next.config.mjs
@@ -10,15 +10,16 @@ const nextConfig = withTM(["hexabot-widget"])({
       },
     ];
   },
-  webpack: (config => {
-    config.watchOptions = {
-      poll: 1000,
-      aggregateTimeout: 300,
-      // ignored: ['**/node_modules']
+  webpack(config) {
+    if(process.env.NODE_ENV=="development"){
+      config.watchOptions = {
+        poll: 1000,
+        aggregateTimeout: 300,
+      };
     }
-    
-return config
-  }),
+
+    return config;
+  },
   publicRuntimeConfig: {
     lang: {
       default: "en",