Backend API Integration with Toggle Mode

Description

The frontend currently has inconsistent API integration. Backend API calls are not fully centralized, and the toggle meant to switch between backend and local modes is not functioning correctly.

---

Objectives

1. Implement a toggle-based mode switch:

   • ON → Backend API mode
   • OFF → Local model mode

2. Ensure all API calls are routed only through backend APIs when toggle is ON.

---

Scope of Work

1. Backend API Integration

• Analyze backend (develop branch) endpoints
• Create a centralized API service (services/api.ts)
• Replace all mock/static/local API calls with backend APIs
• Use environment variable for base URL
• Ensure correct request/response handling
• Add proper error and loading states

2. Toggle Functionality

• Add a UI toggle switch

• Implement state management for mode control

• Create a unified handler (e.g., processAudio) to switch logic:

  • Backend API (ON)
  • Local model (OFF)

• Ensure all features (upload, mic, streaming) respect toggle state

---

Expected Behavior

• Toggle ON → All operations use backend APIs
• Toggle OFF → No API calls; local processing only
• No regression in existing features

---

Acceptance Criteria

• All API calls are centralized and functional
• Toggle correctly switches between modes
• No backend calls occur in OFF mode
• No console errors or broken flows