fix(studio): fix double scrollbar and Firefox rendering in QueryBlock results

Make the results container a flex-col so the DataGrid sizes via flex layout
instead of height: 100%. This fixes Firefox (flex resolves sizes independent
of percentage-height rules) and eliminates the double scrollbar (removed
overflow-auto from parent, DataGrid's built-in overflow handles scrolling).
Added min-h-0 on DataGrid so it can shrink below its default 350px.
This commit is contained in:
Ali Waseem committed 2026-04-06 10:14:31 -06:00
1 parent 619e5f5ef4
commit cbd2901a47
2 files changed
+2 -2

No files matched your search

@@ -134,7 +134,7 @@ const Results = ({ rows }: { rows: readonly any[] }) => {
<DataGrid
columns={columns}
rows={rows}
className="flex-grow border-t-0"
className="flex-grow min-h-0 border-t-0"
rowClass={() => '[&>.rdg-cell]:items-center'}
onSelectedCellChange={setCellPosition}
onCellKeyDown={handleCopyCell}
@@ -342,7 +342,7 @@ export const QueryBlock = ({
</div>
) : (
results && (
<div className={cn('flex-1 w-full overflow-auto relative max-h-64')}>
<div className={cn('flex flex-col flex-1 w-full relative max-h-64')}>
<Results rows={results} />
</div>
)