AOSSIE-Org / AOSSIE-Org/BabyNest

Refactor Frontend: Centralize API and Fix Logic Duplication

未關閉
#151 20 則留言 0 個 reaction 已指派 0 人 在 GitHub 檢視
主要語言
JavaScript
星號
56
分支
124
PR 合併指標
30 天內沒有已合併 PR

描述

## 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.

貢獻指南

這個儲存庫沒有索引到貢獻指南

評估

這個 Issue 還沒有評估資料。

把新 issue 寄到你的電子郵件信箱

精選適合新手參與的 GitHub issue 摘要。