Introduce a Unified AI Sidebar with Stable Configuration, Theming, and Code-Friendly UX

[rachit-goyal1071]

Introduce a Unified AI Sidebar with Stable Configuration, Theming, and Code-Friendly UX

Summary

This issue proposes introducing a new AI Sidebar as a first-class feature, designed around a simple chat-first interaction model. The sidebar should provide a stable, readable, and developer-friendly AI experience with correct configuration visibility, robust provider configuration, and improved handling of code-heavy responses.

Why this is needed

Currently, there is no dedicated AI sidebar experience. Introducing one enables:

• A consistent, always-available AI interaction surface within the app
• Reduced cognitive load by avoiding multiple AI “modes”
• Clear visibility into which AI provider and model are active
• A safer configuration UI that does not crash on dynamic or persisted data
• A better developer experience when working with AI-generated code

Without these considerations upfront, an AI sidebar can easily become:

• Confusing (unclear provider/model state)
• Visually broken across themes
• Fragile due to dropdown assertions
• Inefficient for developers consuming code output

This issue defines the baseline expectations and scope for a robust AI sidebar implementation.

What’s included in this issue

This issue tracks the design and implementation of a new AI sidebar with the following characteristics:

1. Single, unified chat experience

• The sidebar exposes only a chat-based interaction model
• No separate “ask”, “edit”, or mode-selection UX
• One entry point for all AI interactions

2. Accurate active provider/model indication

• The sidebar should clearly show which provider and model are currently active
• Labels must reflect the actual selected configuration, not defaults

3. Theme-aware project file picker

• Any file or project selection UI inside the sidebar must be readable in both light and dark themes
• Proper contrast, surfaces, and outlines should be used

4. Safe and resilient provider configuration UI

• Provider-specific configuration (e.g. model selection) must not crash due to:
  • Duplicate entries
  • Missing or outdated saved values
• The UI should gracefully handle dynamic model lists

5. Developer-friendly code block rendering

• AI responses containing fenced code blocks should:
  • Be clearly separated visually
  • Include a one-click copy action
  • Optionally show the detected language
• Code should be selectable and horizontally scrollable

Possible implementation approach

Non-prescriptive, high-level ideas:

• Sidebar architecture

  • Introduce a dedicated AI sidebar widget with its own internal state
  • Center all interactions around a single conversation flow

• State & configuration

  • Store provider and model selection in a single source of truth
  • Derive UI labels directly from the active configuration

• Theming

  • Avoid hardcoded colors
  • Rely on Theme.of(context).colorScheme for text, icons, and surfaces

• Dropdown safety

  • Normalize model lists before rendering
  • Validate selected values at build time
  • Fall back to hints instead of asserting

• Markdown customization

  • Override fenced code block rendering
  • Wrap code blocks with a header row for actions (copy, language label)
  • Use clipboard APIs for fast copying

Scope note

This issue defines the initial feature scope and UX expectations for the AI sidebar.
Concrete implementation details and code changes will be proposed in a follow-up PR.

[ankurg132]

Go for it @rachit-goyal1071.

[rachit-goyal1071]

@ankurg132 This is also been added i can raise a pr as soon as you give a go, just been waiting for any required changes or anything in the last one.