// pages/admin.tsx

import { NextPage } from "next";
import { useRouter } from "next/router";
import { useSession } from "next-auth/react";
import { isAdmin } from "../utils/helpers/admin.ts";
// import FileUpload from "../components/uploadContent/index.jsx";
import { useEffect, useState } from "react";
import { UserSchema } from "../types/user.js";
// import FileUpload from "../../components/uploadContent/index.jsx";
import FileUpload from "../components/uploadContent";
// import { isAdmin } from "../utils/helpers/admin";

const AdminPage: NextPage = () => {
  const { data: user } = useSession();
  const router = useRouter();
  const [allowedUsers, setAllowedUsers] = useState<string[]>([]);
  const [emailInput, setEmailInput] = useState<string>(""); // Add this state variable

  useEffect(() => {
    if (!user || (user && !isAdmin(user.user?.email || ""))) {
      void router.push("/");
    }
  }, [user, router]);

  const addAllowedUser = (email: string) => {
    setAllowedUsers((prev) => [...prev, email]);
  };

  return (
    <div>
      <h1>Admin Page</h1>
      <div className="flex flex-col items-center justify-center py-2">
        <div className="flex w-full p-1">
          <FileUpload />
        </div>
        <div className="flex w-full p-1">
          <h2>Add Temp. Users</h2>
          {/* form input to add users  */}
          <form
            onSubmit={(e: React.FormEvent<HTMLFormElement>) => {
              e.preventDefault();
              addAllowedUser(emailInput);
              setEmailInput("");
            }}
          >
            <input
              type="email"
              name="userEmail"
              placeholder="Enter user email"
              value={emailInput} // Bind the input value to the state variable
              onChange={(e) => setEmailInput(e.target.value)} // Update the state variable when the input changes
            />
            {/* <input
              type="email"
              name="userEmail"
              placeholder="Enter user email"
            /> */}
            <button type="submit">Add allowed user</button>
          </form>
        </div>
      </div>
    </div>
  );
};

export default AdminPage;