PacketLoss Chart

app/Filament/Pages/Dashboard.php

@@ -1,7 +1,7 @@
 <?php
 
 namespace App\Filament\Pages;
-
+use App\Filament\Widgets\RecentPacketLossChartWidget;
 use App\Filament\Widgets\RecentDownloadChartWidget;
 use App\Filament\Widgets\RecentDownloadLatencyChartWidget;
 use App\Filament\Widgets\RecentJitterChartWidget;
@@ -44,6 +44,7 @@ protected function getHeaderWidgets(): array
             RecentJitterChartWidget::make(),
             RecentDownloadLatencyChartWidget::make(),
             RecentUploadLatencyChartWidget::make(),
+            RecentPacketLossChartWidget::make(),
         ];
     }
 }

app/Filament/Widgets/RecentPacketLossChartWidget.php

@@ -0,0 +1,106 @@
+<?php
+
+namespace App\Filament\Widgets;
+
+use App\Enums\ResultStatus;
+use App\Helpers\Average;
+use App\Helpers\Number;
+use App\Models\Result;
+use Filament\Widgets\ChartWidget;
+
+class RecentPacketLossChartWidget extends ChartWidget
+{
+    protected static ?string $heading = 'Packet Loss (%)';
+
+    protected int|string|array $columnSpan = 'full';
+
+    protected static ?string $maxHeight = '250px';
+
+    protected static ?string $pollingInterval = '60s';
+
+    public ?string $filter = '24h';
+
+    protected function getFilters(): ?array
+    {
+        return [
+            '24h' => 'Last 24h',
+            'week' => 'Last week',
+            'month' => 'Last month',
+        ];
+    }
+
+    protected function getData(): array
+    {
+        $results = Result::query()
+            ->select(['id', 'packetLoss', 'created_at'])
+            ->where('status', '=', ResultStatus::Completed)
+            ->when($this->filter == '24h', function ($query) {
+                $query->where('created_at', '>=', now()->subDay());
+            })
+            ->when($this->filter == 'week', function ($query) {
+                $query->where('created_at', '>=', now()->subWeek());
+            })
+            ->when($this->filter == 'month', function ($query) {
+                $query->where('created_at', '>=', now()->subMonth());
+            })
+            ->orderBy('created_at')
+            ->get();
+
+        return [
+            'datasets' => [
+                [
+                    'label' => 'packetLoss',
+                    'data' => $results->map(fn ($item) => is_numeric($item->getRawOriginal('packetLoss')) ? round($item->getRawOriginal('packetLoss'), 2) : null)->values()->all(),
+                    'backgroundColor' => 'rgba(14, 165, 233, 0.1)',
+                    'pointBackgroundColor' => 'rgba(14, 165, 233)',
+                    'fill' => true,
+                    'cubicInterpolationMode' => 'monotone',
+                    'tension' => 0.4,
+                    'pointRadius' => count($results) <= 24 ? 3 : 0,
+                ]//,
+                // [
+                //     'label' => 'Average',
+                //     'data' => array_fill(0, count($results), Average::averageDownload($results)),
+                //     'borderColor' => 'rgb(243, 7, 6, 1)',
+                //     'pointBackgroundColor' => 'rgb(243, 7, 6, 1)',
+                //     'fill' => false,
+                //     'cubicInterpolationMode' => 'monotone',
+                //     'tension' => 0.4,
+                //     'pointRadius' => 0,
+                // ],
+            ],
+            // labels as plain array as well
+            'labels' => $results->map(fn ($item) => $item->created_at->timezone(config('app.display_timezone'))->format(config('app.chart_datetime_format'))),
+        ];
+
+    }
+
+    protected function getOptions(): array
+    {
+        return [
+            'plugins' => [
+                'legend' => [
+                    'display' => true,
+
+                ],
+                'tooltip' => [
+                    'enabled' => true,
+                    'mode' => 'index',
+                    'intersect' => false,
+                    'position' => 'nearest',
+                ],
+            ],
+            'scales' => [
+                'y' => [
+                    'beginAtZero' => config('app.chart_begin_at_zero'),
+                    'grace' => 2,
+                ],
+            ],
+        ];
+    }
+
+    protected function getType(): string
+    {
+        return 'line';
+    }
+}

app/Jobs/Ookla/RunSpeedtestJob.php

@@ -92,6 +92,7 @@ public function handle(): void
             'upload' => Arr::get($output, 'upload.bandwidth'),
             'download_bytes' => Arr::get($output, 'download.bytes'),
             'upload_bytes' => Arr::get($output, 'upload.bytes'),
+            'packetLoss' => Arr::get($output, 'packetLoss'),
             'data' => $output,
         ]);
     }

database/migrations/2025_09_23_192342_add_packet_loss_to_results.php

@@ -0,0 +1,28 @@
+<?php
+
+use Illuminate\Database\Migrations\Migration;
+use Illuminate\Database\Schema\Blueprint;
+use Illuminate\Support\Facades\Schema;
+
+return new class extends Migration
+{
+    /**
+     * Run the migrations.
+     */
+    public function up(): void
+    {
+        Schema::table('results', function (Blueprint $table) {
+            $table->float('packetLoss')->nullable();
+        });
+    }
+
+    /**
+     * Reverse the migrations.
+     */
+    public function down(): void
+    {
+        Schema::table('results', function (Blueprint $table) {
+           $table->dropColumn('packetLoss');
+        });
+    }
+};

resources/views/dashboard.blade.php

@@ -10,6 +10,7 @@
             </div>
         @endisset
 
+
         <div class="col-span-full">
             @livewire(\App\Filament\Widgets\RecentDownloadChartWidget::class)
         </div>
@@ -33,6 +34,9 @@
         <div class="col-span-full">
             @livewire(\App\Filament\Widgets\RecentUploadLatencyChartWidget::class)
         </div>
+        <div class="col-span-full">
+            @livewire(\App\Filament\Widgets\RecentPacketLossChartWidget::class)
+        </div>
 
     </div>