[CI] Epic: MicroFE for CI

[jasminetay-moe]

Epic: MicroFE for CI

Build CI's frontend components as a micro-frontend that can be plugged into any TW app. For the pilot, the MicroFE is integrated into the SDT app (student profile page). This epic covers all FE design and implementation — the AI responses it renders come from E1's model service.

Key capabilities:

• Recommendation bubble/cards surfaced on the SDT student profile — contextually triggered by student signals
• AI Chat interface (slide-over/panel), pre-loaded with student context from the tapped card
• Natural-language follow-up Q&A with inline source citations on every response
• Native inline document viewer (PDF/Word/HTML) with deep-linking to cited sections
• Further learning links and feedback mechanism
• UX design for all components (cards, chat, viewer)

---

Definition of Done

• Recommendation cards render on SDT student profile for all 5 pilot signals; click through to pre-loaded AI chat
• Chat pre-loaded with student context; follow-up Q&A working with inline citations
• Native document viewer opens source materials inline and deep-links to the cited section
• Loading, empty, and error states handled gracefully across all components
• MicroFE successfully integrated into SDT app (student profile page) for pilot