AOSSIE-Org / AOSSIE-Org/BabyNest
Refactor Frontend: Centralize API and Fix Logic Duplication
- 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.