From 281527ef696d628c82196ec6505343d1fe1a8b67 Mon Sep 17 00:00:00 2001 From: Vikas Nale Date: Mon, 31 Mar 2025 16:56:04 +0530 Subject: [PATCH] Changes fo environment variable for docker container --- .env | 2 +- Dockerfile | 4 ++++ assets/js/config.js | 0 assets/vendor/js/helpers.js | 0 docker-compose.yml | 2 +- entrypoint.sh | 7 ++++++ env.js | 1 + index.html | 28 +++++++++++----------- package-lock.json | 12 ++++------ package.json | 2 +- src/utils/axiosClient.jsx | 46 ++++++++++++++++++++++++++----------- tsconfig.app.json | 2 +- vite.config.ts | 2 +- 13 files changed, 69 insertions(+), 39 deletions(-) create mode 100644 assets/js/config.js create mode 100644 assets/vendor/js/helpers.js create mode 100644 entrypoint.sh create mode 100644 env.js diff --git a/.env b/.env index 940f00c6..5dca655e 100644 --- a/.env +++ b/.env @@ -1 +1 @@ -VITE_BASE_URL=http://localhost:5032 \ No newline at end of file +VITE_API_URL=http://localhost:5032 \ No newline at end of file diff --git a/Dockerfile b/Dockerfile index 34c33b4f..34f8fe31 100644 --- a/Dockerfile +++ b/Dockerfile @@ -21,5 +21,9 @@ RUN npm run build # This will run tsc -b and vite build # Expose the port the app will use EXPOSE 4173 +# Copy the entrypoint script +COPY entrypoint.sh /entrypoint.sh +RUN chmod +x /entrypoint.sh + # Start the app using the preview server CMD ["npm", "run", "preview"] diff --git a/assets/js/config.js b/assets/js/config.js new file mode 100644 index 00000000..e69de29b diff --git a/assets/vendor/js/helpers.js b/assets/vendor/js/helpers.js new file mode 100644 index 00000000..e69de29b diff --git a/docker-compose.yml b/docker-compose.yml index ae089be5..cf309b6c 100644 --- a/docker-compose.yml +++ b/docker-compose.yml @@ -17,7 +17,7 @@ services: networks: - marco_network environment: - - VITE_BASE_URL=http://server:8080 # Use the service name `server` + - VITE_API_URL=http://server:8080 # Use the service name `server` ports: - "4173:4173" diff --git a/entrypoint.sh b/entrypoint.sh new file mode 100644 index 00000000..cc29e5c3 --- /dev/null +++ b/entrypoint.sh @@ -0,0 +1,7 @@ +#!/bin/sh + +# Create a JavaScript file with environment variables +echo "window._env_ = { VITE_API_URL: \"$VITE_API_URL\" };" > /app/dist/env.js + +# Start the Vite preview server +exec "$@" diff --git a/env.js b/env.js new file mode 100644 index 00000000..c7ec755e --- /dev/null +++ b/env.js @@ -0,0 +1 @@ +windows._env._ = { VITE_API_URL: "http://localhost:4200" }; diff --git a/index.html b/index.html index 5988bdad..02eeed6e 100644 --- a/index.html +++ b/index.html @@ -46,12 +46,12 @@ - + - + @@ -70,12 +70,12 @@ - + - + @@ -83,7 +83,7 @@ - + @@ -95,24 +95,24 @@ - + - - + + - + \ No newline at end of file diff --git a/package-lock.json b/package-lock.json index 77ec7fcf..642e620d 100644 --- a/package-lock.json +++ b/package-lock.json @@ -10,6 +10,7 @@ "dependencies": { "@hookform/resolvers": "^3.10.0", "@reduxjs/toolkit": "^2.5.0", + "@types/node": "^22.13.14", "@vitejs/plugin-react": "^4.3.4", "axios": "^1.7.9", "axios-retry": "^4.5.0", @@ -1400,11 +1401,9 @@ "peer": true }, "node_modules/@types/node": { - "version": "22.13.13", - "resolved": "https://registry.npmjs.org/@types/node/-/node-22.13.13.tgz", - "integrity": "sha512-ClsL5nMwKaBRwPcCvH8E7+nU4GxHVx1axNvMZTFHMEfNI7oahimt26P5zjVCRrjiIWj6YFXfE1v3dEp94wLcGQ==", - "license": "MIT", - "peer": true, + "version": "22.13.14", + "resolved": "https://registry.npmjs.org/@types/node/-/node-22.13.14.tgz", + "integrity": "sha512-Zs/Ollc1SJ8nKUAgc7ivOEdIBM8JAKgrqqUYi2J997JuKO7/tpQC+WCetQ1sypiKCQWHdvdg9wBNpUPEWZae7w==", "dependencies": { "undici-types": "~6.20.0" } @@ -5240,8 +5239,7 @@ "version": "6.20.0", "resolved": "https://registry.npmjs.org/undici-types/-/undici-types-6.20.0.tgz", "integrity": "sha512-Ny6QZ2Nju20vw1SRHe3d9jVu6gJ+4e3+MMpqu7pqE5HT6WsTSlce++GQmK5UXS8mzV8DSYHrQH+Xrf2jVcuKNg==", - "license": "MIT", - "peer": true + "license": "MIT" }, "node_modules/update-browserslist-db": { "version": "1.1.1", diff --git a/package.json b/package.json index 9bec5700..f3fb40d4 100644 --- a/package.json +++ b/package.json @@ -3,7 +3,6 @@ "private": true, "version": "0.0.0", "type": "module", - "scripts": { "dev": "vite", "json-server": "json-server --watch ./src/data/demo.json --port 5000", @@ -14,6 +13,7 @@ "dependencies": { "@hookform/resolvers": "^3.10.0", "@reduxjs/toolkit": "^2.5.0", + "@types/node": "^22.13.14", "@vitejs/plugin-react": "^4.3.4", "axios": "^1.7.9", "axios-retry": "^4.5.0", diff --git a/src/utils/axiosClient.jsx b/src/utils/axiosClient.jsx index 7ad9c902..515f6df5 100644 --- a/src/utils/axiosClient.jsx +++ b/src/utils/axiosClient.jsx @@ -2,9 +2,11 @@ import axios from "axios"; import { useNavigate } from "react-router-dom"; import axiosRetry from "axios-retry"; import showToast from "../services/toastService"; -const base_Url = process.env.VITE_BASE_URL; + +const API_URL = process.env.VITE_API_URL; + export const axiosClient = axios.create({ - baseURL: base_Url, // Your Web API URL + baseURL: API_URL, // "https://api.marcoaiot.com/", // Your Web API URL withCredentials: false, // Required if the API uses cookies headers: { "Content-Type": "application/json", // Specify the content type @@ -16,6 +18,8 @@ axiosRetry(axiosClient, { retries: 3 }); // Request interceptor to add Bearer token axiosClient.interceptors.request.use( async (config) => { + console.log("API_URL:", API_URL); + if (config.authRequired) { const token = localStorage.getItem("jwtToken"); if (token) { @@ -44,32 +48,44 @@ axiosClient.interceptors.response.use( originalRequest._toastShown = true; if (error.code === "ERR_CONNECTION_REFUSED") { - console.error("Connection refused. Please ensure the server is running."); - showToast("Unable to connect to the server. Please try again later.", "error"); + console.error( + "Connection refused. Please ensure the server is running." + ); + showToast( + "Unable to connect to the server. Please try again later.", + "error" + ); } else if (error.code === "ERR_NETWORK") { console.error("Network error: Unable to reach the server."); showToast("Server is unreachable. Try again later!", "error"); redirectToLogin(); } else if (error.code === "ECONNABORTED") { console.error("Request timed out."); - showToast("The request took too long. Please try again later.", "error"); + showToast( + "The request took too long. Please try again later.", + "error" + ); } else if (error.response) { - console.error("Error response:", error.response.status, error.response.data); + console.error( + "Error response:", + error.response.status, + error.response.data + ); if (error.response.status === 401 && !originalRequest._retry) { originalRequest._retry = true; try { - // debugger; - // Get the refresh token from secure storage + // debugger; + // Get the refresh token from secure storage const refreshToken = localStorage.getItem("refreshToken"); if (!refreshToken) { - // Redirect to login if refresh token is not available + // Redirect to login if refresh token is not available redirectToLogin(); return Promise.reject(error); } - // Make a request to refresh the access token + // Make a request to refresh the access token const response = await axiosClient.post("/api/Auth/refresh-token", { token: localStorage.getItem("jwtToken"), refreshToken, @@ -82,15 +98,19 @@ axiosClient.interceptors.response.use( // Retry the original request with the new token originalRequest.headers["Authorization"] = `Bearer ${token}`; - // Retry the original request + // Retry the original request return axiosClient(originalRequest); } catch (err) { - // Redirect to login if token refresh fails + // Redirect to login if token refresh fails redirectToLogin(); return Promise.reject(err); } } else { - showToast(error.response.data?.message || "An error occurred. Please try again.", "error"); + showToast( + error.response.data?.message || + "An error occurred. Please try again.", + "error" + ); } } else { console.error("An unknown error occurred:", error.message); diff --git a/tsconfig.app.json b/tsconfig.app.json index 33f688bd..c8ac9390 100644 --- a/tsconfig.app.json +++ b/tsconfig.app.json @@ -24,5 +24,5 @@ "noFallthroughCasesInSwitch": true, "noUncheckedSideEffectImports": true }, - "include": ["src"] + "include": ["src", "endpoint.ts"] } diff --git a/vite.config.ts b/vite.config.ts index b5b23fd9..df0b0769 100644 --- a/vite.config.ts +++ b/vite.config.ts @@ -12,7 +12,7 @@ export default defineConfig({ }, define: { 'process.env': { - VITE_BASE_URL: process.env.VITE_BASE_URL || 'http://localhost:5032', + VITE_API_URL: process.env.VITE_API_URL || 'http://localhost:5032', }, },