diff --git a/code/src/main/resources/views/admin.html b/code/src/main/resources/views/admin.html
index 6ec62bf..77486dd 100644
--- a/code/src/main/resources/views/admin.html
+++ b/code/src/main/resources/views/admin.html
@@ -5,7 +5,6 @@
     <meta name="viewport" content="width=device-width, initial-scale=1.0" />
     <title>Usage dashboard</title>
     <script src="https://cdn.tailwindcss.com"></script>
-    <script src="https://cdn.jsdelivr.net/npm/apexcharts"></script>
 </head>
 <body class="bg-gray-50 min-h-screen">
 
@@ -14,37 +13,31 @@
     <div class="mx-auto max-w-7xl px-4 py-4 sm:px-6 lg:px-8 flex justify-between items-center">
         <div class="flex items-center space-x-3">
             <div class="p-2 bg-indigo-100 rounded-lg">
-                <svg class="h-6 w-6 text-indigo-600" fill="none" stroke="currentColor" viewBox="0 0 24 24">
-                    <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 19v-6a2 2 0 00-2-2H5a2 2 0 00-2 2v6a2 2 0 002 2h2a2 2 0 002-2zm0 0V9a2 2 0 012-2h2a2 2 0 012 2v10m-6 0a2 2 0 002 2h2a2 2 0 002-2m0 0V5a2 2 0 012-2h2a2 2 0 012 2v14a2 2 0 01-2 2h-2a2 2 0 01-2-2z"/>
+                <svg class="h-6 w-6 text-indigo-600" fill="none" stroke="currentColor" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg">
+                    <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 19v-6a2 2 0 00-2-2H5a2 2 0 00-2 2v6a2 2 0 002 2h2a2 2 0 002-2zm0 0V9a2 2 0 012-2h2a2 2 0 012 2v10m-6 0a2 2 0 002 2h2a2 2 0 002-2m0 0V5a2 2 0 012-2h2a2 2 0 012 2v14a2 2 0 01-2 2h-2a2 2 0 01-2-2z"></path>
                 </svg>
             </div>
             <h1 class="text-2xl font-bold tracking-tight text-gray-900">Usage Dashboard</h1>
         </div>
         <div class="flex items-center space-x-2 text-sm text-gray-500">
-            <svg class="h-4 w-4 text-gray-400" fill="none" stroke="currentColor" viewBox="0 0 24 24">
-                <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M12 8v4l3 3m6-3a9 9 0 11-18 0 9 9 0 0118 0z"/>
+            <svg class="h-4 w-4 text-gray-400" fill="none" stroke="currentColor" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg">
+                <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M12 8v4l3 3m6-3a9 9 0 11-18 0 9 9 0 0118 0z"></path>
             </svg>
             <span>Last updated: <span id="lastUpdate" class="font-medium"></span></span>
         </div>
     </div>
 </header>
 
-
 <!-- Main Content -->
 <main class="mx-auto max-w-7xl px-4 py-6 sm:px-6 lg:px-8">
     <!-- Stats Overview -->
-    <div class="grid grid-cols-1 gap-6 sm:grid-cols-2 lg:grid-cols-4 mb-6">
-        <!-- Stat Box Template -->
+    <div class="grid grid-cols-1 gap-6 sm:grid-cols-2 lg:grid-cols-4 mb-8">
+        <!-- Total Users -->
         <div class="bg-white rounded-lg shadow p-6">
             <div class="flex items-center">
                 <div class="p-3 rounded-full bg-blue-100 mr-4">
-                    <svg class="h-6 w-6 text-blue-600" fill="none" stroke="currentColor" viewBox="0 0 24 24">
-                        <path
-                                stroke-linecap="round"
-                                stroke-linejoin="round"
-                                stroke-width="2"
-                                d="M17 20h5v-2a3 3 0 00-5.356-1.857M17 20H7m10 0v-2c0-.656-.126-1.283-.356-1.857M7 20H2v-2a3 3 0 015.356-1.857M7 20v-2c0-.656.126-1.283.356-1.857m0 0a5.002 5.002 0 019.288 0M15 7a3 3 0 11-6 0 3 3 0 016 0zm6 3a2 2 0 11-4 0 2 2 0 014 0zM7 10a2 2 0 11-4 0 2 2 0 014 0z"
-                        />
+                    <svg class="h-6 w-6 text-blue-600" fill="none" stroke="currentColor" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg">
+                        <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M17 20h5v-2a3 3 0 00-5.356-1.857M17 20H7m10 0v-2c0-.656-.126-1.283-.356-1.857M7 20H2v-2a3 3 0 015.356-1.857M7 20v-2c0-.656.126-1.283.356-1.857m0 0a5.002 5.002 0 019.288 0M15 7a3 3 0 11-6 0 3 3 0 016 0zm6 3a2 2 0 11-4 0 2 2 0 014 0zM7 10a2 2 0 11-4 0 2 2 0 014 0z"></path>
                     </svg>
                 </div>
                 <div>
@@ -53,11 +46,13 @@ <h3 class="text-gray-500 text-sm font-medium">Total users</h3>
                 </div>
             </div>
         </div>
+        
+        <!-- Total Messages -->
         <div class="bg-white rounded-lg shadow p-6">
             <div class="flex items-center">
                 <div class="p-3 rounded-full bg-purple-100 mr-4">
-                    <svg class="h-6 w-6 text-purple-600" fill="none" stroke="currentColor" viewBox="0 0 24 24">
-                        <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M8 10h.01M12 10h.01M16 10h.01M9 16H5a2 2 0 01-2-2V6a2 2 0 012-2h14a2 2 0 012 2v8a2 2 0 01-2 2h-5l-5 5v-5z" />
+                    <svg class="h-6 w-6 text-purple-600" fill="none" stroke="currentColor" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg">
+                        <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M8 10h.01M12 10h.01M16 10h.01M9 16H5a2 2 0 01-2-2V6a2 2 0 012-2h14a2 2 0 012 2v8a2 2 0 01-2 2h-5l-5 5v-5z"></path>
                     </svg>
                 </div>
                 <div>
@@ -66,16 +61,13 @@ <h3 class="text-gray-500 text-sm font-medium">Total messages</h3>
                 </div>
             </div>
         </div>
+        
+        <!-- Average Messages -->
         <div class="bg-white rounded-lg shadow p-6">
             <div class="flex items-center">
                 <div class="p-3 rounded-full bg-green-100 mr-4">
-                    <svg class="h-6 w-6 text-green-600" fill="none" stroke="currentColor" viewBox="0 0 24 24">
-                        <path
-                                stroke-linecap="round"
-                                stroke-linejoin="round"
-                                stroke-width="2"
-                                d="M9 19v-6a2 2 0 00-2-2H5a2 2 0 00-2 2v6a2 2 0 002 2h2a2 2 0 002-2zm0 0V9a2 2 0 012-2h2a2 2 0 012 2v10m-6 0a2 2 0 002 2h2a2 2 0 002-2m0 0V5a2 2 0 012-2h2a2 2 0 012 2v14a2 2 0 01-2 2h-2a2 2 0 01-2-2z"
-                        />
+                    <svg class="h-6 w-6 text-green-600" fill="none" stroke="currentColor" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg">
+                        <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 19v-6a2 2 0 00-2-2H5a2 2 0 00-2 2v6a2 2 0 002 2h2a2 2 0 002-2zm0 0V9a2 2 0 012-2h2a2 2 0 012 2v10m-6 0a2 2 0 002 2h2a2 2 0 002-2m0 0V5a2 2 0 012-2h2a2 2 0 012 2v14a2 2 0 01-2 2h-2a2 2 0 01-2-2z"></path>
                     </svg>
                 </div>
                 <div>
@@ -84,33 +76,23 @@ <h3 class="text-gray-500 text-sm font-medium">Avg messages/user</h3>
                 </div>
             </div>
         </div>
+        
+        <!-- Active Countries -->
         <div class="bg-white rounded-lg shadow p-6">
             <div class="flex items-center">
                 <div class="p-3 rounded-full bg-yellow-100 mr-4">
-                    <svg class="h-6 w-6 text-yellow-600" fill="none" stroke="currentColor" viewBox="0 0 24 24">
-                        <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M3 5h12M9 3v2m1.048 9.5A18.022 18.022 0 016.412 9m6.088 9h7M11 21l5-10 5 10M12.751 5C11.783 10.77 8.07 15.61 3 18.129" />
+                    <svg class="h-6 w-6 text-yellow-600" fill="none" stroke="currentColor" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg">
+                        <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M3 21v-4m0 0V5a2 2 0 012-2h6.5l1 1H21l-3 6 3 6h-8.5l-1-1H5a2 2 0 00-2 2zm9-13.5V9"></path>
                     </svg>
                 </div>
                 <div>
-                    <h3 class="text-gray-500 text-sm font-medium">Active Countrys</h3>
-                    <p class="text-2xl font-bold text-gray-900" id="activeCountrys">0</p>
+                    <h3 class="text-gray-500 text-sm font-medium">Active Countries</h3>
+                    <p class="text-2xl font-bold text-gray-900" id="activeCountries">0</p>
                 </div>
             </div>
         </div>
     </div>
 
-    <!-- Charts Row -->
-    <div class="grid grid-cols-1 lg:grid-cols-2 gap-6 mb-6">
-        <div class="bg-white rounded-lg shadow p-6">
-            <h3 class="text-lg font-medium mb-4">Messages per user</h3>
-            <div id="messagesPerUserChart"></div>
-        </div>
-        <div class="bg-white rounded-lg shadow p-6">
-            <h3 class="text-lg font-medium mb-4">Country distribution</h3>
-            <div id="CountryChart"></div>
-        </div>
-    </div>
-
     <!-- Users Table -->
     <div class="bg-white rounded-lg shadow p-6">
         <h2 class="text-xl font-semibold mb-4">User activity</h2>
@@ -134,31 +116,30 @@ <h2 class="text-xl font-semibold mb-4">User activity</h2>
 <!-- Scripts -->
 <script>
     const users = {{!user_data}}
+    
     document.addEventListener('DOMContentLoaded', () => {
+        updateLastUpdatedTime();
+        updateStats();
+        initTable();
+    });
+
+    function updateLastUpdatedTime() {
         const lastUpdateElement = document.getElementById('lastUpdate');
         if (lastUpdateElement) {
             lastUpdateElement.textContent = new Date().toLocaleString();
         }
-        updateStats();
-        initTable();
-        initCharts();
-    });
+    }
 
     function updateStats() {
         const totalUsers = users.length;
         const totalMessages = users.reduce((sum, user) => sum + user.messageCount, 0);
         const avgMessages = totalUsers > 0 ? Math.round(totalMessages / totalUsers) : 0;
-        const activeCountrys = new Set(users.map(u => u.languageCode)).size;
-
-        const totalUsersElement = document.getElementById('totalUsers');
-        const totalMessagesElement = document.getElementById('totalMessages');
-        const avgMessagesElement = document.getElementById('avgMessages');
-        const activeCountrysElement = document.getElementById('activeCountrys');
+        const activeCountries = new Set(users.map(u => u.languageCode)).size;
 
-        if (totalUsersElement) totalUsersElement.textContent = totalUsers;
-        if (totalMessagesElement) totalMessagesElement.textContent = totalMessages.toLocaleString();
-        if (avgMessagesElement) avgMessagesElement.textContent = avgMessages;
-        if (activeCountrysElement) activeCountrysElement.textContent = activeCountrys;
+        document.getElementById('totalUsers').textContent = totalUsers;
+        document.getElementById('totalMessages').textContent = totalMessages.toLocaleString();
+        document.getElementById('avgMessages').textContent = avgMessages;
+        document.getElementById('activeCountries').textContent = activeCountries;
     }
 
     function initTable() {
@@ -184,69 +165,6 @@ <h2 class="text-xl font-semibold mb-4">User activity</h2>
             tableBody.appendChild(row);
         });
     }
-
-    function initCharts() {
-        // Messages per User Chart
-        const messagesPerUserOptions = {
-            series: [{
-                name: 'Messages',
-                data: users.map(user => user.messageCount)
-            }],
-            chart: {
-                type: 'bar',
-                height: 350,
-            },
-            plotOptions: {
-                bar: {
-                    borderRadius: 10,
-                }
-            },
-            colors: ['#4F46E5'],
-            xaxis: {
-                categories: users.map(user => user.userName),
-                position: 'bottom'
-            },
-            dataLabels: {
-                enabled: false
-            },
-        };
-
-        const messagesPerUserChart = new ApexCharts(document.querySelector("#messagesPerUserChart"), messagesPerUserOptions);
-        messagesPerUserChart.render();
-
-        // Country Distribution Chart
-        const CountryCounts = users.reduce((counts, user) => {
-            counts[user.languageCode] = (counts[user.languageCode] || 0) + 1;
-            return counts;
-        }, {});
-
-        const CountryChartOptions = {
-            series: [{
-                name: 'Users',
-                data: Object.values(CountryCounts)
-            }],
-            chart: {
-                type: 'bar',
-                height: 350
-            },
-            plotOptions: {
-                bar: {
-                    borderRadius: 10,
-                }
-            },
-            colors: ['#4F46E5'],
-            xaxis: {
-                categories: Object.keys(CountryCounts).map(lang => lang.toUpperCase()),
-                position: 'bottom'
-            },
-            dataLabels: {
-                enabled: false
-            }
-        };
-
-        const CountryChart = new ApexCharts(document.querySelector("#CountryChart"), CountryChartOptions);
-        CountryChart.render();
-    }
 </script>
 </body>
 </html>
diff --git a/media/demo3.png b/media/demo3.png
deleted file mode 100644
index 322d0a2..0000000
Binary files a/media/demo3.png and /dev/null differ
