update datasource() and reload from external button in livewire-powergrid

Question

How to add new filter ->where('document_type_id',$category_id) and reload the PowerGrid table. below is my Blade template looks like:

#sidebar
<ul>
@foreach ($categories as $category)
<li><a href="#" wire:click="categoryFilter($category->id)>{{$category->name}}</a></li>
@endforeach()
</ul>
#table
<livewire:document-table />

and my DocumentTable.php :

final class DocumentTable extends PowerGridComponent
{
    use ActionButton;
    use WithExport;

    protected $listeners = ['filterDocument'];
    public $category_id;

    public function filterDocument($categoryId)
    {
        $this->category_id = $categoryId;

        // Add any additional logic to reload the data in the table if necessary

        $this->refresh();
    }

    public function datasource(): Builder
    {

        $documents = Document::query()->with('document_status', 'document_type', 'partner', 'users', 'departments')
            ->where('parent_id', null)
            ->where(function ($query) {
                $query->whereHas('departments', function ($query) {
                    $query->where('department_id', auth()->user()->department_id);
                })->orWhereHas('users', function ($query) {
                    $query->where('user_id', auth()->user()->id);
                });
            });

        if ($this->category_id) :
            $documents->where('document_type_id', $this->category_id);
        endif;

        return $documents;
    }

}

With the code above, when I click the category link in the sidebar, there is no response. What I hope is datasource() will be updated based on category I clicked.

Thanks in advance