turash/bugulma/frontend/BACKEND_MIGRATION_REVIEW.md
Damir Mukimov 6347f42e20
Consolidate repositories: Remove nested frontend .git and merge into main repository
- Remove nested git repository from bugulma/frontend/.git
- Add all frontend files to main repository tracking
- Convert from separate frontend/backend repos to unified monorepo
- Preserve all frontend code and development history as tracked files
- Eliminate nested repository complexity for simpler development workflow

This creates a proper monorepo structure with frontend and backend
coexisting in the same repository for easier development and deployment.
2025-11-25 06:02:57 +01:00

232 lines
6.2 KiB
Markdown

# Frontend to Backend Migration Review
This document identifies frontend logic that should be moved to the backend, as the app transitions from a frontend-only to a backend-driven architecture.
## 🔴 Critical - Must Move to Backend
### 1. Chat/LLM Direct Calls
**File:** `hooks/useChat.ts`
**Issue:** Still directly calling GoogleGenAI API with API keys in frontend.
**Current:**
```typescript
const ai = new GoogleGenAI({ apiKey: process.env.API_KEY });
chatRef.current = ai.chats.create({ ... });
```
**Should be:**
- Backend endpoint: `POST /api/ai/chat` (with streaming support)
- Backend endpoint: `POST /api/ai/chat/stream` (for streaming responses)
- Frontend should only call backend API
**Priority:** 🔴 HIGH - Security issue (API keys exposed)
---
### 2. Proposal Management
**File:** `contexts/PartnershipContext.tsx`, `data/proposals.ts`
**Issue:** Proposals stored in frontend state and localStorage, not persisted in backend.
**Current:**
- Proposals stored in React state
- Initial data from `data/proposals.ts`
- No backend persistence
**Should be:**
- Backend endpoints:
- `GET /api/proposals` - List proposals (with filters)
- `GET /api/proposals/:id` - Get proposal by ID
- `POST /api/proposals` - Create proposal
- `PUT /api/proposals/:id/status` - Update proposal status
- `GET /api/proposals/organization/:orgId` - Get proposals for organization
- Frontend should use API hooks
**Priority:** 🔴 HIGH - Data persistence issue
---
### 3. Direct Symbiosis Matching
**File:** `hooks/useDirectSymbiosis.ts`
**Issue:** Business logic for matching needs/offers is in frontend.
**Current:**
```typescript
// Frontend loops through organizations and matches needs/offers
for (const otherOrg of otherOrgs) {
for (const need of myNeeds) {
const matchingOffer = otherOrg.offers.find(...);
// ...
}
}
```
**Should be:**
- Backend endpoint: `GET /api/matching/organization/:orgId/direct`
- Returns: `{ providers: [...], consumers: [...] }`
- Backend uses ResourceFlows for accurate matching
**Priority:** 🔴 HIGH - Business logic should be on backend
---
### 4. Analytics Calculations
**File:** `lib/analytics.ts`
**Issue:** Business analytics calculated in frontend.
**Functions:**
- `calculateSymbioticConnections()` - Calculates total connections
- `analyzeSupplyAndDemand()` - Analyzes top needs/offers
**Should be:**
- Backend endpoints:
- `GET /api/analytics/connections` - Get connection statistics
- `GET /api/analytics/supply-demand` - Get supply/demand analysis
- `GET /api/analytics/dashboard` - Get dashboard statistics
**Priority:** 🟡 MEDIUM - Performance and consistency
---
## 🟡 Medium Priority - Should Move
### 5. Organization Search/Filtering
**File:** `hooks/useOrganizationFilter.ts`
**Issue:** Search scoring logic (with weights +50, +25, etc.) is in frontend.
**Current:**
- Client-side filtering and scoring
- Search relevance scoring with custom weights
**Should be:**
- Backend endpoint: `GET /api/organizations/search?q=...&sectors=...&sort=...`
- Backend handles search indexing and relevance scoring
- Frontend can still do basic client-side filtering for UX (debouncing, etc.)
**Priority:** 🟡 MEDIUM - Better performance and consistency
---
### 6. Similar Organizations
**File:** `lib/organizationUtils.ts`, `hooks/pages/useOrganizationData.ts`
**Issue:** Finding similar organizations by sector is done in frontend.
**Current:**
```typescript
return organizations
.filter((org) => org.ID !== organization.ID && org.Sector === organization.Sector)
.slice(0, 5);
```
**Should be:**
- Backend endpoint: `GET /api/organizations/:id/similar?limit=5`
- Backend can use more sophisticated similarity algorithms
- Could consider: sector, location, resource flows, etc.
**Priority:** 🟡 MEDIUM - Could be enhanced on backend
---
## 🟢 Low Priority - Optional
### 7. Client-Side Filtering/Sorting
**File:** `hooks/useOrganizationFilter.ts` (sorting part)
**Current:** Client-side sorting by name, sector, etc.
**Note:** This is acceptable for small datasets. For large datasets, should use backend pagination and sorting.
**Priority:** 🟢 LOW - Acceptable for MVP, optimize later
---
## Summary
### Immediate Actions Required
1.**Move Chat to Backend API** - Security issue
2.**Move Proposals to Backend** - Data persistence
3.**Move Direct Symbiosis to Backend** - Business logic
4.**Move Analytics to Backend** - Performance
### Backend Endpoints Needed
#### Chat
- `POST /api/ai/chat` - Send message
- `POST /api/ai/chat/stream` - Streaming chat (SSE or WebSocket)
#### Proposals
- `GET /api/proposals` - List proposals
- `GET /api/proposals/:id` - Get proposal
- `POST /api/proposals` - Create proposal
- `PUT /api/proposals/:id/status` - Update status
- `GET /api/proposals/organization/:orgId` - Get by organization
#### Matching
- `GET /api/matching/organization/:orgId/direct` - Direct symbiosis matches
#### Analytics
- `GET /api/analytics/connections` - Connection statistics
- `GET /api/analytics/supply-demand` - Supply/demand analysis
- `GET /api/analytics/dashboard` - Dashboard stats
#### Organizations
- `GET /api/organizations/search` - Search with filters
- `GET /api/organizations/:id/similar` - Similar organizations
---
## Migration Checklist
- [ ] Create backend chat endpoints
- [ ] Update `useChat.ts` to use backend API
- [ ] Create backend proposal endpoints
- [ ] Update `PartnershipContext.tsx` to use API hooks
- [ ] Create backend direct symbiosis endpoint
- [ ] Update `useDirectSymbiosis.ts` to use backend API
- [ ] Create backend analytics endpoints
- [ ] Update analytics usage to use backend API
- [ ] Create backend organization search endpoint
- [ ] Update `useOrganizationFilter.ts` to use backend search
- [ ] Create backend similar organizations endpoint
- [ ] Update `useOrganizationData.ts` to use backend API
---
## Notes
- Some client-side filtering/sorting is acceptable for UX (debouncing, instant feedback)
- Backend should handle all business logic, calculations, and data persistence
- Frontend should be "dumb" - just display data and call APIs
- Consider caching strategies for frequently accessed data
- Use React Query for all data fetching (already in place)