Livewire Datatable problem with eager loaded relations.

I am looking into a livewire version of datatables due to the normal version docs being out of date to try and follow. I was going through the video instructions on the livewire site, but its not working out due to the relationships. I also need to include search functionality.

I am getting hung up with pagination when i try to eager load relationships. I've read that you can't pass collections, but I'm not entirely sure what to do to fix this.

<?php

namespace App\Http\Livewire\Hobby;

use App\Models\Hobby;
use App\Models\HobbyAltName;
use App\Models\Tag;
use Livewire\Component;
use Livewire\WithPagination;

class HobbyManager extends Component
{
    use WithPagination;

    public    $searchHobbies   = '';
    public    $hobbies;
    public    $categories;
    protected $paginationTheme = 'bootstrap';

    public function updatingSearch()
    {
        $this->resetPage();
    }

    public function mount()
    {
        $this->categories = Tag::withCount('hobbies')->whereTag_type('1')->get();
        $this->hobbies = Hobby::with('equipment', 'categories', 'hobbyAltNames', 'hobbyType', 'users')->get();
    }

    public function render()
    {

        $searchHobbies = '%' . $this->searchHobbies . '%';
//Search should search Altnames and hobby_names to display relative hobbies. 
        // $this->hobbies = Hobby::where('hobby_name', 'like', $searchHobbies)->get();
        //$this->AltNames = HobbyAltName::where('name', 'like', $searchHobbies)->get();


        // $this->hobbies = Hobby::where('hobby_name', 'like', $searchHobbies)->paginate(25);
      
        return view('livewire.hobby.hobby-manager', ['hobbies' => $this->hobbies->where('hobby_name', 'like', $searchHobbies)
            ->paginate(25), 'categories' => $this->categories]);
    }
}

LW Blade:

<div class="row">
    {{--    Search hobbies/ altname--}}
    <div class="col-md-4 mb-2">
             <label for="hobbies">Hobbies</label>
        <input type="text" wire:model="searchHobbies"/>


    </div>
</div>


<div class="container">
    <table class=" table table-bordered table-striped table-hover  table-responsive ajaxTable datatable
    datatable-Hobby">
        <thead class="thead-inverse">
            <tr>
                <th></th>
                <th>Hobby</th>
                <th>Alt Names</th>
                <th>Status</th>
                <th>Category</th>
                <th>Types</th>
                <th>Date Updated</th>
                <th>Likes</th>
                <th>Equipment</th>
                <th>Actionables</th>
            </tr>
        </thead>
        <tbody>

            @forelse($hobbies as $hobby)

                <tr>
                    <td></td>
                    <td><a href="{{route('hobbies.show', $hobby->id)}}">{{$hobby->hobby_name}}</a></td>
                    <td>@foreach( $hobby->hobbyAltNames as $name)
                            {{$name->name}}<br/>
                        @endforeach</td>
                    <td> {{ App\Models\Hobby::STATUS_RADIO[$hobby->status] ?? '' }}
                    </td>


                    <td>@foreach($hobby->categories as $cat)

                            @if($cat->parent_id != null)
                                {{ $categories->find($cat->parent_id)->tag ."/" }}
                            @endif
                            {{$cat->tag}}<br/>
                        @endforeach
                    </td>
                    <td>##</td>
                    <td>{{$hobby->updated_at->toFormattedDateString()}}</td>
                    <td>{{$hobby->users->count()}}</td>
                    <td> @include('admin.content.hobbies.equipment')</td>
                    {{-- <td>{{$hobby->equipment_count}}</td> --}}
                    {{-- <td>@include('admin.content.partials.demographics')</td> --}}
                    <td>{{$hobby->equipment->count()==0 ? 'Add Equipment':''}}
                        {{-- {{$hobby->profileImage->count()==0 ? 'Add Profile Image':''}} --}}


                    </td>
                </tr>
            @empty
                <tr class="span-10">No Records</tr>

            @endforelse
        </tbody>
    </table>
    <div>
        {{$hobbies->links()}}
    </div>

</div>

In addition to this, there will be tabs that show additional data per row so instead of one large table that i have to scroll horizontally, a tab will switch to other data sets of additional related data while keeping the same pagination location.