Empty states break Vue prop validation rules

[imacrayon]

If the contacts table happens to be empty the Contacts index page will not render because the empty collection is json_encode'd to an array and the Vue component is expecting the prop to be an object.

I found that chaining a whenEmpty after the transform fixes this issue, but it feels kind of dirty...

public function index()
{
    return Inertia::render('Contacts/Index', [
        ...
        'contacts' => Auth::user()->account->contacts()
            ...
            ->paginate()
            ->transform(function ($contact) {
                return [
                    ...
                ];
            })->whenEmpty(function ($collection) {
                return $collection->put('data', []);
            }),
    ]);
}

Is there a better was to get to get the empty states for pages like this working?

[imacrayon]

False alarm - my test was missing the registerLengthAwarePaginator in the AppServiceProvider