Fix missing loader in table grid editor while rows are loading (#42605)

## Context

Fix missing loader in table grid editor while the rows are loading - the
loading UI was rendering, but its width was 0 hence not showing up

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

## Summary by CodeRabbit

* **Style**
* Improved grid layout styling to utilize full-width display
configuration.
* Enhanced loading skeleton container styling with better absolute
positioning and spacing.
* Refined empty state container layout for improved visual presentation.

* **Refactor**
  * Removed unused internal dependencies.

<!-- end of auto-generated comment: release notes by coderabbit.ai -->
This commit is contained in:
Joshen Lim authored and GitHub committed 2026-02-09 16:30:02 +08:00
1 parent 0628f2f07d
commit ddc687bd64
2 files changed
+5 -3

No files matched your search

+1 -1
View File
@@ -1,5 +1,5 @@
import { keepPreviousData, useQueryClient } from '@tanstack/react-query'
import { useFlag, useParams } from 'common'
import { useParams } from 'common'
import { isMsSqlForeignTable } from 'data/table-editor/table-editor-types'
import { useTableRowsQuery } from 'data/table-rows/table-rows-query'
import { useSelectedProjectQuery } from 'hooks/misc/useSelectedProject'
@@ -237,7 +237,7 @@ export const Grid = memo(
{(rows ?? []).length === 0 && (
<div
className={cn(
'absolute inset-0 flex flex-col items-center justify-center p-2 z-[1]',
'absolute w-full inset-0 flex flex-col items-center justify-center p-2 z-[1]',
isTableEmpty && isDraggedOver && 'border-2 border-dashed',
isValidFileDraggedOver ? 'border-brand-600' : 'border-destructive-600'
)}
@@ -245,7 +245,9 @@ export const Grid = memo(
onDragLeave={onDragOver}
onDrop={onFileDrop}
>
{isLoading && !isDisabled && <GenericSkeletonLoader />}
{isLoading && !isDisabled && (
<GenericSkeletonLoader className="w-full top-9 absolute p-2" />
)}
{isError && <GridError error={error} />}