Allow removing columns in search mode via inline icon instead of editing SELECT statement

[MikeShi42]

Currently, removing columns in search mode requires manually editing the SELECT statement at the top of the page. This is friction-heavy. We should add a small remove/close icon directly next to each column header so users can quickly remove columns without touching the query.

[alex-fedotyev]

@claude - can you improve this by adding a hover action on the column with X button to remove the column? make sure to follow styles and themes.

[claude]

Claude finished @alex-fedotyev's task in 6m 43s —— View job • claude/issue-1784-20260226-2328 • Create PR ➔

---

Implemented: Add hover X button to remove columns in search mode

Tasks:

• Analyze the request
• Find relevant files for column headers in search mode
• Understand existing column removal mechanism (toggleColumn in RowSidePanelContext)
• Add hover state + X button to TableHeader.tsx
• Add onRemoveColumn prop to RawLogTable and pass to TableHeader
• Wire toggleColumn from context to DBSqlRowTableComponent → RawLogTable
• Commit and push changes

Summary

Added a hover-reveal X button to each column header in the search results table. When hovering over any column header, a small × icon appears (Mantine ActionIcon, variant subtle, color gray) that removes the column from the SELECT query without needing to manually edit the query input.

Changes made:

packages/app/src/components/DBTable/TableHeader.tsx

• Added onRemoveColumn?: () => void prop
• Added useState hover tracking via onMouseEnter/onMouseLeave on the <th>
• Renders ActionIcon with IconX (size 10, variant="subtle", color="gray") when hovered and onRemoveColumn is provided
• Uses e.stopPropagation() to prevent triggering column sort

packages/app/src/components/DBRowTable.tsx

• Added onRemoveColumn?: (column: string) => void prop to RawLogTable
• Passes onRemoveColumn to each TableHeader, resolving the column name from columnDef.meta.column
• In DBSqlRowTableComponent: reads toggleColumn from RowSidePanelContext via useContext and passes it to RawLogTable

The toggleColumn function already existed in RowSidePanelContext (populated by DBSearchPage) and handles filtering the column out of the SELECT statement and re-running the query.

|