Added highest CPU usage past 24 hours feature

cp6 · Oct 7, 2023 · b0bcc5e · b0bcc5e
1 parent 527adee
commit b0bcc5e
Show file tree

Hide file tree

Showing 2 changed files with 8 additions and 3 deletions.
diff --git a/app/Http/Controllers/ServerUsageController.php b/app/Http/Controllers/ServerUsageController.php
@@ -4,6 +4,7 @@
 
 use App\Models\Server;
 use App\Models\ServerUsage;
+use Carbon\Carbon;
 use Inertia\Inertia;
 
 class ServerUsageController extends Controller
@@ -35,8 +36,11 @@ public function ramUsage(Server $server): \Inertia\Response
 
     public function cpuUsage(Server $server): \Inertia\Response
     {
+        $high_24h = ServerUsage::where('server_id', $server->id)->where('created_at', '>=', Carbon::now()->subDay()->toDateTimeString())
+            ->select(['cpu_usage', 'created_at'])->orderBy('cpu_usage', 'desc')->first();
         return Inertia::render('Servers/Usage/Cpu', [
             'resource' => $server,
+            'high_24h' => $high_24h,
             'usage' => ServerUsage::where('server_id', $server->id)->select(['cpu_usage', 'created_at'])->orderBy('id', 'desc')->take(720)->get()
         ]);
     }

diff --git a/resources/js/Pages/Servers/Usage/Cpu.jsx b/resources/js/Pages/Servers/Usage/Cpu.jsx
@@ -10,8 +10,9 @@ export default function Cpu({auth}) {
 
     const resource = usePage().props.resource;
     const usage = usePage().props.usage;
+    const high = usePage().props.high_24h;
 
-    const time = usage.map((d) => format(new Date(d.created_at),  'hh:mma do LLL yyyy'));
+    const time = usage.map((d) => format(new Date(d.created_at), 'hh:mma do LLL yyyy'));
     const usage_values = usage.map((value) => Math.round(value.cpu_usage * 10));
 
     const data = {
@@ -89,7 +90,6 @@ export default function Cpu({auth}) {
         }
     };
 
-
     return (
         <AuthenticatedLayout
             auth={auth}
@@ -105,6 +105,8 @@ export default function Cpu({auth}) {
                 </div>
 
                 <section className="bg-white/50 dark:bg-gray-700 rounded-lg shadow-sm">
+                    <p className="p-2 text-gray-700 dark:text-gray-400">Highest usage past
+                        24H: {high.cpu_usage} at {format(new Date(high.created_at), 'hh:mma')}</p>
                     <div className="w-full">
                         <Chart
                             options={data.options}
@@ -117,7 +119,6 @@ export default function Cpu({auth}) {
                 </section>
             </div>
 
-
         </AuthenticatedLayout>
     );
 }