pacnpal/thrilltrack-explorer
1
0
Fork 0
mirror of https://github.com/pacnpal/thrilltrack-explorer.git synced 2025-12-26 13:46:59 -05:00
Code Issues Packages Projects Releases Wiki Activity

Changes

Browse Source
This commit is contained in:
gpt-engineer-app[bot]
2025-11-12 14:39:34 +00:00
parent a35486fb11
commit aed16f688a
1 changed files with 19 additions and 6 deletions
Download Patch File Download Diff File Expand all files Collapse all files

25
src/components/moderation/DetailedViewCollapsible.tsx
View File

@@ -1,12 +1,14 @@
import { ChevronDown, ChevronUp } from 'lucide-react'; import { ChevronDown, ChevronUp } from 'lucide-react';
import { Collapsible, CollapsibleTrigger, CollapsibleContent } from '@/components/ui/collapsible'; import { Collapsible, CollapsibleTrigger, CollapsibleContent } from '@/components/ui/collapsible';
import { Button } from '@/components/ui/button'; import { Button } from '@/components/ui/button';
import { Badge } from '@/components/ui/badge';
import { cn } from '@/lib/utils'; import { cn } from '@/lib/utils';
interface DetailedViewCollapsibleProps { interface DetailedViewCollapsibleProps {
isCollapsed: boolean; isCollapsed: boolean;
onToggle: () => void; onToggle: () => void;
children: React.ReactNode; children: React.ReactNode;
fieldCount?: number;
className?: string; className?: string;
} }
@@ -18,6 +20,7 @@ export function DetailedViewCollapsible({
isCollapsed, isCollapsed,
onToggle, onToggle,
children, children,
fieldCount,
className className
}: DetailedViewCollapsibleProps) { }: DetailedViewCollapsibleProps) {
return ( return (
@@ -27,25 +30,35 @@ export function DetailedViewCollapsible({
<Button <Button
variant="ghost" variant="ghost"
size="sm" size="sm"
className="w-full flex items-center justify-between hover:bg-muted/50 p-2 h-auto" className="w-full flex items-center justify-between hover:bg-muted/50 p-2 h-auto transition-colors"
> >
<div className="text-xs font-semibold text-muted-foreground uppercase tracking-wide"> <div className="flex items-center gap-2">
All Fields (Detailed View) <span className="text-xs font-semibold text-muted-foreground uppercase tracking-wide">
All Fields (Detailed View)
</span>
{fieldCount !== undefined && fieldCount > 0 && (
<Badge
variant="secondary"
className="h-5 px-1.5 text-xs font-normal transition-transform duration-200 hover:scale-105"
>
{fieldCount}
</Badge>
)}
</div> </div>
<div className="flex items-center gap-2"> <div className="flex items-center gap-2">
<span className="text-xs text-muted-foreground normal-case font-normal"> <span className="text-xs text-muted-foreground normal-case font-normal">
{isCollapsed ? 'Show' : 'Hide'} {isCollapsed ? 'Show' : 'Hide'}
</span> </span>
{isCollapsed ? ( {isCollapsed ? (
<ChevronDown className="h-4 w-4 text-muted-foreground" /> <ChevronDown className="h-4 w-4 text-muted-foreground transition-transform duration-200" />
) : ( ) : (
<ChevronUp className="h-4 w-4 text-muted-foreground" /> <ChevronUp className="h-4 w-4 text-muted-foreground transition-transform duration-200" />
)} )}
</div> </div>
</Button> </Button>
</CollapsibleTrigger> </CollapsibleTrigger>
<CollapsibleContent className="mt-3"> <CollapsibleContent className="mt-3 data-[state=closed]:animate-accordion-up data-[state=open]:animate-accordion-down">
{children} {children}
</CollapsibleContent> </CollapsibleContent>
</div> </div>