diff --git a/src/components/dashboard/TaskStats.jsx b/src/components/dashboard/TaskStats.jsx
index 65ac6ac07ec9079f218920013fa8633289da17c9..92a8331c368ea164e871dc3c5aea9b62200b60f9 100644
--- a/src/components/dashboard/TaskStats.jsx
+++ b/src/components/dashboard/TaskStats.jsx
@@ -1,12 +1,18 @@
-import React from "react";
+import React, { useContext } from "react";
 import TaskCard from "@components/dashboard/TaskCard";
+import { TasksContext } from "@services/Context";
+
+const TaskStats = () => {
+  const { tasks } = useContext(TasksContext);
+
+  const completed = tasks.filter(task => task.isCompleted).length;
+  const incompleted = tasks.filter(task => !task.isCompleted).length;
+  const total = tasks.length;
 
-const TaskStats = ({ completed, incompleted, canceled, total }) => {
   return (
     <div className="grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-4 gap-4">
       <TaskCard title="Completed Tasks" count={completed} />
       <TaskCard title="Incompleted Tasks" count={incompleted} />
-      <TaskCard title="Overdue Tasks" count={canceled} />
       <TaskCard title="Total Tasks" count={total} />
     </div>
   );
diff --git a/src/pages/Home.jsx b/src/pages/Home.jsx
index 2304b5784775af84b2d5e0fd13abe40046567cd0..a879a324a5a76a4e07f76977d6057e20d4129cfd 100644
--- a/src/pages/Home.jsx
+++ b/src/pages/Home.jsx
@@ -8,7 +8,7 @@ const Home = () => {
   return (
       <div>
           <div className="p-6 bg-gray">
-              <TaskStats completed={100} incompleted={18} canceled={4} total={118} />
+              <TaskStats />
           </div>
           <div className="min-h-screen bg-gray-100 p-8">
               <div className="grid grid-cols-2 gap-6">