Files
supabase/apps/studio/components
Joshen Lim 0e92a9574c Joshen/fe 3932 support branching conversations (#48519)
## Context

Adds support for branching off from an Assistant's Response - which
creates a new chat with all the previous messages including from where
we're branching off from
<img width="204" height="97" alt="image"
src="https://github.com/user-attachments/assets/0b171ae6-f2b4-4b58-87fa-0010ad45f777"
/>

Branched conversations will have an indication of where it was branched
off from
<img width="404" height="427" alt="image"
src="https://github.com/user-attachments/assets/bed8502f-3f83-4f76-bc00-feac86fa57a6"
/>


## Other changes
- Also added support for copying an Assistant's Response
<img width="190" height="115" alt="image"
src="https://github.com/user-attachments/assets/5e4aa0b8-eb6e-485f-80c0-3028b95720f7"
/>


<!-- This is an auto-generated comment: release notes by coderabbit.ai
-->
## Summary by CodeRabbit

* **New Features**
  * Branch conversations from assistant messages into a new chat.
  * View the originating conversation and navigate back to it.
  * Copy assistant message content with visual confirmation.
  * Access branching and copying actions from message controls.
* **UI Updates**
  * Added “Branched from” indicators for branched conversations.
  * Updated the assistant disclaimer text to “The Assistant.”
<!-- end of auto-generated comment: release notes by coderabbit.ai -->
2026-07-31 13:38:02 +07:00
..

Writing components

Where to create your components

  • For components that declare the general structure and layout of a page:
    • /components/layouts/xxx
  • For components that are tightly coupled to a specific interface:
    • /components/interfaces/xxx
  • For components that are meant to be reusable across multiple pages:
    • /components/ui/xxx
  • Note: We're gradually moving files out of the to-be-cleaned folder into the respective folders as we refactor

Component structure

  • If a component has constants and utility methods that are tightly coupled to itself, keep them close to the component and enclose them in a folder with an index.tsx as an entry point
  • Otherwise it can just be a file on its own
  • For example:
    • components/ui
      - SampleComponentA
        - SampleComponentA.tsx
        - SampleComponentA.constants.ts
        - SampleComponentA.utils.ts
        - SampleComponentA.types.ts
        - index.ts
      - SampleComponentB.tsx
      

Template for building components


// Declare the prop types of your component
interface ComponentAProps {
  sampleProp: string
}

// Name your component accordingly — use a named export, not a default export
export const ComponentA = ({ sampleProp }: ComponentAProps) => {
  return <div>ComponentA: {sampleProp}</div>
}