diff --git a/src/pages/Dashboard/UptimeChart/UptimeChart.tsx b/src/pages/Dashboard/UptimeChart/UptimeChart.tsx
index c38b91ad..92f6ebf7 100644
--- a/src/pages/Dashboard/UptimeChart/UptimeChart.tsx
+++ b/src/pages/Dashboard/UptimeChart/UptimeChart.tsx
@@ -1,44 +1,6 @@
 
 import { BarChart, Bar, XAxis, YAxis, CartesianGrid, Tooltip, Legend, ResponsiveContainer } from 'recharts';
 // @NOTE: XAxis for months or days
-const data: DataItem[] = [
-    {
-        // @NOTE: if you want to add name in the XAxis. You need to set the names here
-        // name: 'Jan',
-        pv: 1,
-        pa: 1,
-    },
-    {
-        // name: 'Feb',
-        pv: 0,
-        pa: 0
-    },
-    {
-        //name: 'Feb',
-        pv: 1,
-        pa: 0
-    },
-    {
-        //name: 'Feb',
-        pv: 0,
-        pa: 0
-    },
-    {
-        //name: 'Feb',
-        pv: 0,
-        pa: 0
-    },
-    {
-        //name: 'Feb',
-        pv: 1,
-        pa: 1
-    },
-    {
-        //name: 'Feb',
-        pv: 1,
-        pa: 1
-    },
-];
 
 interface DataItem {
     name?: string;
@@ -46,7 +8,11 @@ interface DataItem {
     pv: number;
 }
 
-const UptimeChart = () => {
+type UptimeChartProps = {
+    data: DataItem[];
+}
+
+const UptimeChart = ({ data }: UptimeChartProps) => {
     return (
         <ResponsiveContainer  >
             <BarChart