first commit

frontend/app/main/overview/dashboard/page.tsx

@@ -0,0 +1,54 @@
+"use client";
+import { DashBoardWidgetsPage } from "./components/Widgets";
+import ProjectsByStatusChartPage from "./components/ProjectsbyStatusChart/page";
+import { ChevronRight } from "lucide-react";
+import { Button } from "ikoncomponents";
+import CurrentMonthMilestones from "./components/milestone/page";
+import ProjectTimelineChart from "./components/activeProjectTimeLine";
+import { useRouter } from "next/dist/client/components/navigation";
+
+function DashboardPage() {
+   const router = useRouter();
+
+  const handleRedirect = () => {
+    router.push("/main/planning/projects");
+  };
+  return (
+    <div className="h-full mt-2 space-y-4 overflow-y-auto">
+      {/* Header */}
+      <div className="flex justify-between items-start">
+        <div>
+          <h1 className="text-2xl font-bold">Dashboard</h1>
+          <p className="text-gray-500 text-sm">
+            Consolidated project portfolio overview
+          </p>
+        </div>
+        <Button
+          size="sm"
+          variant={"secondary"}
+          className="flex items-center gap-2 px-3 py-1.5 rounded-md text-xs"
+          onClick={handleRedirect}
+        >
+          View All Projects <ChevronRight size={14} />
+        </Button>
+      </div>
+
+      {/* Widgets Row */}
+      <DashBoardWidgetsPage />
+
+      {/* Main Content Grid */}
+      <div className="grid gap-4 lg:grid-cols-2">
+        <div className="h-full">
+          <CurrentMonthMilestones />
+        </div>
+
+        <div className="h-full">
+          <ProjectsByStatusChartPage />
+        </div>
+      </div>
+      <ProjectTimelineChart />
+    </div>
+  );
+}
+
+export default DashboardPage;