Docker Image Optimization and Bug Fixing

numexa-ui/.dockerignore

@@ -0,0 +1,3 @@
+node_modules
+.idea
+.nvmrc

numexa-ui/.gitignore

@@ -2,6 +2,7 @@ node_modules
 package-lock.json
 yarn.lock
 build
+.idea/
 
 # dependencies
 /node_modules

numexa-ui/.nginx/nginx.conf

@@ -1,15 +1,16 @@
-worker_processes 4;
+server {
+        listen       80;
+        server_name  localhost;
 
-events { worker_connections 1024; }
-
-http {
-    server {
-        listen 80;
-        root  /usr/share/nginx/html;
-        include /etc/nginx/mime.types;
+        location / {
+            root   /usr/share/nginx/html;
+            try_files $uri $uri/ /index.html;
+            index  index.html index.htm;
+        }
 
-        location /appui {
-            try_files $uri /index.html;
+        error_page   500 502 503 504  /50x.html;
+        location = /50x.html {
+            root   /usr/share/nginx/html;
         }
-    }
+
 }

numexa-ui/Dockerfile

@@ -1,31 +1,27 @@
 # stage1 as builder
 FROM node:lts as builder
 
-# copy the package.json to install dependencies
-COPY package.json package-lock.json ./
-
-# Install the dependencies and make the folder
-RUN yarn install && mkdir /react-ui && mv ./node_modules ./react-ui
-
+# Set working directory
 WORKDIR /react-ui
-
+# Copy all files from current directory to working dir in image
 COPY . .
-
-# Build the project and copy the files
-RUN yarn run build
+# install node modules and build assets
+RUN yarn install && yarn build
 
 
 FROM nginx:alpine
 
 #!/bin/sh
 
-COPY ./.nginx/nginx.conf /etc/nginx/nginx.conf
+# Set working directory to nginx asset directory
+WORKDIR /usr/share/nginx/html
 
 ## Remove default nginx index page
-RUN rm -rf /usr/share/nginx/html/*
+RUN rm -rf ./*
 
 # Copy from the stage 1
-COPY --from=builder /react-ui/build /usr/share/nginx/html
+COPY .nginx/nginx.conf /etc/nginx/conf.d/default.conf
+COPY --from=builder /react-ui/build .
 
 EXPOSE 3000 80
 

numexa-ui/src/store/model.js

@@ -135,8 +135,8 @@ export const ListRequests = {
       const { projectId, queryparams, currentPage } = payload; // Destructure "from" and "to" from payload
       // Define your query parameters
       const qParam = new URLSearchParams(queryparams);
-      qParam.append("page", currentPage);
-      qParam.append("page_size", 10);
+      qParam.append("page", currentPage===undefined ? 0 : currentPage);
+      qParam.append("page_size", String(10));
 
       var requestOptions = {
         method: "GET",

numexa-ui/src/views/admin/dataTables/variables/columnsData.js

@@ -162,6 +162,13 @@ export const requestDataColumn = [
     Header: "Provider",
     accessor: "provider",
   },
+  {
+    Header: "Latency",
+    accessor: (row) => {
+      return <p>{row.latency} ms</p>;
+    }
+  },
+
 ];
 
 export const apiKeycolumn = [