flux:table :paginate with invalid page # larger than lastPage() throws error

[ajkreitman]

Hi Flux Team! I'm seeing a bug with :paginate on the flux:table component. If an invalid page number is received by the component (a number larger than the last page #), an error is thrown. In my case, this can happen on a delete action. Or if I simply change the page number on the URL to an invalid #.

Here is the error:

Illuminate\Support\Number::format(): Argument #1 ($number) must be of type int|float, null given

Here is my blade:

    <flux:table :paginate="$this->faqs">
            <flux:columns>
                <flux:column>Question</flux:column>
                <flux:column>Answer</flux:column>
                <flux:column>User</flux:column>
                <flux:column>Pages</flux:column>
                <flux:column>Actions</flux:column>
            </flux:columns>

            <flux:rows>
                @foreach ($this->faqs as $faq)
                    <flux:row :key="$faq->id">

                        <flux:cell class="align-top w-1/4 !whitespace-normal">{{ $faq->question }}</flux:cell>
                        <flux:cell class="align-top w-1/2 !whitespace-normal ">{{ $faq->answer }}</flux:cell>


                        <flux:cell class="w-1/12 align-top">{{ $faq->user?->full_name }}</flux:cell>
                        <flux:cell class="w-1/12 align-top">
                            @foreach (array_map(function ($item) { return config('websites.template_pages.' . $item) ?? null; }, $faq->pages ?? []) as $page)
                                <flux:badge size="sm">{{ $page }}</flux:badge>
                            @endforeach
                        </flux:cell>

                        @if (!$cnfirmDelete || $cnfirmDelete != $faq->id)
                            <flux:cell key="{{ $faq->id }}" class="align-top w-1/12">
                                <flux:button icon="pencil" size="xs"
                                    wire:click="edit({{ $faq->id }})" />
                                <flux:button icon="trash" size="xs"
                                    wire:click="confirmDelete({{ $faq->id }})" />
                            </flux:cell>
                        @else
                            <flux:cell class="align-top">
                                <flux:subheading class="text-xs mb-2">Are you sure you want to delete this FAQ?
                                </flux:subheading>
                                <flux:button wire:click="delete({{ $faq->id }})"
                                    class="!bg-red-800 !text-white" size="xs">Confirm</flux:button>
                                <flux:button wire:click="cancelDelete" class="!bg-blue-800 !text-white"
                                    size="xs">Cancel</flux:button>
                            </flux:cell>
                        @endif
                    </flux:row>
                @endforeach

            </flux:rows>
        </flux:table>

My Computed faqs method in the component:

#[Computed]
public function faqs() {
    if ($this->this_user) {
        $query = SiteFaq::with('user')->where('user_id', $this->user_id);
    } else {
        $query = SiteFaq::with('user');

    }

    return $query->paginate(10);
}

Normal livewire pagination handles this situation very gracefully - so I believe this might be a bug? But I'm ready to be proven wrong!

[joshhanley]

@ajkreitman Can you share a screenshot of the error including the stack trace expanded?

[ajkreitman]

@joshhanley does this work? I can also upload additional "Vendor frames" if there is something else you might need.

[ju5t]

@joshhanley the issue is on line 53 of the flux:pagination component.