Pagination by group and not by items

[paulijmker]

Package

Panel builder

Package Version

v3.2.61

How can we help you?

I have a question that I can't answer. I receive data from multiple plugins from multiple websites in a PluginResource.php.
Now I have managed to set the default group, but the pagination is based on the plugins and not on the group with in this case site.url.

How can I ensure that the pagination is based on the site.url and not on all the separate plugins.
And is it also possible to load the groups collapsed, I have not found anything about this. Thank you very much in advance!

public static function table(Table $table): Table
{
        return $table
            ->groups([
                GroupingGroup::make('site.url')
                    ->collapsible(),
            ])
            ->defaultGroup(Group::make('site.url')->collapsible())
            ->columns([
                ImageColumn::make('icon'),
                TextColumn::make('name')
                    ->searchable()
                    ->sortable(),
                TextColumn::make('site.url')
                    ->searchable()
                    ->sortable(),
            ])
            ->defaultSort('name')
            ->filters([
                //
            ])
            ->actions([
                //
            ])
            ->bulkActions([
                Tables\Actions\BulkActionGroup::make([
                    Tables\Actions\DeleteBulkAction::make(),
                ]),
            ]);
    }

[parisl69]

I would very much be interested in knowing if anyone has found a solution for this.. currently experimenting on my own for a similar situation..

[parisl69]

As for the second part of your question, making the groups appear collapsed, here is what I came up with, but please note that it involves modifying the original filament blade component for group headers.

Specifically, I had to change the original group header located at:
vendor/filament/tables/resources/views/components/group/header.blade.php
and create my own modified version at:
resources/views/vendor/filament-tables/components/group/header.blade.php

Additionally, I'm addressing another need to have html in the group header title.

{{-- Group header - modified --}}

@props([
    'collapsible' => false,
    'description' => null,
    'label' => null,
    'start' => null,
    'title',
])

@php
    use Illuminate\Support\Js;
    $htmlTitleContent = true;
    $collapsedByDefault = true;
@endphp

<div @if ($collapsible) x-on:click="toggleCollapseGroup(@js($title))" @endif
    @if ($collapsible && $collapsedByDefault) x-init="if (!isGroupCollapsed()) collapsedGroups.push(@js($title))" @endif
    {{ $attributes->class([
        'fi-ta-group-header flex items-center gap-x-3 bg-gray-200/80 hover:bg-gray-300/65 border-2 dark:border-white/5 border-white py-2 dark:bg-white/15 dark:hover:bg-white/35 justify-between rounded pl-3 py-8',
        'cursor-pointer' => $collapsible,
    ]) }}>

    {{ $start }}

    <div class="grid">

        <h4 class="flex gap-2 text-sm font-medium text-gray-950 dark:text-white">
            @if (filled($label))
                {{ $label }}
            @endif

            <div class="w-full mr-5 text-wrap">
                @if ($htmlTitleContent)
                    {{-- Use with caution only if you have control on $title --}}
                    {!! $title !!}
                @else
                    {{ $title }}
                @endif
            </div>
        </h4>

        @if (filled($description))
            <p class="text-sm text-gray-500 dark:text-gray-400">
                {{ $description }}
            </p>
        @endif
    </div>

    @if ($collapsible)
        <x-filament::icon-button color="gray" icon="heroicon-m-chevron-down" icon-alias="heroicon-chevron-down"
            :label="filled($label) ? $label . ': ' . $title : $title" size="sm"
            :x-bind:aria-expanded="'! isGroupCollapsed('.Js::from($title).
            ')'" size="xs"
            class="w-4 h-4 mr-3 rounded-md cursor-pointer dark:text-white hover:bg-slate-300 hover:text-black dark:hover:text-black"
            :x-bind:class="'isGroupCollapsed('.Js::from($title).
            ') && \'-rotate-180\''" />
    @endif

</div>

If you have found another solution not involving changing the blade component, I'd be glad to know.

[roncarino]

In Filament v4, the collapsed thing seems to be solved by using "->collapsedGroupsByDefault()" inside "$table". Before I was using your solution too @parisl69.

About the pagination I am looking for a solution as well.

[skauk]

In Filament v4 you can add this in your ListRecords class:

protected function paginateTableQuery(Builder $query): Paginator | CursorPaginator
{
    $groupColumn = $this->getTableGrouping()?->getColumn();

    $perPage = $this->getTableRecordsPerPage();

    $pageQuery = $groupColumn ? $query->clone()->distinct($groupColumn) : $query;

    $mode = $this->getTable()->getPaginationMode();

    $records = match ($mode) {
        PaginationMode::Simple => $pageQuery->simplePaginate(
            perPage: ($perPage === 'all') ? $query->toBase()->getCountForPagination() : $perPage,
            pageName: $this->getTablePaginationPageName(),
        ),
        PaginationMode::Cursor => $pageQuery->cursorPaginate(
            perPage: ($perPage === 'all') ? $query->toBase()->getCountForPagination() : $perPage,
            cursorName: $this->getTablePaginationPageName(),
        ),
        PaginationMode::Default => $pageQuery->paginate(
            perPage: ($perPage === 'all') ? null : $perPage,
            pageName: $this->getTablePaginationPageName(),
            total: $pageQuery->toBase()->getCountForPagination(),
        )->onEachSide(0)
    };

    if ($groupColumn) {
        $records->setCollection(
            $query->whereIn($groupColumn, $records->pluck($groupColumn))->get()
        );
    }

    return $records;
}

This will retrieve the current table grouping and make a query to paginate the group. This is then used to retrieve all the records in these groups and paginate groups rather than the records themselves. I'm not sure how well this works with filters, scopes, etc. It should work with any pagination mode.