import BasicWindow from "../Components/BasicWindow";
import { ProjectListUser } from "../Components/ProjectListUser";
import { Project } from "../Types/Project";

function YourProjectsPage(): JSX.Element {
  //TODO: Change so that it reads projects from database
  const projects: Project[] = [];
  for (let i = 1; i <= 20; i++) {
    projects.push({
      id: i,
      name: "Example Project " + i,
      description: "good",
      created: "now",
      owner: "me",
    });
  }

  const content = (
    <>
      <h1 className="font-bold text-[30px] mb-[20px]">Your Projects</h1>
      <div className="border-4 border-black bg-white flex flex-col items-center h-[65vh] w-[50vw] rounded-3xl content-center overflow-scroll space-y-[10vh] p-[30px]">
        <ProjectListUser projects={projects} />
      </div>
    </>
  );

  const buttons = <></>;

  return <BasicWindow username="Admin" content={content} buttons={buttons} />;
}
export default YourProjectsPage;
