|
9 | 9 | import * as React from 'react'; |
10 | 10 | import { cn, Button, Input, Popover, PopoverContent, PopoverTrigger, FilterBuilder, SortBuilder, NavigationOverlay } from '@object-ui/components'; |
11 | 11 | import type { SortItem } from '@object-ui/components'; |
12 | | -import { Search, SlidersHorizontal, ArrowUpDown, X, EyeOff, Group, Paintbrush, Ruler, Inbox } from 'lucide-react'; |
| 12 | +import { Search, SlidersHorizontal, ArrowUpDown, X, EyeOff, Group, Paintbrush, Ruler, Inbox, icons, type LucideIcon } from 'lucide-react'; |
13 | 13 | import type { FilterGroup } from '@object-ui/components'; |
14 | 14 | import { ViewSwitcher, ViewType } from './ViewSwitcher'; |
15 | 15 | import { SchemaRenderer, useNavigationOverlay } from '@object-ui/react'; |
@@ -593,15 +593,25 @@ export const ListView: React.FC<ListViewProps> = ({ |
593 | 593 | {/* View Content */} |
594 | 594 | <div key={currentView} className="flex-1 min-h-0 bg-background relative overflow-hidden animate-in fade-in-0 duration-200"> |
595 | 595 | {!loading && data.length === 0 ? ( |
596 | | - <div className="flex flex-col items-center justify-center h-full min-h-[200px] text-center p-8" data-testid="empty-state"> |
597 | | - <Inbox className="h-12 w-12 text-muted-foreground/50 mb-4" /> |
598 | | - <h3 className="text-lg font-medium text-foreground mb-1"> |
599 | | - {(typeof schema.emptyState?.title === 'string' ? schema.emptyState.title : undefined) ?? 'No items found'} |
600 | | - </h3> |
601 | | - <p className="text-sm text-muted-foreground max-w-md"> |
602 | | - {(typeof schema.emptyState?.message === 'string' ? schema.emptyState.message : undefined) ?? 'There are no records to display. Try adjusting your filters or adding new data.'} |
603 | | - </p> |
604 | | - </div> |
| 596 | + (() => { |
| 597 | + const iconName = schema.emptyState?.icon; |
| 598 | + const ResolvedIcon: LucideIcon = iconName |
| 599 | + ? ((icons as Record<string, LucideIcon>)[ |
| 600 | + iconName.split('-').map(w => w.charAt(0).toUpperCase() + w.slice(1)).join('') |
| 601 | + ] ?? Inbox) |
| 602 | + : Inbox; |
| 603 | + return ( |
| 604 | + <div className="flex flex-col items-center justify-center h-full min-h-[200px] text-center p-8" data-testid="empty-state"> |
| 605 | + <ResolvedIcon className="h-12 w-12 text-muted-foreground/50 mb-4" /> |
| 606 | + <h3 className="text-lg font-medium text-foreground mb-1"> |
| 607 | + {(typeof schema.emptyState?.title === 'string' ? schema.emptyState.title : undefined) ?? 'No items found'} |
| 608 | + </h3> |
| 609 | + <p className="text-sm text-muted-foreground max-w-md"> |
| 610 | + {(typeof schema.emptyState?.message === 'string' ? schema.emptyState.message : undefined) ?? 'There are no records to display. Try adjusting your filters or adding new data.'} |
| 611 | + </p> |
| 612 | + </div> |
| 613 | + ); |
| 614 | + })() |
605 | 615 | ) : ( |
606 | 616 | <SchemaRenderer |
607 | 617 | schema={viewComponentSchema} |
|
0 commit comments