Merge pull request #307 from RamiAwar/fix/base-api-url

Simplify setting FE's base api url in bundling/docker images

.github/workflows/packaging.yml

@@ -22,6 +22,7 @@ jobs:
       - name: Build the frontend
         env:
           NODE_ENV: local
+          VITE_API_URL: /
         run: npm run build
       - name: Prepare assets for use by backend
         run: |

Dockerfile

@@ -23,7 +23,7 @@ RUN npm install
 COPY frontend/ .
 
 # Temporary setup - need local env as the 'production' build is landing page only
-ARG API_URL="http://localhost:7377"
+ARG API_URL="/"
 
 ENV VITE_API_URL=$API_URL
 ENV NODE_ENV=local
@@ -114,8 +114,7 @@ ARG AUTH_PASSWORD
 ENV AUTH_PASSWORD=$AUTH_PASSWORD
 ARG ALLOWED_ORIGINS
 ENV ALLOWED_ORIGINS=$ALLOWED_ORIGINS
-# If serving the frontend from a separate URL. Defaults to empty string.
-ENV BASE_API_URL=
+
 
 # Running alembic and uvicorn without combining them in a bash -c command won't work
 CMD ["bash", "-c", "python -m dataline.main"]

backend/BUNDLING.md

@@ -6,7 +6,7 @@ We currently do this manually, will be refactored when we have scripts for bundl
 
 ```bash
 cd frontend
-npm install && NODE_ENV=local npm run build
+npm install && NODE_ENV=local VITE_API_URL=/ npm run build
 cp -r dist/assets/ ../backend/assets
 cp dist/favicon.ico ../backend/assets/favicon.ico
 cp dist/.vite/manifest.json ../backend/assets/manifest.json

backend/dataline/config.py

@@ -31,9 +31,6 @@ class Config(BaseSettings):
     sample_titanic_path: str = str(Path(__file__).parent.parent / "samples" / "titanic.sqlite3")
     sample_spotify_path: str = str(Path(__file__).parent.parent / "samples" / "spotify.sqlite3")
 
-    # to be consumed by the bundled frontend app
-    base_api_url: str = ""  # e.g. http://localhost:7377
-
     default_model: str = "gpt-3.5-turbo"
     templates_path: Path = Path(__file__).parent.parent / "templates"
     assets_path: Path = Path(__file__).parent.parent / "assets"

backend/dataline/main.py

@@ -84,8 +84,6 @@ def index(request: Request, rest_of_path: str) -> Response:
             context["VITE_MANIFEST_JS"] = vite_config["index.html"]["file"]
             context["VITE_MANIFEST_CSS"] = vite_config["index.html"]["css"][0]
 
-        if config.base_api_url:
-            context["BASE_API_URL"] = config.base_api_url
         return templates.TemplateResponse("index.html.jinja2", context=context)
 
     def is_port_in_use(port: int) -> bool:

backend/templates/index.html.jinja2

@@ -29,11 +29,6 @@
     <meta name="twitter:image" content="https://www.dataline.app/og_card.png" />
     <meta name="twitter:image:alt" content="DataLine typed on a blurred background">
 
-    {% if BASE_API_URL is defined %}
-    <script>
-        window.BASE_API_URL = "{{ BASE_API_URL }}";
-    </script>
-    {% endif %}
 
 </head>
 

frontend/src/api.ts

@@ -269,10 +269,7 @@ const streamingQuery = async ({
     "Content-Type": "application/json",
   };
 
-  let baseURL = apiURL;
-  if (!apiURL.endsWith("/")) {
-    baseURL = baseURL + "/";
-  }
+  const baseURL = apiURL.endsWith("/") ? apiURL : apiURL + "/";
 
   const url = `${baseURL}conversation/${conversationId}/query?execute=${execute}&query=${encodeURIComponent(query)}`;
 

frontend/src/env.d.ts

@@ -6,7 +6,3 @@ interface ImportMetaEnv {
 interface ImportMeta {
   readonly env: ImportMetaEnv;
 }
-
-interface Window {
-  BASE_API_URL?: string;
-}

frontend/src/services/api_client.ts

@@ -3,10 +3,7 @@ import axios, { AxiosRequestConfig, AxiosResponse, Method } from "axios";
 // Initializing Axios instance
 const axiosInstance = axios.create();
 
-export const apiURL =
-  window.BASE_API_URL || // when served from fastapi
-  import.meta.env.VITE_API_URL || // during development
-  "http://localhost:7377";
+export const apiURL = import.meta.env.VITE_API_URL || "http://localhost:7377";
 
 interface AxiosRequestConfigPatch extends Omit<AxiosRequestConfig, "method"> {
   method?: Method; // axios sets it as string, which is unhelpful and can lead to bugs