import React, { useState, useEffect } from 'react';
import { ethers } from 'ethers';

const VotingSession = ({ 
  isVoter, 
  submitVote, 
  delegateVote,
  fetchVoterInfo,
  fetchProposals,
  currentStatus, 
  proposals,
  loading,
  voterInfo
}) => {
  const [selectedProposal, setSelectedProposal] = useState(null);
  const [delegateAddress, setDelegateAddress] = useState('');
  const [error, setError] = useState('');
  const [delegateError, setDelegateError] = useState('');

  useEffect(() => {
    if (isVoter && parseInt(currentStatus) >= 3) {
      fetchVoterInfo();
      fetchProposals();
    }
  }, [isVoter, currentStatus, fetchVoterInfo, fetchProposals]);

  const handleVote = () => {
    if (selectedProposal === null) {
      setError('Veuillez sélectionner une proposition');
      return;
    }
    
    setError('');
    submitVote(selectedProposal);
  };

  const handleDelegateVote = () => {
    if (!ethers.utils.isAddress(delegateAddress)) {
      setDelegateError('Adresse Ethereum invalide');
      return;
    }
    
    setDelegateError('');
    delegateVote(delegateAddress);
    setDelegateAddress('');
  };

  // Si l'utilisateur n'est pas un électeur ou si on n'est pas à la phase de vote
  if (!isVoter || parseInt(currentStatus) < 3) {
    return null;
  }

  // Si les votes sont comptabilisés et qu'il y a au moins une proposition
  if (parseInt(currentStatus) === 5 && proposals.length > 0) {
    // Trouver la proposition gagnante
    let winningProposalId = 0;
    let maxVotes = 0;
    
    proposals.forEach((proposal, index) => {
      if (parseInt(proposal.voteCount) > maxVotes) {
        maxVotes = parseInt(proposal.voteCount);
        winningProposalId = index;
      }
    });
    
    const winningProposal = proposals[winningProposalId];
    
    return (
      <div className="card">
        <h2>Résultat du vote</h2>
        <div className="winner-info">
          <h3>Proposition gagnante :</h3>
          <div className="proposal-item winner">
            <strong>Proposition #{winningProposalId}:</strong> {winningProposal.description}
            <div className="vote-count">
              <span>{winningProposal.voteCount} vote(s)</span>
            </div>
          </div>
        </div>
      </div>
    );
  }

  return (
    <div className="card">
      <h2>Session de vote</h2>
      
      {parseInt(currentStatus) === 3 && (
        <>
          {!voterInfo.hasVoted ? (
            <div className="voter-actions">
              <h3>Voter pour une proposition</h3>
              
              <ul className="proposal-list">
                {proposals.slice(1).map((proposal, index) => (
                  <li 
                    key={index + 1} 
                    className={`proposal-item ${selectedProposal === index + 1 ? 'selected' : ''}`}
                    onClick={() => setSelectedProposal(index + 1)}
                  >
                    <strong>Proposition #{index + 1}:</strong> {proposal.description}
                  </li>
                ))}
              </ul>
              
              {error && <p className="status error">{error}</p>}
              
              <div className="voting-buttons">
                <button
                  className="button"
                  onClick={handleVote}
                  disabled={loading || selectedProposal === null}
                >
                  {loading ? "Transaction en cours..." : "Voter"}
                </button>
                
                <div className="delegation-section">
                  <h4>Ou déléguer votre vote</h4>
                  <input
                    type="text"
                    className="input"
                    placeholder="Adresse Ethereum du délégué (0x...)"
                    value={delegateAddress}
                    onChange={(e) => setDelegateAddress(e.target.value)}
                  />
                  {delegateError && <p className="status error">{delegateError}</p>}
                  <button
                    className="button secondary"
                    onClick={handleDelegateVote}
                    disabled={loading || !delegateAddress}
                  >
                    {loading ? "Transaction en cours..." : "Déléguer le vote"}
                  </button>
                </div>
              </div>
            </div>
          ) : (
            <div className="already-voted">
              <p className="status success">Vous avez déjà voté pour la proposition #{voterInfo.votedProposalId}.</p>
            </div>
          )}
        </>
      )}
      
      {parseInt(currentStatus) === 4 && (
        <div className="waiting-results">
          <p>La session de vote est terminée. En attente du comptage des votes...</p>
        </div>
      )}
    </div>
  );
};

export default VotingSession;