fix(frotend): images location + maps api key build

deploy/compose/nginx.conf

@@ -34,6 +34,12 @@ server {
         proxy_connect_timeout  60;
         proxy_redirect         off;
     }
+    location /images {
+        proxy_pass             http://host.docker.internal:8004;
+        proxy_read_timeout     60;
+        proxy_connect_timeout  60;
+        proxy_redirect         off;
+    }
     location /socket.io {
         proxy_pass             http://host.docker.internal:5000;
         proxy_read_timeout     60;

frontend/.env

@@ -2,7 +2,6 @@
 
 NEXT_PUBLIC_WS_ENDPOINT="http://localhost:5000/"
 NEXT_PUBLIC_ENTERPRISE_VERSION="false"
-NEXT_PUBLIC_GOOGLE_MAPS_KEY=""
 # ---------------------------------------------------------------------------- #
 
 # -------------------------- Production Environment -------------------------- #

frontend/.gitignore

@@ -24,3 +24,5 @@ out
 npm-debug.log*
 yarn-debug.log*
 yarn-error.log*
+
+build/image.sh

frontend/build/Dockerfile.ee

@@ -2,12 +2,14 @@ FROM node:18.18.0-alpine as builder
 
 WORKDIR /app
 
+ARG GOOGLE_MAPS_API_KEY 
+
 COPY ../ ./
 RUN rm .env && rm .env.local || true
 
 RUN npm install
 
-RUN NEXT_PUBLIC_ENTERPRISE_VERSION="true" npm run build
+RUN NEXT_PUBLIC_ENTERPRISE_VERSION="true" NEXT_PUBLIC_GOOGLE_MAPS_KEY=${GOOGLE_MAPS_API_KEY} npm run build
 
 FROM node:18.18.0-alpine as runner
 

frontend/src/layouts/auth/layout.js

@@ -76,7 +76,7 @@ export const Layout = (props) => {
             <Link href="http://localhost/companylink" target="_blank">
               <img
                 alt=""
-                src="http://localhost:8004/images/logo.png"
+                src="/images/logo.png"
               />
             </Link>
           </Box>

frontend/src/layouts/dashboard/side-nav.js

@@ -82,7 +82,7 @@ export const SideNav = (props) => {
           >
          <Link href="http://localhost/companylink" target="_blank">
             <div style={{display:'flex',justifyContent:'center'}}>
-              <img src="http://localhost:8004/images/logo.png" 
+              <img src="/images/logo.png" 
               width={'60%'}
               />
             </div>