fix: add ui development target

.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

docker/docker-compose.dev.yml

@@ -41,7 +41,10 @@ services:
     build:
       context: ../
       dockerfile: ./frontend/Dockerfile
+      target: development
     pull_policy: build
+    volumes:
+      - ../frontend/:/app/frontend/
 
   widget:
     build:

frontend/Dockerfile

@@ -41,11 +41,29 @@ RUN \
     else echo "Lockfile not found." && exit 1; \
     fi
 
+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
+
+CMD ["npm", "run", "dev", "--", "-p", "8080"]
+
 # Production image, copy all the files and run next
-FROM base AS runner
+FROM base AS production
 WORKDIR /app/frontend
 
-ENV NODE_ENV production
+ENV NODE_ENV=production
 # Uncomment the following line in case you want to disable telemetry during runtime.
 ENV NEXT_TELEMETRY_DISABLED 1
 

frontend/next.config.mjs

@@ -10,7 +10,14 @@ const nextConfig = withTM(["hexabot-widget"])({
       },
     ];
   },
-  webpack(config, _options) {
+  webpack(config) {
+    if (process.env.NODE_ENV==="development") {
+      config.watchOptions = {
+        poll: 1000,
+        aggregateTimeout: 300,
+      };
+    }
+
     return config;
   },
   publicRuntimeConfig: {