FilamentF
Filament•14mo ago
taz

Failed to lazy load a column in a table

I have a custom column that lazy load a livewire component. But it still wait 7 seconds before seeing the table appear on screen. Have you ever lazy load a column in a FIlament table ? 
<?php

namespace App\Tables\Columns;

use Filament\Tables\Columns\Column;

class ModelStatusColumn extends Column
{
    protected string $view = 'tables.columns.model-status-column';
}


and its view lazy loads a livewire component
<div>
    <livewire:model-status-livewire-component lazy :record="$getRecord()"  />
</div>


Livewire component lazy loaded 

<?php

namespace App\Livewire;

use Livewire\Component;
use Livewire\Attributes\Lazy;

#[Lazy]
class ModelStatusLivewireComponent extends Component
{
    public $record;

    public ?string $longAttributeToCompute = null;

    public function mount($record)
    {
        $this->record = $record;
        sleep(7);  // Simulate a 5 to 7 seconds long api call that will do a compute based on some record attributes
        $this->longAttributeToCompute = $record->name;
       
    }

    public function render()
    {
        return view('livewire.model-status-livewire-component');
    }
}

<div class="px-4 py-3 text-white font-bold">
    {{ $longAttributeToCompute }}
</div>
Was this page helpful?