ui-solution-architect-mcp/ui_solution_document_template.md

MCP server that provides UI Solution Document templates and generates Technical Solution Documents for UI bug fixes from Jira/GitHub issues and repo analysis.

# UI Solution Document

**Project / Module Name:** ____________________________  
**Feature / Bug ID:** ____________________________  
**Author:** ____________________________  
**Date:** ____________________________  
**Version:** ____________________________  

---

## 1. Summary
> Brief description of the bug, enhancement, or new feature.

- **Type:** (Bug Fix / Enhancement / New Feature)  
- **Impact Area:** (Booking flow, Search results, Payment page, etc.)  
- **Priority:** (High / Medium / Low)  
- **Dependencies:** (Backend APIs, AEM Content updates, Other UI modules)  

---

## 2. Background / Problem Statement
> What’s the problem or business need? Include relevant screenshots or error logs.

- **Observed Issue:**  
- **Root Cause (if known):**  
- **Current Behavior:**  
- **Expected Behavior:**  

---

## 3. Technical Analysis
> Detailed analysis of the current implementation.

### 3.1 UI Layer (React + Microfrontend)
- Existing components impacted:  
- Component location (path in repo):  
- State management details (Redux / Context API / Local State):  
- Any reusable hooks/services involved:  

### 3.2 Backend Layer (Microservices)
- APIs consumed (endpoint URLs, methods, payloads):  
- API changes required (if any):  

### 3.3 Content Layer (AEM)
- Static text updates:  
- Image/asset changes:  
- AEM path references:  

---

## 4. Proposed Solution
> Step-by-step approach with architecture flow.

### 4.1 UI Changes
- New components (with path & purpose)  
- Updated components (with path & change summary)  
- CSS/Tailwind updates  
- State management updates  
- Routing changes (if any)  

### 4.2 API / Microservices Changes
- API request modifications (payload changes, query params)  
- API response handling changes  
- Error handling changes  

### 4.3 AEM Content Updates
- New content paths  
- Asset upload process  
- Mapping to UI components  

---

## 5. Architecture & Sequence Flow
> Include diagrams where necessary.

- **Architecture Diagram:** Show React microfrontend modules, API calls, AEM content flow.  
- **Sequence Diagram:** Show request-response flow from UI → Microservices → AEM (if involved).  

---

## 6. Impact Analysis
> What else will be affected by this change?

- **UI Modules impacted:**  
- **Microfrontend build/deployment changes:**  
- **Other environments impacted:** (Dev, QA, Prod)  
- **Third-party libraries impacted:**  

---

## 7. Testing Strategy

### 7.1 Unit Testing
- Components to be unit tested  
- Test data & scenarios  

### 7.2 Integration Testing
- Microfrontend integration testing approach  
- API contract testing  

### 7.3 UAT / Regression
- UAT scenarios  
- Regression areas  

---

## 8. Rollout & Deployment Plan
- Feature flag required? (Yes / No)  
- Deployment order (UI first / Backend first / AEM first)  
- Rollback plan  

---

## 9. Risks & Mitigation
- Risk:  
- Mitigation:  

---

## 10. References
- Jira ticket(s)  
- API documentation  
- AEM content references  
- Related PR links