Display log files in your application using Livewire and Alpine
I was having a lot of problems displaying log files in the admin area of my application. The Logfiles were being written to following each transaction, and a typical daily log file could be up to 10MB. The best available packages would crash and burn with this size of logfile.
In TALL stack style, the logfiles are displayed using Tailwind.
Livewire Component
php artisan make:livewire LogsViewer
app/Http/Livewire/LogsViewer.php
<?php
namespace App\Http\Livewire;
use Illuminate\Support\Facades\File;
use Livewire\Component;
use SplFileInfo;
class LogsViewer extends Component
{
public $file=0;
public $page=1;
public $total;
public $perPage = 500;
public $paginator;
protected $queryString=['page'];
public function render()
{
$files = $this->getLogfiles();
$log=collect(file($files[$this->file]->getPathname(), FILE_IGNORE_NEW_LINES));
$this->total = intval(floor($log->count() / $this->perPage)) + 1;
$log = $log->slice(($this->page - 1) * $this->perPage, $this->perPage)->values();
return view('livewire.logs-viewer')->withFiles($files)->withLog($log);
}
protected function getLogFiles()
{
$directory = storage_path('logs');
return collect(File::allFiles($directory))
->sortByDesc(function (SplFileInfo $file) {
return $file->getMTime();
})->values();
}
public function goto($page)
{
$this->page=$page;
}
public function updatingFile()
{
$this->page=1;
}
}
View file
Of note here is the detection of the [stackdump] sections, moving these to a nested block and hiding that block using Alpine. Clicking the [stackdump] in the log expands the nested section and reveals the stack dump.