supabase / supabase / 26937450488

74%

push

github

fix(studio): remove default DataGrid borders in table editor (#46633)

Follow-up to #46448, which removed the doubled DataGrid borders across
Studio. The table editor grid had the same doubled border at the bottom,
but unlike the other grids it still needs a top border — and that top
border was rendering in react-data-grid's own `--rdg-border-color`
rather than the studio default.

**Changed:**
- Removed the doubled bottom border on the table editor `<DataGrid>`
(`border-b-0!`)
- Forced the top border to the default border color via the
`border-t-default!` token (≈ rgb(46,46,46) / `--border-default`) instead
of leaning on react-data-grid's `--rdg-border-color`

## To test

- Open the table editor for any table (`/project/[ref]/editor/[id]`)
- Confirm there's a single top border between the filter/sort toolbar
and the grid header, in the standard border color
- Confirm there's no extra line at the bottom of the grid

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

## Summary by CodeRabbit

* **Style**
* Refined grid visuals and spacing to improve alignment and visual
consistency across the app. Adjustments to border and growth behavior
reduce border inconsistencies and layout jitter during resizing. Context
menu display behavior remains intact, ensuring expected right-click
interactions continue to work smoothly for users.

<!-- end of auto-generated comment: release notes by coderabbit.ai -->

---------

Co-authored-by: Alaister Young <10985857+alaister@users.noreply.github.com>

989 of 1386 branches covered (71.36%)

Branch coverage included in aggregate %.

1525 of 2083 relevant lines covered (73.21%)

247.13 hits per line