@licklist/design 0.78.5-dev.106 → 0.78.5-dev.107

package/src/v2/shadcn/_reference/NotificationPanel.tsx

@@ -1,208 +0,0 @@
-import React, { useState } from 'react';
-import { useNavigate } from 'react-router-dom';
-import { ScrollArea } from './ui/scroll-area';
-import { Button } from './ui/button';
-import { IconArrowInternalReturn, IconCross, IconPlus } from '../../icons';
-import IconNotification from '@/assets/Icon_Notification.svg';
-import IconTime from '@/assets/Icon_Time.svg';
-
-interface Notification {
-  id: string;
-  title: string;
-  message: string;
-  timestamp: string;
-  isNew: boolean;
-  type?: 'notification' | 'reminder';
-}
-
-interface NotificationPanelProps {
-  isOpen: boolean;
-  onClose: () => void;
-  latestCount: number;
-  onMarkAllRead: () => void;
-  onViewAll: () => void;
-}
-
-// Mock data - replace with real data later
-const mockNotifications: Notification[] = [
-  // Reminders (triggered)
-  { id: 'r1', title: 'Reminder', message: 'Follow up with Brad Nobbs about booking confirmation', timestamp: '5 min ago', isNew: true, type: 'reminder' },
-  { id: 'r2', title: 'Reminder', message: 'Review monthly analytics report', timestamp: '30 min ago', isNew: true, type: 'reminder' },
-  { id: 'r3', title: 'Reminder', message: 'Prepare for team meeting at 3pm', timestamp: '1 hour ago', isNew: true, type: 'reminder' },
-  // Latest notifications (9 items to make 12 total with reminders)
-  { id: '1', title: 'New affiliate signup', message: 'John Doe has signed up as an affiliate', timestamp: '2 min ago', isNew: true, type: 'notification' },
-  { id: '2', title: 'Commission earned', message: 'You earned $25.00 from a sale', timestamp: '15 min ago', isNew: true, type: 'notification' },
-  { id: '3', title: 'Payment processed', message: 'Your monthly payment of $500 has been processed', timestamp: '1 hour ago', isNew: true, type: 'notification' },
-  { id: '4', title: 'New conversion', message: 'Affiliate link #1234 generated a conversion', timestamp: '2 hours ago', isNew: true, type: 'notification' },
-  { id: '5', title: 'Profile updated', message: 'Your affiliate profile was successfully updated', timestamp: '3 hours ago', isNew: true, type: 'notification' },
-  { id: '6', title: 'Milestone reached', message: 'Congratulations! You reached 100 affiliates', timestamp: '4 hours ago', isNew: true, type: 'notification' },
-  { id: '7', title: 'New message', message: 'You have a new message from support', timestamp: '5 hours ago', isNew: true, type: 'notification' },
-  { id: '8', title: 'Report ready', message: 'Your monthly report is ready to download', timestamp: '6 hours ago', isNew: true, type: 'notification' },
-  { id: '9', title: 'Link clicked', message: 'Your affiliate link was clicked 50 times today', timestamp: '7 hours ago', isNew: true, type: 'notification' },
-  // Previous reminders
-  { id: 'r4', title: 'Reminder', message: 'Check inventory levels for weekend rush', timestamp: '2 days ago', isNew: false, type: 'reminder' },
-  // Previous notifications
-  { id: '13', title: 'Weekly summary', message: 'Your weekly performance summary is available', timestamp: '2 days ago', isNew: false, type: 'notification' },
-  { id: '14', title: 'Affiliate approved', message: 'New affiliate Sarah Smith was approved', timestamp: '3 days ago', isNew: false, type: 'notification' },
-  { id: '15', title: 'Payout scheduled', message: 'Your next payout is scheduled for May 1st', timestamp: '5 days ago', isNew: false, type: 'notification' },
-  { id: '16', title: 'Campaign ended', message: 'Spring promotion campaign has ended', timestamp: '1 week ago', isNew: false, type: 'notification' },
-  { id: '17', title: 'Terms updated', message: 'Our terms of service have been updated', timestamp: '2 weeks ago', isNew: false, type: 'notification' },
-];
-
-export const NotificationPanel: React.FC<NotificationPanelProps> = ({ 
-  isOpen, 
-  onClose, 
-  latestCount,
-  onMarkAllRead,
-  onViewAll
-}) => {
-  const navigate = useNavigate();
-  const [hoveredNotification, setHoveredNotification] = useState<string | null>(null);
-  
-  if (!isOpen) return null;
-
-  const latestNotifications = mockNotifications.filter(n => n.isNew).slice(0, latestCount);
-  const previousNotifications = mockNotifications.filter(n => !n.isNew);
-
-  const handleSetReminder = () => {
-    onClose();
-    navigate('/set-reminder');
-  };
-
-  const renderNotificationItem = (notification: Notification, isPrevious: boolean = false) => {
-    const isReminder = notification.type === 'reminder';
-    
-    if (isReminder) {
-      // Render reminder as alert-style box with orange/yellow styling
-      return (
-        <div
-          key={notification.id}
-          className="cursor-pointer rounded-lg border border-border-status-alert bg-surface-status-alert p-4 transition-colors hover:opacity-90"
-          onMouseEnter={() => setHoveredNotification(notification.id)}
-          onMouseLeave={() => setHoveredNotification(null)}
-        >
-          <div className="flex items-start gap-3">
-            <div className="w-8 h-8 rounded-full bg-alert-regular flex items-center justify-center flex-shrink-0">
-              <img src={IconTime} alt="" className="w-5 h-5 [filter:brightness(0)_invert(1)]" />
-            </div>
-            <div className="flex-1 min-w-0">
-              <div className="flex items-center justify-between gap-2 mb-0.5">
-                <h4 className="text-sm font-semibold text-label-status-alert">{notification.title}</h4>
-                <span className="text-xs text-label-secondary whitespace-nowrap">{notification.timestamp}</span>
-              </div>
-              <p className="text-xs text-label-primary">{notification.message}</p>
-            </div>
-          </div>
-        </div>
-      );
-    }
-
-    // Regular notification
-    const bgClass = isPrevious 
-      ? 'bg-surface-tertiary hover:bg-surface-tertiary-hover' 
-      : 'bg-surface-secondary hover:bg-surface-secondary-hover';
-
-    return (
-      <div
-        key={notification.id}
-        className={`p-3 rounded-lg ${bgClass} transition-colors cursor-pointer`}
-        onMouseEnter={() => setHoveredNotification(notification.id)}
-        onMouseLeave={() => setHoveredNotification(null)}
-      >
-        <div className="flex items-start justify-between gap-2 mb-1">
-          <h4 className="text-sm font-medium text-label-primary">{notification.title}</h4>
-          <span className="text-xs text-label-secondary whitespace-nowrap">{notification.timestamp}</span>
-        </div>
-        <p className="text-sm text-label-secondary">{notification.message}</p>
-      </div>
-    );
-  };
-
-  return (
-    <>
-      {/* Overlay */}
-      <div 
-        className="fixed inset-0 z-40 animate-fade-in"
-        style={{ backgroundColor: 'var(--overlay-curtain)' }}
-        onClick={onClose}
-      />
-      
-      {/* Panel */}
-      <div 
-        className="fixed right-0 top-0 h-screen w-full sm:w-[420px] bg-surface-primary shadow-xl z-50 animate-slide-in-right"
-        onClick={(e) => e.stopPropagation()}
-      >
-        {/* Header */}
-        <div className="flex items-center justify-between p-4 border-b border-border-primary">
-          <div className="flex items-center gap-2">
-            <img src={IconNotification} alt="" className="w-8 h-8" />
-            <h2 className="text-lg font-semibold text-label-primary">Notifications</h2>
-          </div>
-          <div className="flex items-center gap-1">
-            <Button
-              variant="ghost"
-              size="sm"
-              onClick={handleSetReminder}
-              className="gap-1.5 text-label-secondary hover:text-label-primary"
-            >
-              <IconPlus className="w-4 h-4" />
-              Set Reminder
-            </Button>
-            <button
-              onClick={() => {
-                onViewAll();
-                onClose();
-              }}
-              className="p-2 rounded-lg hover:bg-surface-primary-hover transition-colors flex items-center justify-center"
-              aria-label="View all notifications"
-            >
-              <IconArrowInternalReturn className="w-5 h-5 text-label-secondary" />
-            </button>
-            <button
-              onClick={onClose}
-              className="p-2 rounded-lg hover:bg-surface-primary-hover transition-colors flex items-center justify-center"
-              aria-label="Close notifications"
-            >
-              <IconCross className="w-5 h-5 text-label-secondary" />
-            </button>
-          </div>
-        </div>
-
-        <ScrollArea className="h-[calc(100%-65px)]">
-          {/* Latest Notifications */}
-          <div className="p-4">
-            <div className="flex items-center justify-between mb-3">
-              <h3 className="text-sm font-semibold text-label-primary">
-                Latest Notifications ({latestCount})
-              </h3>
-              <button
-                onClick={() => {
-                  onMarkAllRead();
-                  onClose();
-                }}
-                className="text-sm font-medium text-label-action hover:text-actions-dark transition-colors"
-              >
-                Mark all as read
-              </button>
-            </div>
-            <div className="space-y-2">
-              {latestNotifications.map((notification) => renderNotificationItem(notification, false))}
-            </div>
-          </div>
-
-          {/* Previous Notifications */}
-          {previousNotifications.length > 0 && (
-            <div className="p-4 pt-0">
-              <h3 className="text-sm font-semibold text-label-primary mb-3">
-                Previous Notifications
-              </h3>
-              <div className="space-y-2">
-                {previousNotifications.map((notification) => renderNotificationItem(notification, true))}
-              </div>
-            </div>
-          )}
-        </ScrollArea>
-      </div>
-    </>
-  );
-};

package/src/v2/shadcn/_reference/OnlineUsersCard.tsx

@@ -1,73 +0,0 @@
-import React, { useState, useEffect } from 'react';
-import { supabase } from '@/integrations/supabase/client';
-import { useAuth } from '@/contexts/AuthContext';
-import { IconUser } from '../../icons';
-
-interface OnlineUsersCardProps {
-  className?: string;
-}
-
-const OnlineUsersCard: React.FC<OnlineUsersCardProps> = ({ className = '' }) => {
-  const { user } = useAuth();
-  const [onlineCount, setOnlineCount] = useState(0);
-
-  useEffect(() => {
-    if (!user) return;
-
-    const channel = supabase.channel('online-users', {
-      config: {
-        presence: {
-          key: user.id,
-        },
-      },
-    });
-
-    channel
-      .on('presence', { event: 'sync' }, () => {
-        const state = channel.presenceState();
-        const count = Object.keys(state).length;
-        setOnlineCount(count);
-      })
-      .on('presence', { event: 'join' }, () => {
-        const state = channel.presenceState();
-        const count = Object.keys(state).length;
-        setOnlineCount(count);
-      })
-      .on('presence', { event: 'leave' }, () => {
-        const state = channel.presenceState();
-        const count = Object.keys(state).length;
-        setOnlineCount(count);
-      })
-      .subscribe(async (status) => {
-        if (status === 'SUBSCRIBED') {
-          await channel.track({
-            user_id: user.id,
-            online_at: new Date().toISOString(),
-          });
-        }
-      });
-
-    return () => {
-      supabase.removeChannel(channel);
-    };
-  }, [user]);
-
-  return (
-    <div 
-      className={`bg-surface-primary rounded-xl p-4 border-2 animate-pulse-glow ${className}`}
-    >
-      <div className="flex flex-col gap-3">
-        <div className="w-12 h-12 rounded-lg bg-surface-secondary flex items-center justify-center">
-          <IconUser size={28} className="text-fill-secondary" />
-        </div>
-        
-        <div>
-          <p className="text-label-secondary text-[13px] font-medium">{onlineCount === 1 ? 'User' : 'Users'} Online</p>
-          <p className="text-label-primary text-3xl font-bold">{onlineCount}</p>
-        </div>
-      </div>
-    </div>
-  );
-};
-
-export default OnlineUsersCard;

package/src/v2/shadcn/_reference/ProtectedRoute.tsx

@@ -1,39 +0,0 @@
-import { useState, useEffect } from 'react';
-import { Navigate } from 'react-router-dom';
-import { useAuth } from '@/contexts/AuthContext';
-import LoadingScreen from './LoadingScreen';
-
-interface ProtectedRouteProps {
-  children: React.ReactNode;
-}
-
-const isLovableEditor = window.location.hostname.includes('lovableproject.com');
-const GRACE_PERIOD_MS = 2000;
-
-export const ProtectedRoute: React.FC<ProtectedRouteProps> = ({ children }) => {
-  const { user, isLoading } = useAuth();
-  const [graceExpired, setGraceExpired] = useState(!isLovableEditor);
-
-  useEffect(() => {
-    if (isLovableEditor && !user && !isLoading) {
-      const timer = setTimeout(() => setGraceExpired(true), GRACE_PERIOD_MS);
-      return () => clearTimeout(timer);
-    }
-    if (user) {
-      setGraceExpired(true);
-    }
-  }, [user, isLoading]);
-
-  console.log('ProtectedRoute - isLoading:', isLoading, 'user:', user, 'graceExpired:', graceExpired);
-
-  if (isLoading || (!user && !graceExpired)) {
-    return <LoadingScreen />;
-  }
-
-  if (!user) {
-    console.log('No user found, redirecting to /auth');
-    return <Navigate to="/auth" replace />;
-  }
-
-  return <>{children}</>;
-};

package/src/v2/shadcn/_reference/ProvidersTable.tsx

@@ -1,353 +0,0 @@
-import React, { useState, useEffect } from 'react';
-import { useNavigate } from 'react-router-dom';
-import { DataTable } from './tables/DataTable';
-import { TableControls } from './tables/TableControls';
-import { ColumnConfig, RowAction, SearchConfig, FilterConfig, HeaderAction } from './tables/types';
-import StatusBadge from './StatusBadge';
-import { supabase } from '@/integrations/supabase/client';
-import { format } from 'date-fns';
-import IconVenue from '@/assets/Icon_Venue.svg';
-import IconPromoter from '@/assets/Icon_Promoter.svg';
-import { IconPlusThick, IconArrowInternalReturn, IconDashboard } from '../../icons';
-import { ActionButton } from './TableActionMenu';
-import { useToast } from '../hooks/use-toast';
-import { clearProviderCache } from '@/contexts/ProviderContext';
-
-interface Provider {
-  id: string;
-  name: string;
-  type: 'venue' | 'promoter';
-  status: string;
-  created_at: string;
-  avatar_url?: string;
-  venue_id?: string;
-  company_id?: string;
-}
-
-interface ProvidersTableProps {
-  companyId?: string;
-}
-
-const ProvidersTable: React.FC<ProvidersTableProps> = ({ companyId }) => {
-  const [providers, setProviders] = useState<Provider[]>([]);
-  const navigate = useNavigate();
-  const { toast } = useToast();
-  const [searchQuery, setSearchQuery] = useState('');
-  const [activeFilter, setActiveFilter] = useState<'all' | 'venues' | 'promoters'>('all');
-  const [isLoading, setIsLoading] = useState(true);
-  const [sortKey, setSortKey] = useState<string>('name');
-  const [sortDirection, setSortDirection] = useState<'asc' | 'desc'>('asc');
-
-  useEffect(() => {
-    fetchProviders();
-  }, [companyId]);
-
-  const fetchProviders = async () => {
-    try {
-      setIsLoading(true);
-      let query = supabase.from('providers').select('*');
-      
-      if (companyId) {
-        query = query.eq('company_id', companyId);
-      }
-      
-      const { data, error } = await query;
-      
-      if (error) throw error;
-      setProviders(data || []);
-    } catch (error) {
-      console.error('Error fetching providers:', error);
-    } finally {
-      setIsLoading(false);
-    }
-  };
-
-  const handleSort = (key: string) => {
-    if (sortKey === key) {
-      setSortDirection(sortDirection === 'asc' ? 'desc' : 'asc');
-    } else {
-      setSortKey(key);
-      setSortDirection('asc');
-    }
-  };
-
-  const filteredProviders = providers.filter(provider => {
-    const matchesSearch = provider.name.toLowerCase().includes(searchQuery.toLowerCase()) ||
-                         provider.id.includes(searchQuery) ||
-                         (provider.venue_id && provider.venue_id.includes(searchQuery));
-    const matchesFilter = activeFilter === 'all' || 
-                         (activeFilter === 'venues' && provider.type === 'venue') ||
-                         (activeFilter === 'promoters' && provider.type === 'promoter');
-    return matchesSearch && matchesFilter;
-  });
-
-  const sortedProviders = [...filteredProviders].sort((a, b) => {
-    let aValue: any;
-    let bValue: any;
-
-    switch (sortKey) {
-      case 'name':
-        aValue = a.name.toLowerCase();
-        bValue = b.name.toLowerCase();
-        break;
-      case 'created':
-        aValue = new Date(a.created_at).getTime();
-        bValue = new Date(b.created_at).getTime();
-        break;
-      default:
-        return 0;
-    }
-
-    if (aValue < bValue) return sortDirection === 'asc' ? -1 : 1;
-    if (aValue > bValue) return sortDirection === 'asc' ? 1 : -1;
-    return 0;
-  });
-
-  const searchConfig: SearchConfig = {
-    placeholder: 'Search by provider name or ID',
-    value: searchQuery,
-    onChange: setSearchQuery,
-    label: 'Search Providers'
-  };
-
-  const filters: FilterConfig[] = [
-    {
-      label: 'Venues',
-      value: 'venues',
-      isActive: activeFilter === 'venues',
-      onClick: () => setActiveFilter(activeFilter === 'venues' ? 'all' : 'venues')
-    },
-    {
-      label: 'Promoters',
-      value: 'promoters',
-      isActive: activeFilter === 'promoters',
-      onClick: () => setActiveFilter(activeFilter === 'promoters' ? 'all' : 'promoters')
-    }
-  ];
-
-  const actions: HeaderAction[] = [
-    {
-      label: 'Add New Provider',
-      mobileLabel: 'Add',
-      icon: <IconPlusThick className="fill-current" />,
-      variant: 'ghost',
-      withIcon: true,
-      onClick: () => {
-        if (companyId) {
-          navigate(`/company/${companyId}/providers/add`);
-        } else {
-          navigate('/admin/providers/add');
-        }
-      }
-    }
-  ];
-
-  const getFirstLetter = (name: string) => {
-    return name[0]?.toUpperCase() || 'P';
-  };
-
-  const getProviderIcon = (provider: Provider) => {
-    // If provider has an avatar, show it
-    if (provider.avatar_url) {
-      return (
-        <div className="flex w-10 h-10 justify-center items-center rounded-full overflow-hidden bg-surface-tertiary flex-shrink-0">
-          <img 
-            src={provider.avatar_url} 
-            alt={provider.name}
-            className="w-full h-full object-cover"
-          />
-        </div>
-      );
-    }
-    
-    // Otherwise show the first letter
-    return (
-      <div className="flex w-10 h-10 justify-center items-center rounded-full bg-surface-tertiary flex-shrink-0">
-        <span className="text-label-secondary text-sm font-semibold">
-          {getFirstLetter(provider.name)}
-        </span>
-      </div>
-    );
-  };
-
-  const columns: ColumnConfig<Provider>[] = [
-    {
-      label: 'Provider & ID',
-      sortKey: 'name',
-      sortable: true,
-      render: (provider) => (
-        <div className="flex items-center gap-3 flex-1">
-          {getProviderIcon(provider)}
-          <div className="flex flex-col gap-0.5 flex-1 min-w-0">
-            <h3 className="text-label-primary text-sm font-semibold leading-4 truncate">
-              {provider.name}
-            </h3>
-            <p className="text-label-secondary text-xs font-normal leading-4">
-              {provider.type === 'venue' ? 'Venue' : 'Promoter'} ID: {provider.venue_id || 'N/A'}
-            </p>
-          </div>
-        </div>
-      )
-    },
-    {
-      label: 'Created',
-      sortKey: 'created',
-      sortable: true,
-      render: (provider: Provider) => (
-        <span className="text-text-secondary">{format(new Date(provider.created_at), 'dd.MM.yyyy')}</span>
-      ),
-      width: 'w-[140px]'
-    },
-    {
-      label: 'Status',
-      render: (provider) => <StatusBadge status={provider.status as 'active' | 'disabled' | 'invited' | 'suspended'} />,
-      width: 'w-[100px]',
-      className: 'flex justify-end'
-    }
-  ];
-
-  const handleDisableProvider = async (provider: Provider) => {
-    try {
-      const newStatus = provider.status === 'active' ? 'disabled' : 'active';
-      
-      const { error } = await supabase
-        .from('providers')
-        .update({ status: newStatus })
-        .eq('id', provider.id);
-      
-      if (error) throw error;
-      
-      // Clear the provider cache so navigating to this provider shows fresh status
-      clearProviderCache();
-      
-      // Refresh the providers list
-      fetchProviders();
-    } catch (error) {
-      console.error('Error updating provider status:', error);
-    }
-  };
-
-  const handleDuplicateProvider = (provider: Provider) => {
-    if (companyId) {
-      navigate(`/company/${companyId}/providers/${provider.id}/clone`);
-    } else {
-      navigate(`/admin/providers/${provider.id}/clone`);
-    }
-  };
-
-  const rowActions = (provider: Provider): RowAction<Provider>[] => [
-    {
-      label: 'Go to Dashboard',
-      onClick: () => {
-        if (!provider.venue_id) {
-          console.error('Provider missing venue_id:', provider);
-          return;
-        }
-        const providerType = provider.type === 'venue' ? 'venue' : 'promoter';
-        navigate(`/${providerType}/${provider.venue_id}/home`);
-      }
-    },
-    {
-      label: `${provider.type === 'venue' ? 'Venue' : 'Promoter'} Details`,
-      onClick: () => navigate(`/admin/providers/${provider.id}`)
-    },
-    {
-      label: `Edit ${provider.type === 'venue' ? 'Venue' : 'Promoter'}`,
-      onClick: () => console.log('Edit provider', provider.id)
-    },
-    {
-      label: `Duplicate ${provider.type === 'venue' ? 'Venue' : 'Promoter'}`,
-      onClick: () => handleDuplicateProvider(provider)
-    },
-    {
-      label: provider.status === 'active' 
-        ? `Disable ${provider.type === 'venue' ? 'Venue' : 'Promoter'}` 
-        : `Enable ${provider.type === 'venue' ? 'Venue' : 'Promoter'}`,
-      onClick: () => handleDisableProvider(provider)
-    },
-  ];
-
-  return (
-    <div className="flex flex-col gap-6 w-full">
-      <TableControls
-        searchConfig={searchConfig}
-        filters={filters}
-        actions={actions}
-      />
-
-      {/* Mobile card layout */}
-      <div className="flex flex-col gap-3 sm:hidden">
-        {sortedProviders.length === 0 ? (
-          <div className="flex items-center justify-center py-12">
-            <span className="text-label-secondary text-sm">No providers found</span>
-          </div>
-        ) : (
-          sortedProviders.map((provider) => (
-            <button
-              key={provider.id}
-              onClick={() => navigate(`/admin/providers/${provider.id}`)}
-              className="flex items-center gap-3 p-4 bg-surface-primary border border-border-primary rounded-lg w-full text-left"
-            >
-              {getProviderIcon(provider)}
-              <div className="flex flex-col gap-1 flex-1 min-w-0">
-                <div className="flex items-center justify-between gap-2">
-                  <h3 className="text-label-primary text-sm font-semibold leading-4 truncate">
-                    {provider.name}
-                  </h3>
-                  <StatusBadge status={provider.status as 'active' | 'disabled' | 'invited' | 'suspended'} />
-                </div>
-                <div className="flex items-center gap-2">
-                  <span className="text-label-secondary text-xs">
-                    {provider.type === 'venue' ? 'Venue' : 'Promoter'} ID: {provider.venue_id || 'N/A'}
-                  </span>
-                  <span className="text-label-tertiary text-xs">·</span>
-                  <span className="text-label-tertiary text-xs">
-                    {format(new Date(provider.created_at), 'dd MMM yyyy')}
-                  </span>
-                </div>
-              </div>
-            </button>
-          ))
-        )}
-      </div>
-      
-      {/* Desktop table layout */}
-      <div className="hidden sm:block">
-        <DataTable
-          data={sortedProviders}
-          columns={columns}
-          keyExtractor={(provider) => provider.id}
-          rowActions={rowActions}
-          rowQuickActions={(provider) => (
-            <ActionButton
-              icon={
-                <div className="relative w-[18px] h-[18px]">
-                  <IconDashboard size={18} className="absolute inset-0 group-hover/dashboard-action:opacity-0 transition-opacity" />
-                  <IconArrowInternalReturn size={18} className="absolute inset-0 opacity-0 group-hover/dashboard-action:opacity-100 transition-opacity" />
-                </div>
-              }
-              className="group/dashboard-action"
-              onClick={() => {
-                if (!provider.venue_id) return;
-                const providerType = provider.type === 'venue' ? 'venue' : 'promoter';
-                navigate(`/${providerType}/${provider.venue_id}/home`);
-              }}
-            />
-          )}
-          onRowClick={(provider) => {
-            navigate(`/admin/providers/${provider.id}`);
-          }}
-          sortKey={sortKey}
-          sortDirection={sortDirection}
-          onSort={handleSort}
-          pagination={{
-            entityName: 'venues'
-          }}
-          emptyState="No providers found"
-        />
-      </div>
-    </div>
-  );
-};
-
-export default ProvidersTable;