[Feature] Added dashboard buttons to the toolbar (#1842)

added dashboard button to the toolbar

app/Filament/Pages/Dashboard.php

@@ -2,8 +2,6 @@
 
 namespace App\Filament\Pages;
 
-use App\Actions\GetOoklaSpeedtestServers;
-use App\Actions\Ookla\StartSpeedtest;
 use App\Filament\Widgets\RecentDownloadChartWidget;
 use App\Filament\Widgets\RecentDownloadLatencyChartWidget;
 use App\Filament\Widgets\RecentJitterChartWidget;
@@ -11,14 +9,9 @@ use App\Filament\Widgets\RecentPingChartWidget;
 use App\Filament\Widgets\RecentUploadChartWidget;
 use App\Filament\Widgets\RecentUploadLatencyChartWidget;
 use App\Filament\Widgets\StatsOverviewWidget;
-use App\Helpers\Ookla;
 use Carbon\Carbon;
 use Cron\CronExpression;
-use Filament\Actions\Action;
-use Filament\Forms;
-use Filament\Notifications\Notification;
 use Filament\Pages\Dashboard as BasePage;
-use Filament\Support\Enums\IconPosition;
 
 class Dashboard extends BasePage
 {
@@ -41,55 +34,6 @@ class Dashboard extends BasePage
         return 'Next speedtest at: '.$nextRunDate;
     }
 
-    protected function getHeaderActions(): array
-    {
-        return [
-            Action::make('home')
-                ->label('Public Dashboard')
-                ->icon('heroicon-o-chart-bar')
-                ->iconPosition(IconPosition::Before)
-                ->color('gray')
-                ->hidden(fn (): bool => ! config('speedtest.public_dashboard'))
-                ->url(shouldOpenInNewTab: true, url: '/'),
-
-            Action::make('speedtest')
-                ->form([
-                    Forms\Components\Select::make('server_id')
-                        ->label('Select Server')
-                        ->helperText('Leave empty to run the speedtest without specifying a server.')
-                        ->options(function (): array {
-                            return array_filter([
-                                'Manual servers' => Ookla::getConfigServers(),
-                                'Closest servers' => GetOoklaSpeedtestServers::run(),
-                            ]);
-                        })
-                        ->searchable(),
-                ])
-                ->action(function (array $data) {
-                    $serverId = $data['server_id'] ?? null;
-
-                    StartSpeedtest::run(
-                        scheduled: false,
-                        serverId: $serverId,
-                    );
-
-                    Notification::make()
-                        ->title('Speedtest started')
-                        ->success()
-                        ->send();
-                })
-                ->modalHeading('Run Speedtest')
-                ->modalWidth('lg')
-                ->modalSubmitActionLabel('Start')
-                ->button()
-                ->color('primary')
-                ->label('Run Speedtest')
-                ->icon('heroicon-o-rocket-launch')
-                ->iconPosition(IconPosition::Before)
-                ->hidden(! auth()->user()->is_admin),
-        ];
-    }
-
     protected function getHeaderWidgets(): array
     {
         return [

app/Livewire/Topbar/RunSpeedtestAction.php

@@ -0,0 +1,82 @@
+<?php
+
+namespace App\Livewire\Topbar;
+
+use App\Actions\GetOoklaSpeedtestServers;
+use App\Actions\Ookla\StartSpeedtest;
+use App\Helpers\Ookla;
+use Filament\Actions\Action;
+use Filament\Actions\Concerns\InteractsWithActions;
+use Filament\Actions\Contracts\HasActions;
+use Filament\Forms\Components\Select;
+use Filament\Forms\Concerns\InteractsWithForms;
+use Filament\Forms\Contracts\HasForms;
+use Filament\Notifications\Notification;
+use Filament\Support\Enums\IconPosition;
+use Livewire\Component;
+
+class RunSpeedtestAction extends Component implements HasActions, HasForms
+{
+    use InteractsWithActions, InteractsWithForms;
+
+    public function dashboardAction(): Action
+    {
+        return Action::make('home')
+            ->label('Dashboard')
+            ->icon('heroicon-o-chart-bar')
+            ->iconPosition(IconPosition::Before)
+            ->color('gray')
+            ->hidden(fn (): bool => ! config('speedtest.public_dashboard'))
+            ->url(shouldOpenInNewTab: true, url: '/')
+            ->extraAttributes([
+                'id' => 'dashboardAction',
+            ]);
+    }
+
+    public function speedtestAction(): Action
+    {
+        return Action::make('speedtest')
+            ->form([
+                Select::make('server_id')
+                    ->label('Select Server')
+                    ->helperText('Leave empty to run the speedtest without specifying a server.')
+                    ->options(function (): array {
+                        return array_filter([
+                            'Manual servers' => Ookla::getConfigServers(),
+                            'Closest servers' => GetOoklaSpeedtestServers::run(),
+                        ]);
+                    })
+                    ->searchable(),
+            ])
+            ->action(function (array $data) {
+                $serverId = $data['server_id'] ?? null;
+
+                StartSpeedtest::run(
+                    scheduled: false,
+                    serverId: $serverId,
+                );
+
+                Notification::make()
+                    ->title('Speedtest started')
+                    ->success()
+                    ->send();
+            })
+            ->modalHeading('Run Speedtest')
+            ->modalWidth('lg')
+            ->modalSubmitActionLabel('Start')
+            ->button()
+            ->color('primary')
+            ->label('Speedtest')
+            ->icon('heroicon-o-rocket-launch')
+            ->iconPosition(IconPosition::Before)
+            ->hidden(! auth()->user()->is_admin)
+            ->extraAttributes([
+                'id' => 'speedtestAction',
+            ]);
+    }
+
+    public function render()
+    {
+        return view('livewire.topbar.run-speedtest-action');
+    }
+}

app/Providers/FilamentServiceProvider.php

@@ -0,0 +1,36 @@
+<?php
+
+namespace App\Providers;
+
+use Filament\Support\Assets\Css;
+use Filament\Support\Facades\FilamentAsset;
+use Filament\Support\Facades\FilamentView;
+use Filament\View\PanelsRenderHook;
+use Illuminate\Support\Facades\Blade;
+use Illuminate\Support\ServiceProvider;
+
+class FilamentServiceProvider extends ServiceProvider
+{
+    /**
+     * Register services.
+     */
+    public function register(): void
+    {
+        //
+    }
+
+    /**
+     * Bootstrap services.
+     */
+    public function boot(): void
+    {
+        FilamentAsset::register([
+            Css::make('panel', __DIR__.'/../../resources/css/panel.css'),
+        ]);
+
+        FilamentView::registerRenderHook(
+            PanelsRenderHook::GLOBAL_SEARCH_BEFORE,
+            fn (): string => Blade::render("@livewire('topbar.run-speedtest-action')"),
+        );
+    }
+}

bootstrap/providers.php

@@ -2,5 +2,6 @@
 
 return [
     App\Providers\AppServiceProvider::class,
+    App\Providers\FilamentServiceProvider::class,
     App\Providers\Filament\AdminPanelProvider::class,
 ];

public/css/app/panel.css

@@ -0,0 +1,11 @@
+.fi-topbar #dashboardAction .fi-btn-label,
+.fi-topbar #speedtestAction .fi-btn-label {
+    display: none;
+}
+
+@media (min-width: 768px) {
+    .fi-topbar #dashboardAction .fi-btn-label,
+    .fi-topbar #speedtestAction .fi-btn-label {
+        display: block;
+    }
+}

resources/css/panel.css

@@ -0,0 +1,11 @@
+.fi-topbar #dashboardAction .fi-btn-label,
+.fi-topbar #speedtestAction .fi-btn-label {
+    display: none;
+}
+
+@media (min-width: 768px) {
+    .fi-topbar #dashboardAction .fi-btn-label,
+    .fi-topbar #speedtestAction .fi-btn-label {
+        display: block;
+    }
+}

resources/views/livewire/topbar/run-speedtest-action.blade.php

@@ -0,0 +1,9 @@
+<div>
+    <div class="flex flex-wrap items-start justify-start gap-3">
+        {{ $this->dashboard }}
+
+        {{ $this->speedtestAction }}
+    </div>
+
+    <x-filament-actions::modals />
+</div>