AOSSIE-Org / AOSSIE-Org/BabyNest

Refactor Frontend: Centralize API and Fix Logic Duplication

Open
#151 20 comments 0 reactions 0 assignees View on GitHub
Dominant language
JavaScript
Stars
56
Forks
124
PR merge metrics
No merged PRs in 30d

Description

## Description
Refactor the frontend application to adopt a robust Layered Architecture. This initiative addresses critical technical debt, including code duplication, scattered API calls, and "God Objects" like RAGService.js. The goal is to enforce a clean separation of concerns using Domain-Driven Design (DDD) principles within a JavaScript-only context.

## Problems
1.**Scattered Network Layer**: API calls (fetch) are manually implemented in multiple locations (ActionExecutor.js, AnalyticsService.js, WeightScreen.jsx, HomeScreen.jsx). Changing a backend endpoint requires editing 5+ files.

2.**Monolithic RAG Service**: RAGService.js (~1500 lines) mixes configuration data, regex parsing logic, and network requests, making it fragile and difficult to maintain.

3.**Logic Duplication**: Business logic (e.g., creating an appointment) is duplicated between the UI and the AI Agent (ActionExecutor.js).

4.**Inconsistent Utilities**: Date formatting logic is reinvented across multiple files.

## Proposed Solution
Implement a **5-Layer Architecture** to decouple responsibilities:

1.**src/api/ (Network Layer)**: A centralized "Single Source of Truth" for all backend communication.
2.src/hooks/ (State Layer): Custom React Hooks to manage data fetching and local state, keeping Screens clean.

3.**src/services/rag/ (Intelligence Layer)**: Decompose RAGService into Intents (Data), Extractors (Pure Logic), and RAGService (Coordinator).

4.**src/utils/ (Utility Layer)**: Shared helpers (e.g., dateUtils.js) for consistent formatting.

5.**src/Screens/ (Presentation Layer)**: Pure UI components that receive data via hooks
```
Frontend/
├── src/
│ ├── api/ <-- API Aggregator
│ │ ├── client.js <-- Base fetch wrapper
│ │ ├── health.js
│ │ └── ...
│ ├── hooks/ <-- Logic & State
│ │ ├── useWeight.js
│ │ └── useDashboard.js
│ ├── services/
│ │ └── rag/ <-- RAG Domain Module
│ │ ├── Intents.js
│ │ ├── Extractors.js
│ │ └── RAGService.js
│ ├── utils/
│ │ └── dateUtils.js
│ └── Screens/ <-- UI Only

```
## 🤝 Collaboration
Collaborated with: (optional)

- [x] I agree to follow this project's Code of Conduct

- [x] I want to work on implementing this feature

Thanks for suggesting ! 🚀 We appreciate your input and will review it soon.

Contributor guide

No contributing guide indexed for this repository

Assessment

This issue has not been assessed yet.

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.