import { useEffect, useState } from "react";
import { useNavigate } from "react-router-dom";
import toast from "react-hot-toast";

// Assignment 6 — Profile route (REFERENCE / FINISHED).
// This file is provided complete. Use it to see how a session-aware
// page reads the saved user out of localStorage and how Logout cleans up.
// You only need to register the /profile route in src/App.jsx.
function Profile() {
  const [user, setUser] = useState(null);
  const navigate = useNavigate();

  useEffect(() => {
    const raw = localStorage.getItem("User");
    if (!raw) {
      navigate("/login");
      return;
    }
    setUser(JSON.parse(raw));
  }, [navigate]);

  const handleLogout = () => {
    localStorage.removeItem("User");
    toast.success("Logged out successfully.");
    navigate("/");
  };

  if (!user) return null;

  return (
    <main className="Profile">
      <h2>Profile</h2>
      <p>
        <strong>Username:</strong> {user.username}
      </p>
      <p>
        <strong>Email:</strong> {user.email}
      </p>
      <button type="button" onClick={handleLogout}>
        Logout
      </button>
    </main>
  );
}

export default Profile;