1 files changed, 29 insertions, 10 deletions
diff --git a/panel/src/pages/Dashboard.jsx b/panel/src/pages/Dashboard.jsx
index 5aa2b0c..d16204d 100644
--- a/panel/src/pages/Dashboard.jsx
+++ b/panel/src/pages/Dashboard.jsx
@@ -1,5 +1,9 @@
-import React from 'react';
+import React, { useEffect, useRef } from 'react';
+import { Chart, CategoryScale, LinearScale, BarElement, Title, Tooltip, Legend } from 'chart.js';
 import { Bar } from 'react-chartjs-2';
+import Navbar from '../components/Navbar';
+
+Chart.register(CategoryScale, LinearScale, BarElement, Title, Tooltip, Legend);
 
 const Dashboard = () => {
   const userStats = { totalUsers: 100, totalAds: 50, totalRevenue: 5000 };
@@ -15,16 +19,31 @@ const Dashboard = () => {
     ],
   };
 
+  const chartRef = useRef(null);
+
+  useEffect(() => {
+    const chartInstance = chartRef.current.chartInstance;
+
+    return () => {
+      if (chartInstance) {
+        chartInstance.destroy();
+      }
+    };
+  }, []);
+
   return (
-    <div className="container mt-5">
-      <h4 className="mb-4">Dashboard</h4>
-      <div className="mb-4">
-        <h6>Total Users: {userStats.totalUsers}</h6>
-        <h6>Total Ads: {userStats.totalAds}</h6>
-        <h6>Total Revenue: {userStats.totalRevenue}</h6>
-      </div>
-      <div>
-        <Bar data={chartData} />
+    <div>
+      <Navbar />
+      <div className="container mt-5">
+        <h4 className="mb-4">Dashboard</h4>
+        <div className="mb-4">
+          <h6>Total Users: {userStats.totalUsers}</h6>
+          <h6>Total Ads: {userStats.totalAds}</h6>
+          <h6>Total Revenue: {userStats.totalRevenue}</h6>
+        </div>
+        <div>
+          <Bar ref={chartRef} data={chartData} />
+        </div>
       </div>
     </div>
   );