import React, { useState } from "react";
import Modal from "./Modal";
import "../../Style/LoginModal.css";

const LoginModal = ({ onLogin, onClose }) => {
  const [username, setUsername] = useState("");
  const [password, setPassword] = useState("");
  const [error, setError] = useState("");

  const handleSubmit = (e) => {
    e.preventDefault();
    if (username === "admin" && password === "admin") {
      onLogin(); // Успешная авторизация
      onClose(); // Закрыть модальное окно
    } else {
      setError("Неверный логин или пароль");
    }
  };

  return (
    <Modal onClose={onClose}>
      <h2>Авторизация</h2>
      <form onSubmit={handleSubmit}>
        <div>
          <label>Логин:</label>
          <input
            type="text"
            value={username}
            onChange={(e) => setUsername(e.target.value)}
            required
          />
        </div>
        <div>
          <label>Пароль:</label>
          <input
            type="password"
            value={password}
            onChange={(e) => setPassword(e.target.value)}
            required
          />
        </div>
        {error && <p className="error">{error}</p>}
        <button type="submit">Войти</button>
      </form>
    </Modal>
  );
};

export default LoginModal;