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

const VoterManagement = ({ isOwner, addVoter, loading, isVoter, currentStatus }) => {
  const [voterAddress, setVoterAddress] = useState('');
  const [error, setError] = useState('');

  const handleAddVoter = () => {
    if (!ethers.utils.isAddress(voterAddress)) {
      setError('Adresse Ethereum invalide');
      return;
    }
    
    setError('');
    addVoter(voterAddress);
    setVoterAddress('');
  };

  // Si ce n'est pas la phase d'enregistrement des électeurs, on n'affiche pas ce composant
  if (parseInt(currentStatus) !== 0 && !isVoter) {
    return null;
  }

  return (
    <div className="card">
      <h2>Gestion des électeurs</h2>
      
      {isOwner && parseInt(currentStatus) === 0 ? (
        <div className="admin-actions">
          <h3>Ajouter un électeur</h3>
          <input
            type="text"
            className="input"
            placeholder="Adresse Ethereum (0x...)"
            value={voterAddress}
            onChange={(e) => setVoterAddress(e.target.value)}
          />
          {error && <p className="status error">{error}</p>}
          <button
            className="button"
            onClick={handleAddVoter}
            disabled={loading || !voterAddress}
          >
            {loading ? "Transaction en cours..." : "Ajouter l'électeur"}
          </button>
        </div>
      ) : (
        <div className="voter-info">
          {isVoter ? (
            <p className="status success">Vous êtes enregistré comme électeur.</p>
          ) : (
            <p className="status warning">Vous n'êtes pas enregistré comme électeur.</p>
          )}
        </div>
      )}
    </div>
  );
};

export default VoterManagement;