pacnpal/thrilltrack-explorer
1
0
Fork 0
mirror of https://github.com/pacnpal/thrilltrack-explorer.git synced 2025-12-26 12:07:00 -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 { Collapsible, CollapsibleTrigger, CollapsibleContent } from '@/components/ui/collapsible';
import { Button } from '@/components/ui/button';
import { Badge } from '@/components/ui/badge';
import { cn } from '@/lib/utils';
interface DetailedViewCollapsibleProps {
isCollapsed: boolean;
onToggle: () => void;
children: React.ReactNode;
fieldCount?: number;
className?: string;
}
@@ -18,6 +20,7 @@ export function DetailedViewCollapsible({
isCollapsed,
onToggle,
children,
fieldCount,
className
}: DetailedViewCollapsibleProps) {
return (
@@ -27,25 +30,35 @@ export function DetailedViewCollapsible({
<Button
variant="ghost"
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">
All Fields (Detailed View)
<div className="flex items-center gap-2">
<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 className="flex items-center gap-2">
<span className="text-xs text-muted-foreground normal-case font-normal">
{isCollapsed ? 'Show' : 'Hide'}
</span>
{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>
</Button>
</CollapsibleTrigger>
<CollapsibleContent className="mt-3">
<CollapsibleContent className="mt-3 data-[state=closed]:animate-accordion-up data-[state=open]:animate-accordion-down">
{children}
</CollapsibleContent>
</div>