F
Filament10mo ago
Augus

Widget loading slow & showing white background?

Hi, I created a widget to be shown above certain list views and it does work but: A. it loads slow B. on loading it shows a white background box (see gif) List***.php
protected function getHeaderWidgets(): array
{
return [
IRDisabledWidget::class,
];
}
protected function getHeaderWidgets(): array
{
return [
IRDisabledWidget::class,
];
}
IRDisabledWidget.php
class IRDisabledWidget extends Widget
{
protected static string $view = 'livewire.widgets.i-r-disabled-widget';

protected int|string|array $columnSpan = 2;

public static function canView(): bool
{
return ! auth()->user()->isIrOnline() || ! auth()->user()->canAccessIR();
}
}
class IRDisabledWidget extends Widget
{
protected static string $view = 'livewire.widgets.i-r-disabled-widget';

protected int|string|array $columnSpan = 2;

public static function canView(): bool
{
return ! auth()->user()->isIrOnline() || ! auth()->user()->canAccessIR();
}
}
i-r-disabled-widget.blade.php
<x-filament-widgets::widget>
@if( ! auth()->user()->isIrOnline() )
<div id="alert-border-2"
class="flex items-center p-4 mb-4 text-red-800 border-t-4 border-red-300 bg-red-50 dark:text-red-400 dark:bg-gray-800 dark:border-red-800"
role="alert">
<svg class="flex-shrink-0 w-4 h-4" aria-hidden="true" xmlns="http://www.w3.org/2000/svg" fill="currentColor"
viewBox="0 0 20 20">
<path d="M10 .5a9.5 9.5 0 1 0 9.5 9.5A9.51 9.51 0 0 0 10 .5ZM9.5 4a1.5 1.5 0 1 1 0 3 1.5 1.5 0 0 1 0-3ZM12 15H8a1 1 0 0 1 0-2h1v-3H8a1 1 0 0 1 0-2h2a1 1 0 0 1 1 1v4h1a1 1 0 0 1 0 2Z"/>
</svg>
<div class="ms-3 text-sm font-medium">
I&R is offline, probeer het later nog eens.
</div>
</div>
@elseif( ! auth()->user()->canAccessIR() )
<div id="alert-border-1"
class="flex items-center p-4 mb-4 text-blue-800 border-t-4 border-blue-300 bg-blue-50 dark:text-blue-400 dark:bg-gray-800 dark:border-blue-800"
role="alert">
<svg class="flex-shrink-0 w-4 h-4" aria-hidden="true" xmlns="http://www.w3.org/2000/svg" fill="currentColor"
viewBox="0 0 20 20">
<path d="M10 .5a9.5 9.5 0 1 0 9.5 9.5A9.51 9.51 0 0 0 10 .5ZM9.5 4a1.5 1.5 0 1 1 0 3 1.5 1.5 0 0 1 0-3ZM12 15H8a1 1 0 0 1 0-2h1v-3H8a1 1 0 0 1 0-2h2a1 1 0 0 1 1 1v4h1a1 1 0 0 1 0 2Z"/>
</svg>
<div class="ms-3 text-sm font-medium">
U heeft geen I&R gekoppeld, onderstaand is een voorbeeld van een I&R functionaliteit binnen DAS. Klik
rechtsboven op uw profiel om I&R inloggegevens in te vullen.
</div>
</div>
@endif

</x-filament-widgets::widget>
<x-filament-widgets::widget>
@if( ! auth()->user()->isIrOnline() )
<div id="alert-border-2"
class="flex items-center p-4 mb-4 text-red-800 border-t-4 border-red-300 bg-red-50 dark:text-red-400 dark:bg-gray-800 dark:border-red-800"
role="alert">
<svg class="flex-shrink-0 w-4 h-4" aria-hidden="true" xmlns="http://www.w3.org/2000/svg" fill="currentColor"
viewBox="0 0 20 20">
<path d="M10 .5a9.5 9.5 0 1 0 9.5 9.5A9.51 9.51 0 0 0 10 .5ZM9.5 4a1.5 1.5 0 1 1 0 3 1.5 1.5 0 0 1 0-3ZM12 15H8a1 1 0 0 1 0-2h1v-3H8a1 1 0 0 1 0-2h2a1 1 0 0 1 1 1v4h1a1 1 0 0 1 0 2Z"/>
</svg>
<div class="ms-3 text-sm font-medium">
I&R is offline, probeer het later nog eens.
</div>
</div>
@elseif( ! auth()->user()->canAccessIR() )
<div id="alert-border-1"
class="flex items-center p-4 mb-4 text-blue-800 border-t-4 border-blue-300 bg-blue-50 dark:text-blue-400 dark:bg-gray-800 dark:border-blue-800"
role="alert">
<svg class="flex-shrink-0 w-4 h-4" aria-hidden="true" xmlns="http://www.w3.org/2000/svg" fill="currentColor"
viewBox="0 0 20 20">
<path d="M10 .5a9.5 9.5 0 1 0 9.5 9.5A9.51 9.51 0 0 0 10 .5ZM9.5 4a1.5 1.5 0 1 1 0 3 1.5 1.5 0 0 1 0-3ZM12 15H8a1 1 0 0 1 0-2h1v-3H8a1 1 0 0 1 0-2h2a1 1 0 0 1 1 1v4h1a1 1 0 0 1 0 2Z"/>
</svg>
<div class="ms-3 text-sm font-medium">
U heeft geen I&R gekoppeld, onderstaand is een voorbeeld van een I&R functionaliteit binnen DAS. Klik
rechtsboven op uw profiel om I&R inloggegevens in te vullen.
</div>
</div>
@endif

</x-filament-widgets::widget>
How can i maybe load this faster or at least remove the white background (see gif)?
No description
0 Replies
No replies yetBe the first to reply to this messageJoin
Want results from more Discord servers?
Add your server