Dashboard/components/dashboard/dashboard-users-list.tsx

"use client";

import { useState, useEffect, useCallback } from "react";
import { Card, CardContent, CardHeader, CardTitle } from "@/components/ui/card";
import { Badge } from "@/components/ui/badge";
import { Button } from "@/components/ui/button";
import { Users } from "lucide-react";
import Link from "next/link";
import { useCollection } from "@/hooks/useCollection";
import {
  LibreChatUser,
  LibreChatConversation,
  LibreChatTransaction,
  LibreChatBalance,
  LibreChatMessage,
} from "@/lib/types";

interface DashboardUser {
  userId: string;
  userName: string;
  conversations: number;
  tokens: number;
  credits: number;
}

// Fonction utilitaire pour valider et convertir les dates
const isValidDate = (value: unknown): value is string | number | Date => {
  if (!value) return false;
  if (value instanceof Date) return !isNaN(value.getTime());
  if (typeof value === 'string' || typeof value === 'number') {
    const date = new Date(value);
    return !isNaN(date.getTime());
  }
  return false;
};

export function DashboardUsersList() {
  const [topUsers, setTopUsers] = useState<DashboardUser[]>([]);
  const [isLoading, setIsLoading] = useState(true);

  // Récupérer toutes les données nécessaires
  const { data: users, loading: usersLoading } = useCollection<LibreChatUser>("users");
  const { data: conversations, loading: conversationsLoading } = useCollection<LibreChatConversation>("conversations");
  const { data: transactions, loading: transactionsLoading } = useCollection<LibreChatTransaction>("transactions");
  const { data: balances, loading: balancesLoading } = useCollection<LibreChatBalance>("balances");
  const { data: messages, loading: messagesLoading } = useCollection<LibreChatMessage>("messages");
  const { data: tokens, loading: tokensLoading } = useCollection("tokens");
  const { data: toolcalls, loading: toolcallsLoading } = useCollection("toolcalls");

  const processUsers = useCallback(() => {
    if (!users?.length || !conversations?.length || !balances?.length || !messages?.length) {
      return;
    }

    console.log("🔄 Processing users data...");
    console.log("Users:", users.length);
    console.log("Conversations:", conversations.length);
    console.log("Transactions:", transactions?.length || 0);
    console.log("Balances:", balances.length);
    console.log("Messages:", messages.length);
    console.log("Tokens collection:", tokens?.length || 0);
    console.log("Toolcalls collection:", toolcalls?.length || 0);

    const processedUsers: DashboardUser[] = [];

    users.forEach((user: LibreChatUser) => {
      // Obtenir les conversations de l'utilisateur
      const userConversations = conversations.filter(
        (conv: LibreChatConversation) => conv.user === user._id
      );

      // Obtenir les messages de l'utilisateur
      const userMessages = messages.filter(
        (msg: LibreChatMessage) => msg.user === user._id
      );

      // Calculer les tokens depuis les messages
      const totalTokensFromMessages = userMessages.reduce(
        (sum: number, msg: LibreChatMessage) => sum + (msg.tokenCount || 0),
        0
      );

      // Calculer les tokens depuis les conversations de l'utilisateur
      const userConversationIds = userConversations.map(conv => conv.conversationId);
      const conversationMessages = messages.filter(
        (msg: LibreChatMessage) => userConversationIds.includes(msg.conversationId)
      );
      
      const totalTokensFromConversations = conversationMessages.reduce(
        (sum: number, msg: LibreChatMessage) => sum + (msg.tokenCount || 0),
        0
      );

      // Vérifier les collections tokens et toolcalls
      let tokensFromTokensCollection = 0;
      let tokensFromToolcalls = 0;

      if (tokens?.length) {
        const userTokens = tokens.filter((token: any) => token.user === user._id || token.userId === user._id);
        tokensFromTokensCollection = userTokens.reduce((sum: number, token: any) => {
          return sum + (token.amount || token.tokens || token.count || 0);
        }, 0);
      }

      if (toolcalls?.length) {
        const userToolcalls = toolcalls.filter((toolcall: any) => toolcall.user === user._id || toolcall.userId === user._id);
        tokensFromToolcalls = userToolcalls.reduce((sum: number, toolcall: any) => {
          return sum + (toolcall.tokens || toolcall.tokenCount || 0);
        }, 0);
      }

      // Obtenir les balances de l'utilisateur
      const userBalances = balances.filter(
        (balance: LibreChatBalance) => balance.user === user._id
      );

      // Trier par date de mise à jour (plus récent en premier)
      const sortedBalances = userBalances.sort((a, b) => {
        const dateA = a.updatedAt || a.createdAt;
        const dateB = b.updatedAt || b.createdAt;
        
        // Vérifier que les dates sont valides avant de les comparer
        if (isValidDate(dateA) && isValidDate(dateB)) {
          return new Date(dateB as string | number | Date).getTime() - new Date(dateA as string | number | Date).getTime();
        }
        
        // Si seulement une date existe et est valide, la privilégier
        if (isValidDate(dateA) && !isValidDate(dateB)) return -1;
        if (!isValidDate(dateA) && isValidDate(dateB)) return 1;
        
        // Si aucune date n'existe ou n'est valide, garder l'ordre actuel
        return 0;
      });

      // Prendre la balance la plus récente
      const latestBalance = sortedBalances[0];
      const credits = latestBalance ? latestBalance.tokenCredits || 0 : 0;

      // Calculer les tokens consommés depuis les crédits
      const INITIAL_CREDITS = 5000000;
      const creditsUsed = INITIAL_CREDITS - credits;
      const tokensFromCredits = creditsUsed > 0 ? creditsUsed : 0;

      // Prendre la valeur la plus élevée (plus précise)
      const totalTokens = Math.max(
        totalTokensFromMessages,
        totalTokensFromConversations,
        tokensFromTokensCollection,
        tokensFromToolcalls,
        tokensFromCredits
      );

      // Log de débogage très détaillé
      console.log(`👤 User ${user.name || user.email}:`, {
        conversations: userConversations.length,
        userMessages: userMessages.length,
        conversationMessages: conversationMessages.length,
        tokensFromMessages: totalTokensFromMessages,
        tokensFromConversations: totalTokensFromConversations,
        tokensFromTokensCollection: tokensFromTokensCollection,
        tokensFromToolcalls: tokensFromToolcalls,
        currentCredits: credits,
        creditsUsed: creditsUsed,
        tokensFromCredits: tokensFromCredits,
        finalTokens: totalTokens,
        messagesSample: userMessages.slice(0, 2).map(m => ({ 
          tokenCount: m.tokenCount, 
          model: m.model,
          isCreatedByUser: m.isCreatedByUser,
          conversationId: m.conversationId
        })),
        conversationsSample: userConversations.slice(0, 2).map(c => ({
          conversationId: c.conversationId,
          messagesCount: c.messages?.length || 0
        }))
      });

      // Ajouter l'utilisateur seulement s'il a des données significatives
      if (userConversations.length > 0 || totalTokens > 0 || credits > 0) {
        processedUsers.push({
          userId: user._id,
          userName: user.name || user.username || user.email || 'Utilisateur inconnu',
          conversations: userConversations.length,
          tokens: totalTokens,
          credits: credits,
        });
      }
    });

    // Trier par tokens consommés (décroissant) et prendre les 5 premiers
    const sortedUsers = processedUsers
      .sort((a, b) => b.tokens - a.tokens)
      .slice(0, 5);

    console.log("✅ Top 5 users processed:", sortedUsers);
    setTopUsers(sortedUsers);
    setIsLoading(false);
  }, [users, conversations, transactions, balances, messages, tokens, toolcalls]);

  useEffect(() => {
    const allDataLoaded = !usersLoading && !conversationsLoading && !balancesLoading && !messagesLoading && !tokensLoading && !toolcallsLoading;
    
    if (allDataLoaded) {
      processUsers();
    } else {
      setIsLoading(true);
    }
  }, [usersLoading, conversationsLoading, balancesLoading, messagesLoading, tokensLoading, toolcallsLoading, processUsers]);

  if (isLoading) {
    return (
      <Card>
        <CardHeader className="flex flex-row items-center justify-between">
          <CardTitle className="flex items-center gap-2">
            <Users className="h-5 w-5" />
            Top 5 utilisateurs
          </CardTitle>
          <Button variant="outline" size="sm" disabled>
            Chargement...
          </Button>
        </CardHeader>
        <CardContent>
          <div className="space-y-3">
            {[...Array(5)].map((_, i) => (
              <div key={i} className="flex items-center justify-between p-3 border rounded-lg">
                <div className="flex items-center space-x-3">
                  <div className="w-8 h-8 bg-gray-200 rounded-full animate-pulse"></div>
                  <div>
                    <div className="h-4 bg-gray-200 rounded w-24 animate-pulse"></div>
                    <div className="h-3 bg-gray-200 rounded w-16 mt-1 animate-pulse"></div>
                  </div>
                </div>
                <div className="text-right">
                  <div className="h-4 bg-gray-200 rounded w-16 animate-pulse"></div>
                  <div className="h-3 bg-gray-200 rounded w-12 mt-1 animate-pulse"></div>
                </div>
              </div>
            ))}
          </div>
        </CardContent>
      </Card>
    );
  }

  if (topUsers.length === 0) {
    return (
      <Card>
        <CardHeader className="flex flex-row items-center justify-between">
          <CardTitle className="flex items-center gap-2">
            <Users className="h-5 w-5" />
            Top 5 utilisateurs
          </CardTitle>
            <Link href="/users">
            <Button variant="outline" size="sm">
              Voir tous
            </Button>
          </Link>
        </CardHeader>
        <CardContent>
          <div className="text-center py-8 text-muted-foreground">
            Aucun utilisateur trouvé
          </div>
        </CardContent>
      </Card>
    );
  }

  return (
    <Card>
      <CardHeader className="flex flex-row items-center justify-between">
        <CardTitle className="flex items-center gap-2">
          <Users className="h-5 w-5" />
          Top 5 utilisateurs
        </CardTitle>
        <Link href="/users">
          <Button variant="outline" size="sm">
            Voir tous
          </Button>
        </Link>
      </CardHeader>
      <CardContent>
        <div className="space-y-3">
          {topUsers.map((user, index) => (
            <div
              key={user.userId}
              className="flex items-center justify-between p-3 border rounded-lg hover:bg-gray-50 transition-colors"
            >
              <div className="flex items-center space-x-3">
                <Badge variant="secondary" className="w-6 h-6 rounded-full p-0 flex items-center justify-center text-xs">
                  {index + 1}
                </Badge>
                <div>
                  <p className="font-medium text-sm">{user.userName}</p>
                  <p className="text-xs text-muted-foreground">
                    {user.conversations} conversation{user.conversations !== 1 ? 's' : ''}
                  </p>
                </div>
              </div>
              <div className="text-right">
                <p className="font-medium text-sm">
                  {user.tokens.toLocaleString()} tokens
                </p>
                <p className="text-xs text-muted-foreground">
                  {user.credits.toLocaleString()} crédits
                </p>
              </div>
            </div>
          ))}
        </div>
      </CardContent>
    </Card>
  );
}