feat: Execute production readiness plan

src/components/admin/LocationSearch.tsx

@@ -6,6 +6,7 @@ import { Button } from '@/components/ui/button';
 import { Card } from '@/components/ui/card';
 import { MapPin, Loader2, X } from 'lucide-react';
 import { ParkLocationMap } from '@/components/maps/ParkLocationMap';
+import { logger } from '@/lib/logger';
 
 interface LocationResult {
   place_id: number;

src/components/moderation/ConflictResolutionDialog.tsx

@@ -6,9 +6,8 @@ import { Label } from '@/components/ui/label';
 import { Alert, AlertDescription } from '@/components/ui/alert';
 import { AlertCircle } from 'lucide-react';
 import { type DependencyConflict, type SubmissionItemWithDeps } from '@/lib/submissionItemsService';
-import { useToast } from '@/hooks/use-toast';
 import { useAuth } from '@/hooks/useAuth';
-import { getErrorMessage } from '@/lib/errorHandler';
+import { handleError, handleSuccess } from '@/lib/errorHandler';
 
 interface ConflictResolutionDialogProps {
   open: boolean;
@@ -26,7 +25,6 @@ export function ConflictResolutionDialog({
   onResolve,
 }: ConflictResolutionDialogProps) {
   const [resolutions, setResolutions] = useState<Record<string, string>>({});
-  const { toast } = useToast();
   const { user } = useAuth();
 
   const handleResolutionChange = (itemId: string, action: string) => {
@@ -39,10 +37,9 @@ export function ConflictResolutionDialog({
 
   const handleApply = async () => {
     if (!user?.id) {
-      toast({
+      handleError(new Error('Authentication required'), {
-        title: 'Authentication Required',
+        action: 'Resolve Conflicts',
-        description: 'You must be logged in to resolve conflicts',
+        metadata: { conflictCount: conflicts.length }
-        variant: 'destructive',
       });
       return;
     }
@@ -53,27 +50,22 @@ export function ConflictResolutionDialog({
       const result = await resolveConflicts(conflicts, resolutions, items, user.id);
       
       if (!result.success) {
-        toast({
+        handleError(new Error(result.error || 'Failed to resolve conflicts'), {
-          title: 'Resolution Failed',
+          action: 'Resolve Conflicts',
-          description: result.error || 'Failed to resolve conflicts',
+          userId: user.id,
-          variant: 'destructive',
+          metadata: { conflictCount: conflicts.length }
         });
         return;
       }
       
-      toast({
+      handleSuccess('Conflicts Resolved', 'All conflicts have been resolved successfully');
-        title: 'Conflicts Resolved',
-        description: 'All conflicts have been resolved successfully',
-      });
-      
       onResolve();
       onOpenChange(false);
-    } catch (error) {
+    } catch (error: unknown) {
-      const errorMsg = getErrorMessage(error);
+      handleError(error, {
-      toast({
+        action: 'Resolve Conflicts',
-        title: 'Error',
+        userId: user.id,
-        description: errorMsg,
+        metadata: { conflictCount: conflicts.length }
-        variant: 'destructive',
       });
     }
   };

src/components/moderation/EntityEditPreview.tsx

@@ -4,6 +4,7 @@ import { Card, CardContent } from '@/components/ui/card';
 import { supabase } from '@/integrations/supabase/client';
 import { Image as ImageIcon } from 'lucide-react';
 import { PhotoModal } from './PhotoModal';
+import { handleError } from '@/lib/errorHandler';
 
 interface EntityEditPreviewProps {
   submissionId: string;
@@ -162,8 +163,11 @@ export const EntityEditPreview = ({ submissionId, entityType, entityName }: Enti
 
         setChangedFields(changed);
       }
-    } catch (error) {
+    } catch (error: unknown) {
-      console.error('EntityEditPreview.fetchSubmissionItems: Error fetching submission items:', error);
+      handleError(error, {
+        action: 'Load Submission Preview',
+        metadata: { submissionId, entityType }
+      });
     } finally {
       setLoading(false);
     }

src/components/moderation/ProfileManager.tsx

@@ -10,7 +10,7 @@ import { Badge } from '@/components/ui/badge';
 import { Select, SelectContent, SelectItem, SelectTrigger, SelectValue } from '@/components/ui/select';
 import { AlertDialog, AlertDialogAction, AlertDialogCancel, AlertDialogContent, AlertDialogDescription, AlertDialogFooter, AlertDialogHeader, AlertDialogTitle, AlertDialogTrigger } from '@/components/ui/alert-dialog';
 import { Avatar, AvatarFallback, AvatarImage } from '@/components/ui/avatar';
-import { useToast } from '@/hooks/use-toast';
+import { handleError, handleSuccess } from '@/lib/errorHandler';
 
 interface UserProfile {
   id: string;
@@ -26,7 +26,6 @@ interface UserProfile {
 export function ProfileManager() {
   const { user } = useAuth();
   const { permissions, loading: roleLoading } = useUserRole();
-  const { toast } = useToast();
   
   const [profiles, setProfiles] = useState<UserProfile[]>([]);
   const [loading, setLoading] = useState(true);
@@ -69,12 +68,10 @@ export function ProfileManager() {
       );
 
       setProfiles(profilesWithRoles);
-    } catch (error) {
+    } catch (error: unknown) {
-      console.error('Error fetching profiles:', error);
+      handleError(error, {
-      toast({
+        action: 'Load User Profiles',
-        title: "Error",
+        userId: user?.id
-        description: "Failed to fetch user profiles.",
-        variant: "destructive",
       });
     } finally {
       setLoading(false);
@@ -105,19 +102,15 @@ export function ProfileManager() {
 
       if (logError) console.error('Error logging action:', logError);
 
-      toast({
+      handleSuccess('Success', `User ${ban ? 'banned' : 'unbanned'} successfully.`);
-        title: "Success",
-        description: `User ${ban ? 'banned' : 'unbanned'} successfully.`,
-      });
 
       // Refresh profiles
       fetchProfiles();
-    } catch (error) {
+    } catch (error: unknown) {
-      console.error('Error updating user ban status:', error);
+      handleError(error, {
-      toast({
+        action: `${ban ? 'Ban' : 'Unban'} User`,
-        title: "Error",
+        userId: user?.id,
-        description: `Failed to ${ban ? 'ban' : 'unban'} user.`,
+        metadata: { targetUserId, ban }
-        variant: "destructive",
       });
     } finally {
       setActionLoading(null);
@@ -144,19 +137,19 @@ export function ProfileManager() {
       } else {
         // Check permissions before allowing role assignment
         if (newRole === 'admin' && !permissions.can_manage_admin_roles) {
-          toast({
+          handleError(new Error('Insufficient permissions'), {
-            title: "Access Denied",
+            action: 'Assign Admin Role',
-            description: "You don't have permission to assign admin roles.",
+            userId: user?.id,
-            variant: "destructive",
+            metadata: { targetUserId, attemptedRole: newRole }
           });
           return;
         }
 
         if (newRole === 'superuser') {
-          toast({
+          handleError(new Error('Cannot assign superuser via UI'), {
-            title: "Access Denied",
+            action: 'Assign Superuser Role',
-            description: "Superuser roles can only be assigned directly in the database.",
+            userId: user?.id,
-            variant: "destructive",
+            metadata: { targetUserId }
           });
           return;
         }
@@ -184,19 +177,15 @@ export function ProfileManager() {
 
       if (logError) console.error('Error logging action:', logError);
 
-      toast({
+      handleSuccess('Success', 'User role updated successfully.');
-        title: "Success",
-        description: `User role updated successfully.`,
-      });
 
       // Refresh profiles
       fetchProfiles();
-    } catch (error) {
+    } catch (error: unknown) {
-      console.error('Error updating user role:', error);
+      handleError(error, {
-      toast({
+        action: 'Update User Role',
-        title: "Error",
+        userId: user?.id,
-        description: "Failed to update user role.",
+        metadata: { targetUserId, newRole, previousRoles: currentRoles }
-        variant: "destructive",
       });
     } finally {
       setActionLoading(null);

src/components/moderation/QueueItem.tsx

@@ -20,6 +20,7 @@ import { ValidationSummary } from './ValidationSummary';
 import type { ValidationResult } from '@/lib/entityValidationSchemas';
 import type { LockStatus } from '@/lib/moderation/lockHelpers';
 import type { ModerationItem } from '@/types/moderation';
+import { handleError } from '@/lib/errorHandler';
 
 interface QueueItemProps {
   item: ModerationItem;
@@ -105,8 +106,11 @@ export const QueueItem = memo(({
     try {
       await onClaimSubmission(item.id);
       // On success, component will re-render with new lock state
-    } catch (error) {
+    } catch (error: unknown) {
-      console.error('Failed to claim submission:', error);
+      handleError(error, {
+        action: 'Claim Submission',
+        metadata: { submissionId: item.id }
+      });
     } finally {
       // Always reset claiming state, even on success
       setIsClaiming(false);

src/components/moderation/ReassignDialog.tsx

@@ -18,8 +18,8 @@ import {
   SelectValue,
 } from '@/components/ui/select';
 import { supabase } from '@/integrations/supabase/client';
-import { useToast } from '@/hooks/use-toast';
+import { handleError } from '@/lib/errorHandler';
-import { getErrorMessage } from '@/lib/errorHandler';
+import { logger } from '@/lib/logger';
 
 interface Moderator {
   user_id: string;
@@ -45,7 +45,6 @@ export function ReassignDialog({
   const [moderators, setModerators] = useState<Moderator[]>([]);
   const [isSubmitting, setIsSubmitting] = useState(false);
   const [loading, setLoading] = useState(true);
-  const { toast } = useToast();
 
   useEffect(() => {
     if (open) {
@@ -88,13 +87,10 @@ export function ReassignDialog({
       });
 
       setModerators(moderatorsList);
-    } catch (error) {
+    } catch (error: unknown) {
-      const errorMsg = getErrorMessage(error);
+      handleError(error, {
-      console.error('Error fetching moderators:', errorMsg);
+        action: 'Load Moderators List',
-      toast({
+        metadata: { submissionType }
-        title: 'Error',
-        description: 'Failed to load moderators list',
-        variant: 'destructive',
       });
     } finally {
       setLoading(false);

src/components/moderation/RecentActivity.tsx

@@ -1,8 +1,7 @@
 import { useState, useEffect, forwardRef, useImperativeHandle } from 'react';
 import { supabase } from '@/integrations/supabase/client';
 import { useAuth } from '@/hooks/useAuth';
-import { useToast } from '@/hooks/use-toast';
+import { handleError } from '@/lib/errorHandler';
-import { getErrorMessage } from '@/lib/errorHandler';
 import { ActivityCard } from './ActivityCard';
 import { Skeleton } from '@/components/ui/skeleton';
 import { Activity as ActivityIcon } from 'lucide-react';
@@ -33,7 +32,6 @@ export const RecentActivity = forwardRef<RecentActivityRef>((props, ref) => {
   const [loading, setLoading] = useState(true);
   const [isSilentRefresh, setIsSilentRefresh] = useState(false);
   const { user } = useAuth();
-  const { toast } = useToast();
   const { getAutoRefreshStrategy } = useAdminSettings();
   const refreshStrategy = getAutoRefreshStrategy();
 
@@ -151,13 +149,10 @@ export const RecentActivity = forwardRef<RecentActivityRef>((props, ref) => {
         // Full replacement for non-silent refreshes or 'replace' strategy
         setActivities(recentActivities);
       }
-    } catch (error) {
+    } catch (error: unknown) {
-      const errorMsg = getErrorMessage(error);
+      handleError(error, {
-      console.error('Error fetching recent activity:', errorMsg);
+        action: 'Load Recent Activity',
-      toast({
+        userId: user?.id
-        title: "Error",
-        description: "Failed to load recent activity",
-        variant: "destructive",
       });
     } finally {
       if (!silent) {

src/components/moderation/ReportsQueue.tsx

@@ -16,12 +16,12 @@ import {
   PaginationPrevious,
 } from '@/components/ui/pagination';
 import { supabase } from '@/integrations/supabase/client';
-import { useToast } from '@/hooks/use-toast';
 import { format } from 'date-fns';
 import { useAdminSettings } from '@/hooks/useAdminSettings';
 import { useAuth } from '@/hooks/useAuth';
 import { useIsMobile } from '@/hooks/use-mobile';
 import { smartMergeArray } from '@/lib/smartStateUpdate';
+import { handleError, handleSuccess } from '@/lib/errorHandler';
 
 // Type-safe reported content interfaces
 interface ReportedReview {
@@ -112,7 +112,6 @@ export const ReportsQueue = forwardRef<ReportsQueueRef>((props, ref) => {
   const [isInitialLoad, setIsInitialLoad] = useState(true);
   const [actionLoading, setActionLoading] = useState<string | null>(null);
   const [newReportsCount, setNewReportsCount] = useState(0);
-  const { toast } = useToast();
   const { user } = useAuth();
   
   // Pagination state
@@ -301,12 +300,11 @@ export const ReportsQueue = forwardRef<ReportsQueueRef>((props, ref) => {
         setReports(reportsWithContent);
         setNewReportsCount(0);
       }
-    } catch (error) {
+    } catch (error: unknown) {
-      console.error('Error fetching reports:', error);
+      handleError(error, {
-      toast({
+        action: 'Load Reports',
-        title: "Error",
+        userId: user?.id,
-        description: "Failed to load reports queue",
+        metadata: { currentPage, pageSize }
-        variant: "destructive",
       });
     } finally {
       // Only clear loading if it was set
@@ -352,10 +350,7 @@ export const ReportsQueue = forwardRef<ReportsQueueRef>((props, ref) => {
 
       if (error) throw error;
 
-      toast({
+      handleSuccess(`Report ${action}`, `The report has been marked as ${action}`);
-        title: `Report ${action}`,
-        description: `The report has been marked as ${action}`,
-      });
 
       // Remove report from queue
       setReports(prev => {
@@ -366,12 +361,11 @@ export const ReportsQueue = forwardRef<ReportsQueueRef>((props, ref) => {
         }
         return newReports;
       });
-    } catch (error) {
+    } catch (error: unknown) {
-      console.error('Error updating report:', error);
+      handleError(error, {
-      toast({
+        action: `${action === 'reviewed' ? 'Resolve' : 'Dismiss'} Report`,
-        title: "Error",
+        userId: user?.id,
-        description: `Failed to ${action} report`,
+        metadata: { reportId, action }
-        variant: "destructive",
       });
     } finally {
       setActionLoading(null);

src/components/moderation/UserRoleManager.tsx

@@ -9,7 +9,7 @@ import { Select, SelectContent, SelectItem, SelectTrigger, SelectValue } from '@
 import { supabase } from '@/integrations/supabase/client';
 import { useAuth } from '@/hooks/useAuth';
 import { useUserRole } from '@/hooks/useUserRole';
-import { useToast } from '@/hooks/use-toast';
+import { handleError, handleSuccess } from '@/lib/errorHandler';
 
 // Type-safe role definitions
 const VALID_ROLES = ['admin', 'moderator', 'user'] as const;
@@ -66,9 +66,6 @@ export function UserRoleManager() {
     isSuperuser,
     permissions
   } = useUserRole();
-  const {
-    toast
-  } = useToast();
   const fetchUserRoles = async () => {
     try {
       const {
@@ -99,12 +96,10 @@ export function UserRoleManager() {
         profiles: profileMap.get(role.user_id)
       }));
       setUserRoles(userRolesWithProfiles);
-    } catch (error) {
+    } catch (error: unknown) {
-      console.error('Error fetching user roles:', error);
+      handleError(error, {
-      toast({
+        action: 'Load User Roles',
-        title: "Error",
+        userId: user?.id
-        description: "Failed to load user roles",
-        variant: "destructive"
       });
     } finally {
       setLoading(false);
@@ -144,10 +139,10 @@ export function UserRoleManager() {
     
     // Double-check role validity before database operation
     if (!isValidRole(role)) {
-      toast({
+      handleError(new Error('Invalid role'), {
-        title: "Invalid Role",
+        action: 'Grant Role',
-        description: "The selected role is not valid",
+        userId: user?.id,
-        variant: "destructive"
+        metadata: { targetUserId: userId, attemptedRole: role }
       });
       return;
     }
@@ -164,20 +159,16 @@ export function UserRoleManager() {
       
       if (error) throw error;
       
-      toast({
+      handleSuccess('Role Granted', `User has been granted ${getRoleLabel(role)} role`);
-        title: "Role Granted",
-        description: `User has been granted ${getRoleLabel(role)} role`
-      });
       setNewUserSearch('');
       setNewRole('');
       setSearchResults([]);
       fetchUserRoles();
-    } catch (error) {
+    } catch (error: unknown) {
-      console.error('Error granting role:', error);
+      handleError(error, {
-      toast({
+        action: 'Grant Role',
-        title: "Error",
+        userId: user?.id,
-        description: "Failed to grant role",
+        metadata: { targetUserId: userId, role }
-        variant: "destructive"
       });
     } finally {
       setActionLoading(null);
@@ -191,17 +182,13 @@ export function UserRoleManager() {
         error
       } = await supabase.from('user_roles').delete().eq('id', roleId);
       if (error) throw error;
-      toast({
+      handleSuccess('Role Revoked', 'User role has been revoked');
-        title: "Role Revoked",
-        description: "User role has been revoked"
-      });
       fetchUserRoles();
-    } catch (error) {
+    } catch (error: unknown) {
-      console.error('Error revoking role:', error);
+      handleError(error, {
-      toast({
+        action: 'Revoke Role',
-        title: "Error",
+        userId: user?.id,
-        description: "Failed to revoke role",
+        metadata: { roleId }
-        variant: "destructive"
       });
     } finally {
       setActionLoading(null);
@@ -273,10 +260,10 @@ export function UserRoleManager() {
           } else if (selectedUser && newRole) {
             // This should never happen due to Select component constraints,
             // but provides safety in case of UI bugs
-            toast({
+            handleError(new Error('Invalid role selected'), {
-              title: "Invalid Role",
+              action: 'Grant Role',
-              description: "Please select a valid role",
+              userId: user?.id,
-              variant: "destructive"
+              metadata: { selectedUser: selectedUser?.user_id, newRole }
             });
           }
         }} disabled={!newRole || !isValidRole(newRole) || !searchResults.find(p => (p.display_name || p.username) === newUserSearch) || actionLoading === 'grant'} className="w-full md:w-auto">

src/components/moderation/ValidationSummary.tsx

@@ -5,6 +5,7 @@ import { Button } from '@/components/ui/button';
 import { Alert, AlertDescription, AlertTitle } from '@/components/ui/alert';
 import { Collapsible, CollapsibleContent, CollapsibleTrigger } from '@/components/ui/collapsible';
 import { validateEntityData, ValidationResult } from '@/lib/entityValidationSchemas';
+import { logger } from '@/lib/logger';
 
 interface ValidationSummaryProps {
   item: {
@@ -76,8 +77,12 @@ export function ValidationSummary({ item, onValidationChange, compact = false, v
         
         setValidationResult(result);
         onValidationChange?.(result);
-      } catch (error) {
+      } catch (error: unknown) {
-        console.error('Validation error:', error);
+        logger.error('Entity validation failed', {
+          action: 'validate_entity',
+          entityType: item.item_type,
+          error: error instanceof Error ? error.message : String(error)
+        });
         setValidationResult({
           isValid: false,
           blockingErrors: [{ field: 'validation', message: 'Failed to validate', severity: 'blocking' }],