project list

src/pages/taskmanager/project/List.tsx

@@ -0,0 +1,31 @@
+import { useState } from "react";
+import projectsData from "./data/projects.json";
+import ProjectGrid from "./components/ProjectGrid";
+import ProjectListHeader from "./components/ProjectListHeader";
+import WorkspaceInfoBanner from "./components/WorkspaceInfoBanner";
+import type { ProjectItem, WorkspaceInfo } from "./types/ProjectTypes";
+
+const List = () => {
+  const { workspace, projects: initialProjects } = projectsData as {
+    workspace: WorkspaceInfo;
+    projects: ProjectItem[];
+  };
+
+  const [projects, setProjects] = useState<ProjectItem[]>(initialProjects);
+
+  const handleDelete = (id: string) => {
+    setProjects((prev) => prev.filter((project) => project.id !== id));
+  };
+
+  return (
+    <div className="w-full mt-4">
+      <ProjectListHeader title={workspace.name} />
+
+      <WorkspaceInfoBanner description={workspace.description} />
+
+      <ProjectGrid projects={projects} onDelete={handleDelete} />
+    </div>
+  );
+};
+
+export default List;