add slow job feature and update installation instructions

Author: Sirajunnasihin

README.md

@@ -45,6 +45,25 @@ After installing the package, publish the configuration file using Artisan:
 php artisan vendor:publish --provider="Dotswan\FilamentLaravelPulse\FilamentLaravelPulseServiceProvider"
 ```
 
+**Extra Configuration:**
+Since Laravel Pulse uses Tailwind CSS custom stylesheets, it is necessary to register the CSS files to resolve display issues. So, don't forget to add the CSS file to the content array. To do this, you need to add this directory into the `content` array of `tailwind.config.js` file :
+```
+export default {
+    content: [
+        // ...
+        './vendor/laravel/pulse/resources/views/**/*.blade.php', // Add this line
+    ],
+    // ...
+}
+```
+
+after update `tailwind.config.js` run this command:
+
+```bash
+npm install
+npm run build
+```
+
 ## Basic Usage
 
 To start using Filament Laravel Pulse, follow these steps:

config/filament-laravel-pulse.php

@@ -115,5 +115,19 @@
             'canView' => true,
             'columnStart' => [],
         ],
+
+        'slow-jobs' => [
+            'columnSpan' => [
+                'md' => 5,
+                'xl' => 5,
+            ],
+            'cols' => 'full',
+            'ignoreAfter' => '1 day',
+            'isDiscovered' => true,
+            'isLazy' => true,
+            'sort' => null,
+            'canView' => true,
+            'columnStart' => [],
+        ],
     ],
 ];

resources/views/widgets/pulse-slow-jobs.blade.php

@@ -0,0 +1,3 @@
+<x-filament-widgets::widget>
+    <livewire:pulse.slow-jobs cols="{{$this->cols}}" rows="{{$this->rows}}" ignore-after="{{$this->ignoreAfter}}"/>
+</x-filament-widgets::widget>

src/FilamentLaravelPulseServiceProvider.php

@@ -12,6 +12,7 @@
 use Dotswan\FilamentLaravelPulse\Widgets\PulseSlowQueries;
 use Dotswan\FilamentLaravelPulse\Widgets\PulseSlowRequests;
 use Dotswan\FilamentLaravelPulse\Widgets\PulseUsage;
+use Dotswan\FilamentLaravelPulse\Widgets\PulseSlowJobs;
 use Filament\Support\Assets\Asset;
 use Filament\Support\Assets\Js;
 use Filament\Support\Facades\FilamentAsset;
@@ -128,5 +129,6 @@ protected function registerLivewireComponents(): void
         Livewire::component('dotswan.filament-laravel-pulse.widgets.pulse-slow-queries', PulseSlowQueries::class);
         Livewire::component('dotswan.filament-laravel-pulse.widgets.pulse-slow-requests', PulseSlowRequests::class);
         Livewire::component('dotswan.filament-laravel-pulse.widgets.pulse-usage', PulseUsage::class);
+        Livewire::component('dotswan.filament-laravel-pulse.widgets.pulse-slow-jobs', PulseSlowJobs::class);
     }
 }

src/Widgets/PulseSlowJobs.php

@@ -0,0 +1,30 @@
+<?php
+
+declare(strict_types=1);
+
+namespace Dotswan\FilamentLaravelPulse\Widgets;
+
+use Filament\Widgets\Widget;
+
+class PulseSlowJobs extends Widget
+{
+    protected static string $view = 'filament-laravel-pulse::widgets.pulse-slow-jobs';
+
+    protected string|int|array $cols;
+
+    protected string $ignoreAfter;
+
+    public function __construct()
+    {
+        $config = config('filament-laravel-pulse.components.slow-jobs');
+        $this->columnSpan = $config['columnSpan'] ?? [
+            'md' => 5,
+            'xl' => 5,
+        ];
+        $this->cols = $config['cols'] ?? 'full';
+        $this->ignoreAfter = $config['ignoreAfter'] ?? '1 hour';
+        self::$isDiscovered = $config['isDiscovered'] ?? true;
+        self::$isLazy = $config['isLazy'] ?? true;
+        self::$sort = $config['sort'] ?? null;
+    }
+}