Merge pull request #28 from DevoteamNL/fix-config-file

Fix for env variables
DevoteamNL · Mar 5, 2024 · 67964a2 · 67964a2
2 parents 0a651b4 + a04045b
commit 67964a2
Show file tree

Hide file tree

Showing 9 changed files with 23 additions and 21 deletions.
diff --git a/config.js b/config.js
@@ -0,0 +1,5 @@
+window.config = {
+  VITE_API_BASE_URL: "http://localhost:8080",
+  VITE_GOOGLE_CLIENT_ID:
+    "779787791084-sf0tjf22s5cl3odf9sjg6rch0if9c0qq.apps.googleusercontent.com",
+};
diff --git a/helm-charts/infini-connect-ui/templates/configjs-configmap.yaml b/helm-charts/infini-connect-ui/templates/configjs-configmap.yaml
@@ -5,10 +5,8 @@ metadata:
   namespace: {{ .Values.namespace }} 
 data:
   config.js: |
-    var config = (() => {
-       return {
-            {{- range $key, $value := .Values.configMapValues }}
-              {{ $key | quote}}: {{ $value | quote }},
-            {{- end }}
-        };
-       })();
+    window.config = {
+      {{- range $key, $value := .Values.configMapValues }}
+        {{ $key | quote}}: {{ $value | quote }},
+      {{- end }}
+    };
diff --git a/index.html b/index.html
@@ -17,6 +17,8 @@
     <noscript>You need to enable JavaScript to run this app.</noscript>
     <div id="root"></div>
     <script type="module" src="/src/index.tsx"></script>
+    <script src="config.js"></script>
+
     <!--
       This HTML file is a template.
       If you open it directly in the browser, you will see an empty page.

diff --git a/src/components/ChatWindow/ChatWindow.tsx b/src/components/ChatWindow/ChatWindow.tsx
@@ -20,7 +20,6 @@ import { useSettings } from "../../context/SettingsContext";
 import { Thread, useThreadContext } from "../../context/ThreadContext";
 import PluginSelector from "../PluginSelector/PluginSelector";
 import ExpandMoreIcon from '@mui/icons-material/ExpandMore';
-import { config } from "../../config";
 // Define the MainContentProps interface for the component's props
 interface MainContentProps {
   thread?: Thread;
@@ -122,7 +121,7 @@ const MainContent: React.FC<MainContentProps> = () => {
     const messageId = messages?.[messages.length - 1].id;
     if (!messageId) return;
 
-    const url = new URL(config.VITE_API_BASE_URL || process.env.VITE_API_BASE_URL || "");
+    const url = new URL(window.config.VITE_API_BASE_URL || process.env.VITE_API_BASE_URL || "");
     url.pathname = `api/message/${messageId}/feedback`;
 
     fetch(url, {

diff --git a/src/components/PluginSelector/PluginSelector.tsx b/src/components/PluginSelector/PluginSelector.tsx
@@ -10,7 +10,6 @@ import OutlinedInput from "@mui/material/OutlinedInput";
 import Select from "@mui/material/Select";
 import * as React from "react";
 import { useAuthContext } from "../../context/AuthContext";
-import { config } from "../../config";
 
 const ITEM_HEIGHT = 48;
 const ITEM_PADDING_TOP = 8;
@@ -43,7 +42,7 @@ export default function PluginSelector({
     if (expired) {
       return;
     }
-    const url = new URL(config.VITE_API_BASE_URL || process.env.VITE_API_BASE_URL || "");
+    const url = new URL(window.config.VITE_API_BASE_URL || process.env.VITE_API_BASE_URL || "");
     url.pathname = "api/plugin/";
 
     fetch(url, {

diff --git a/src/config.js b/src/config.js
diff --git a/src/context/ThreadContext.tsx b/src/context/ThreadContext.tsx
@@ -7,7 +7,6 @@ import {
   useState,
 } from "react";
 import { useAuthContext } from "./AuthContext";
-import { config } from "../config";
 
 // Define the thread context
 interface ThreadContextProps {
@@ -173,7 +172,7 @@ const ThreadProvider = ({
       if (expired) {
         return;
       }
-      const url = new URL(config.VITE_API_BASE_URL || process.env.VITE_API_BASE_URL || "");
+      const url = new URL(window.config.VITE_API_BASE_URL || process.env.VITE_API_BASE_URL || "");
       url.pathname = "api/thread/";
       if (params.threadId) {
         url.pathname +=

diff --git a/src/global.d.ts b/src/global.d.ts
@@ -0,0 +1,6 @@
+interface Window {
+  config: {
+    VITE_API_BASE_URL?: string;
+    VITE_GOOGLE_CLIENT_ID?: string;
+  };
+}
diff --git a/src/index.tsx b/src/index.tsx
@@ -11,7 +11,7 @@ import App from "./App";
 import { AuthProvider } from "./context/AuthContext";
 import { SettingsProvider, useSettings } from "./context/SettingsContext";
 import { devoteamDesignTokens } from "./themes/devoteamTheme";
-import { config } from "./config";
+
 
 const Theme = ({ children }: { children: ReactNode[] | ReactNode }) => {
   const { darkMode } = useSettings();
@@ -26,7 +26,7 @@ root.render(
   <StrictMode>
     <StyledEngineProvider injectFirst>
       <GoogleOAuthProvider
-        clientId={config.VITE_GOOGLE_CLIENT_ID || process.env.VITE_GOOGLE_CLIENT_ID || ""}
+        clientId={window.config.VITE_GOOGLE_CLIENT_ID || process.env.VITE_GOOGLE_CLIENT_ID || ""}
       >
         <SettingsProvider>
           <Theme>