Skip to content

Long SQL code blocks break the AI chat page layout #1905

Description

@openai0229

Environment

Chat2DB Edition

Chat2DB Community

Chat2DB Version

Source build at commit 58ad9a8fb546cfcd00a9a10ba57d83df8410daef

Deployment

Desktop

Operating System

macOS

Operating System Version

macOS 27.0 (26A5378n)

Database and Version

N/A

Problem and Reproduction

Problem Summary

When an AI response contains a very long SQL code block, the code block expands the response content beyond its available width and breaks the AI chat page layout.

Steps to Reproduce

  1. Start the Chat2DB Community desktop application.
  2. Open the AI chat page.
  3. Ask a question that produces a long SQL statement with long lines.
  4. Expand the reasoning section or view the response containing the SQL code block.
  5. Observe the response column and the surrounding page layout.

Expected Behavior

The response column stays within the available chat width. Long SQL lines scroll horizontally inside the code block without changing the width or position of the surrounding page.

Actual Behavior

The long SQL code block establishes an oversized intrinsic width. The response content is pushed to the right, a large blank area appears, and the overall chat layout no longer fits the viewport correctly.

Evidence

Logs

N/A - this is a frontend layout issue and does not produce a runtime error.

Screenshots or Additional Context

A reproduction screenshot shows the response column shifted to the right while the long SQL code block overflows horizontally. The code block should own its horizontal scrolling instead of expanding the chat message container.

Impact and Workaround

Impact

Degrades a core workflow

Workaround

A partial workaround exists: collapse the reasoning section or avoid displaying SQL with very long lines.

Submission Checklist

  • I reproduced this on the selected Chat2DB edition.
  • I searched existing issues for duplicates.
  • I removed credentials and private data.

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions