React Webview UI Structure

Previous page: State and Messaging

UI Structure

Entry

• src/ui/Chat/index.html
• src/ui/Chat/src/Main.tsx
• src/ui/Chat/src/App.tsx

Views

ChatView

• messages.
• input.
• path autocomplete through FileSelector.
• streaming.
• tool confirmations.

HistoryView

• conversation list.
• load and delete actions.

SettingsView

• API key.
• base URL.
• model.
• reasoning.
• generation parameters.
• tool modes.

Shared components

• Header
• Slider
• Toggle
• NumInput
• global VS Code-like tooltips in src/ui/Chat/src/App.css through data-tooltip.
• base styles in src/ui/Chat/src/styles.

Naming note

A tabs/providers folder may still exist from the migration. Its content must represent DeepSeek-only configuration, not a provider selector.

---

Next page: Overview