From 966dfabe93921f11e52f479fc8e2e3ef109456c8 Mon Sep 17 00:00:00 2001
From: Sreenand P K <sreenandpk3@gmail.com>
Date: Tue, 21 Jul 2026 19:43:47 +0530
Subject: [PATCH] feat(frontend): connect market features to market service

---
 .env.example                      |  2 ++
 src/lib/api.client.ts             | 16 ++++++++++++++++
 src/pages/LiveMarketDashboard.tsx |  6 ++++--
 3 files changed, 22 insertions(+), 2 deletions(-)

diff --git a/.env.example b/.env.example
index f002141..22ecc35 100644
--- a/.env.example
+++ b/.env.example
@@ -14,3 +14,5 @@ VITE_APP_ENV="development"       # development | staging | production
 
 # ─── Backend API ───────────────────────────────────────────────────────────────
 VITE_API_BASE_URL="http://localhost:8000"
+VITE_MARKET_API_BASE_URL="http://localhost:8001"
+VITE_MARKET_WS_BASE_URL="ws://localhost:8001"
diff --git a/src/lib/api.client.ts b/src/lib/api.client.ts
index b01d73b..6ef745c 100644
--- a/src/lib/api.client.ts
+++ b/src/lib/api.client.ts
@@ -2,6 +2,7 @@ import axios from 'axios';
 import { useUserStore } from '@/stores/userStore';
 
 const API_URL = import.meta.env.VITE_API_BASE_URL || 'http://localhost:8000';
+const MARKET_API_URL = import.meta.env.VITE_MARKET_API_BASE_URL || 'http://localhost:8001';
 
 export const apiClient = axios.create({
   baseURL: API_URL,
@@ -9,6 +10,21 @@ export const apiClient = axios.create({
   timeout: 5000,
 });
 
+export const marketApiClient = axios.create({
+  baseURL: MARKET_API_URL,
+  withCredentials: true,
+  timeout: 5000,
+});
+
+// Request Interceptor for marketApiClient: Attach access token
+marketApiClient.interceptors.request.use((config) => {
+  const token = useUserStore.getState().accessToken;
+  if (token && config.headers) {
+    config.headers.Authorization = `Bearer ${token}`;
+  }
+  return config;
+});
+
 // Request Interceptor: Attach the access token if available
 apiClient.interceptors.request.use((config) => {
   const token = useUserStore.getState().accessToken;
diff --git a/src/pages/LiveMarketDashboard.tsx b/src/pages/LiveMarketDashboard.tsx
index 9c85910..1627a06 100644
--- a/src/pages/LiveMarketDashboard.tsx
+++ b/src/pages/LiveMarketDashboard.tsx
@@ -1,13 +1,15 @@
 import React, { useState, useEffect } from 'react';
 import '@/styles/components/live-market.css';
 
+const MARKET_WS_URL = import.meta.env.VITE_MARKET_WS_BASE_URL || 'ws://localhost:8001';
+
 export const LiveMarketDashboard: React.FC = () => {
     const [marketData, setMarketData] = useState({ gainers: [], losers: [] });
     const [activeTab, setActiveTab] = useState('Stocks');
 
     useEffect(() => {
-        // 1. Connect to the FastAPI WebSocket Bridge
-        const ws = new WebSocket("ws://localhost:8000/dashboard/ws/market");
+        // 1. Connect to the Market Service WebSocket
+        const ws = new WebSocket(`${MARKET_WS_URL}/dashboard/ws/market`);
 
         // 2. Listen for live updates being pushed from FastAPI
         ws.onmessage = (event) => {