From b72a75776de72c60e374f1a4f8ef86b8d04bee21 Mon Sep 17 00:00:00 2001 From: Raj Mandhare <96978537+Raj2604@users.noreply.github.com> Date: Fri, 18 Jul 2025 21:42:57 +0530 Subject: [PATCH] Frontend hardcodes API base URL #1084 (#1104) ## Description This pull request refactors the frontend application to remove hardcoded backend API and WebSocket URLs. The Environment variables are stored at .env.template file which is created in PR. By this you can temporary solve the problem of binding to the same port 8000. You have to bind Cognee Api Server to different Port and then instead of changing the hardcoded urls you only need to change the Port Number in base url which is present in .env . Please let me know if you want to change Port Number of Cognee Api Server from 8000 to different Port Number which will resolve this issue permanently. ## DCO Affirmation I affirm that all code in every commit of this pull request conforms to the terms of the Topoteretes Developer Certificate of Origin. --------- Signed-off-by: Raj2604 --- cognee-frontend/.env.template | 1 + cognee-frontend/src/app/(graph)/CrewAITrigger.tsx | 5 ++++- cognee-frontend/src/utils/fetch.ts | 6 ++++-- 3 files changed, 9 insertions(+), 3 deletions(-) create mode 100644 cognee-frontend/.env.template diff --git a/cognee-frontend/.env.template b/cognee-frontend/.env.template new file mode 100644 index 000000000..7068f8302 --- /dev/null +++ b/cognee-frontend/.env.template @@ -0,0 +1 @@ +NEXT_PUBLIC_BACKEND_API_URL=http://localhost:8000/api diff --git a/cognee-frontend/src/app/(graph)/CrewAITrigger.tsx b/cognee-frontend/src/app/(graph)/CrewAITrigger.tsx index 942318821..7a164c614 100644 --- a/cognee-frontend/src/app/(graph)/CrewAITrigger.tsx +++ b/cognee-frontend/src/app/(graph)/CrewAITrigger.tsx @@ -28,7 +28,10 @@ export default function CrewAITrigger({ onData, onActivity }: CrewAITriggerProps username2: formElements.username2.value, }; - const websocket = new WebSocket("ws://localhost:8000/api/v1/crewai/subscribe"); + const backendApiUrl = process.env.NEXT_PUBLIC_BACKEND_API_URL; + const wsUrl = backendApiUrl.replace(/^http(s)?/, "ws"); + + const websocket = new WebSocket(`${wsUrl}/v1/crewai/subscribe`); onActivity([{ id: uuid4(), timestamp: Date.now(), activity: "Dispatching hiring crew agents" }]); diff --git a/cognee-frontend/src/utils/fetch.ts b/cognee-frontend/src/utils/fetch.ts index acecdc7c5..78f7f43b7 100644 --- a/cognee-frontend/src/utils/fetch.ts +++ b/cognee-frontend/src/utils/fetch.ts @@ -2,7 +2,9 @@ import handleServerErrors from "./handleServerErrors"; let numberOfRetries = 0; -const isAuth0Enabled = process.env.USE_AUTH0_AUTHORIZATION?.toLowerCase() === "true" +const isAuth0Enabled = process.env.USE_AUTH0_AUTHORIZATION?.toLowerCase() === "true"; + +const backendApiUrl = process.env.NEXT_PUBLIC_BACKEND_API_URL; export default async function fetch(url: string, options: RequestInit = {}): Promise { function retry(lastError: Response) { @@ -22,7 +24,7 @@ export default async function fetch(url: string, options: RequestInit = {}): Pro }); } - return global.fetch("http://localhost:8000/api" + url, { + return global.fetch(backendApiUrl + url, { ...options, credentials: "include", })