import { Tabs, TabsContent, TabsList, TabsTrigger } from '@/components/ui/tabs';
import { Card, CardContent, CardDescription, CardHeader, CardTitle } from '@/components/ui/card';
import { ProfileManager } from '@/components/moderation/ProfileManager';
import { UserRoleManager } from '@/components/moderation/UserRoleManager';
import { Users, Shield, UserCheck, UserX } from 'lucide-react';
export function UserManagement() {
  return <div className="space-y-6">
      
      
      <Tabs defaultValue="profiles" className="space-y-4">
        <TabsList className="grid w-full grid-cols-2">
          <TabsTrigger value="profiles" className="flex items-center gap-2">
            <UserCheck className="w-4 h-4" />
            Profile Management
          </TabsTrigger>
          <TabsTrigger value="roles" className="flex items-center gap-2">
            <Shield className="w-4 h-4" />
            Role Management
          </TabsTrigger>
        </TabsList>

        <TabsContent value="profiles">
          <Card>
            <CardHeader>
              <CardTitle>Profile Management</CardTitle>
              <CardDescription>
                Manage user profiles, ban users, and handle account moderation
              </CardDescription>
            </CardHeader>
            <CardContent>
              <ProfileManager />
            </CardContent>
          </Card>
        </TabsContent>

        <TabsContent value="roles">
          <Card>
            <CardHeader>
              <CardTitle>Role Management</CardTitle>
              <CardDescription>
                Assign and manage user roles and permissions
              </CardDescription>
            </CardHeader>
            <CardContent>
              <UserRoleManager />
            </CardContent>
          </Card>
        </TabsContent>
      </Tabs>
    </div>;
}