mirror of
https://github.com/supabase/supabase.git
synced 2026-10-05 09:25:06 +03:00
Fix duplicate empty state in unified logs (#45969)
## Before <img width="2280" height="1564" alt="image" src="https://github.com/user-attachments/assets/08d91834-a188-4b09-b266-d9d4b7c88959" /> ## After Also centralized the empty state <img width="1448" height="960" alt="image" src="https://github.com/user-attachments/assets/3ee1d386-b98e-49ee-b8ea-6a1c6b4359ab" /> <!-- This is an auto-generated comment: release notes by coderabbit.ai --> ## Summary by CodeRabbit * **Bug Fixes** * Improved infinite scroll data table display when loading or empty * "No more data to load" message now appears only when data exists, reducing redundant messaging * Refined table styling for better visual presentation during different states <!-- review_stack_entry_start --> [](https://app.coderabbit.ai/change-stack/supabase/supabase/pull/45969) <!-- review_stack_entry_end --> <!-- end of auto-generated comment: release notes by coderabbit.ai -->
This commit is contained in:
1 parent
598d664213
commit
179f00cceb
1 file changed
+15
-11
@@ -73,9 +73,10 @@ export function DataTableInfinite<TData, TValue, TMeta>({
|
||||
<Table
|
||||
ref={tableRef}
|
||||
onScroll={onScroll}
|
||||
className={
|
||||
isLoading ? '[mask-image:linear-gradient(to_bottom,black_70%,transparent_100%)]' : ''
|
||||
}
|
||||
className={cn(
|
||||
!isLoading && rows.length === 0 && 'h-full',
|
||||
isLoading && '[mask-image:linear-gradient(to_bottom,black_70%,transparent_100%)]'
|
||||
)}
|
||||
>
|
||||
<TableHeader>
|
||||
<TableRow className="bg-surface-75">
|
||||
@@ -146,8 +147,8 @@ export function DataTableInfinite<TData, TValue, TMeta>({
|
||||
</Fragment>
|
||||
) : (
|
||||
<Fragment>
|
||||
<TableRow>
|
||||
<TableCell colSpan={columns.length} className="h-[32vh] text-center">
|
||||
<TableRow className="hover:bg-transparent h-full">
|
||||
<TableCell colSpan={columns.length} className="text-center">
|
||||
<div className="flex flex-col items-center justify-center h-full gap-3">
|
||||
<p className="text-foreground-light text-sm">No results found</p>
|
||||
</div>
|
||||
@@ -184,12 +185,15 @@ export function DataTableInfinite<TData, TValue, TMeta>({
|
||||
</p>
|
||||
</div>
|
||||
) : (
|
||||
<p className="text-xs text-foreground-lighter">
|
||||
No more data to load (
|
||||
<span className="font-mono font-medium">{formatCompactNumber(filterRows)}</span>{' '}
|
||||
of <span className="font-mono font-medium">{formatCompactNumber(totalRows)}</span>{' '}
|
||||
rows)
|
||||
</p>
|
||||
rows.length > 0 && (
|
||||
<p className="text-xs text-foreground-lighter">
|
||||
No more data to load (
|
||||
<span className="font-mono font-medium">{formatCompactNumber(filterRows)}</span>{' '}
|
||||
of{' '}
|
||||
<span className="font-mono font-medium">{formatCompactNumber(totalRows)}</span>{' '}
|
||||
rows)
|
||||
</p>
|
||||
)
|
||||
)}
|
||||
</TableCell>
|
||||
</TableRow>
|
||||
|
||||
Reference in new issue
Block a user