Changes

src/components/moderation/DetailedViewCollapsible.tsx

@@ -1,4 +1,4 @@
-import { ChevronDown } from 'lucide-react';
+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';
@@ -49,17 +49,16 @@ export function DetailedViewCollapsible({
               <span className="text-xs text-muted-foreground normal-case font-normal">
                 {isCollapsed ? 'Show' : 'Hide'}
               </span>
-              <ChevronDown 
+              {isCollapsed ? (
-                className={cn(
+                <ChevronDown className="h-4 w-4 text-muted-foreground transition-transform duration-200" />
-                  "h-4 w-4 text-muted-foreground transition-all duration-300 ease-out",
+              ) : (
-                  !isCollapsed && "rotate-180"
+                <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>

src/components/ui/collapsible.tsx

@@ -1,30 +1,9 @@
-import * as React from "react";
 import * as CollapsiblePrimitive from "@radix-ui/react-collapsible";
-import { cn } from "@/lib/utils";
 
 const Collapsible = CollapsiblePrimitive.Root;
 
 const CollapsibleTrigger = CollapsiblePrimitive.CollapsibleTrigger;
 
-const CollapsibleContent = React.forwardRef<
+const CollapsibleContent = CollapsiblePrimitive.CollapsibleContent;
-  React.ElementRef<typeof CollapsiblePrimitive.Content>,
-  React.ComponentPropsWithoutRef<typeof CollapsiblePrimitive.Content>
->(({ className, children, ...props }, ref) => (
-  <CollapsiblePrimitive.Content
-    ref={ref}
-    className={cn(
-      "overflow-hidden transition-all duration-300 ease-out",
-      "data-[state=closed]:animate-accordion-up",
-      "data-[state=open]:animate-accordion-down",
-      className
-    )}
-    {...props}
-  >
-    <div className="animate-fade-in">
-      {children}
-    </div>
-  </CollapsiblePrimitive.Content>
-));
-CollapsibleContent.displayName = "CollapsibleContent";
 
 export { Collapsible, CollapsibleTrigger, CollapsibleContent };

supabase/migrations/20251112145039_d6da1015-893e-4a5b-9f17-d71d03809851.sql

@@ -1,12 +0,0 @@
--- Add moderation_preferences column to user_preferences table
--- This stores moderator UI preferences like detailed view collapsed state
-
-ALTER TABLE public.user_preferences 
-ADD COLUMN IF NOT EXISTS moderation_preferences JSONB NOT NULL DEFAULT '{}'::jsonb;
-
-COMMENT ON COLUMN public.user_preferences.moderation_preferences IS 
-  'Stores moderator UI preferences like detailed view collapsed state';
-
--- Add GIN index for efficient JSONB queries
-CREATE INDEX IF NOT EXISTS idx_user_preferences_moderation_prefs 
-ON public.user_preferences USING gin(moderation_preferences);