import React from "react";

export default function AuthView({
  isRegister,
  auth,
  setAuth,
  error,
  onSubmit,
  onToggleRegister
}) {
  return (
    <div className="auth-wrap auth-gradient-bg">
      <form className="card auth-card modern-auth" onSubmit={onSubmit}>
        <h1>{isRegister ? "Register" : "Login"}</h1>
        <p>Beauty Warehouse CIMS</p>
        <input
          placeholder="Username"
          value={auth.username}
          onChange={(e) => setAuth({ ...auth, username: e.target.value })}
          required
        />
        <input
          type="password"
          placeholder="Password"
          value={auth.password}
          onChange={(e) => setAuth({ ...auth, password: e.target.value })}
          required
        />
        {error && <div className="error">{error}</div>}
        <button className="auth-primary-btn" type="submit">
          {isRegister ? "Create Account" : "Login"}
        </button>
        <button
          type="button"
          className="auth-secondary-btn"
          onClick={onToggleRegister}
        >
          {isRegister ? "Already have an account? Login" : "No account? Register"}
        </button>
      </form>
    </div>
  );
}

