Categories Table - Toggle Active

How can we apply a newer @checked blade directive?

Getting Error

Attempt to read property "index" on null

I thank something is missing, but What, and where should it be?

Why are we creating an in-memory dictionary (an associative array with same structure for all key-value pairs) to hold the value from each category's is_active property?

Couldn't we just bind the toggling to the is_active of the current iterated $category inside the loop?

I did that and got the same result, with more performance and readability: the active array does not need to be recreated on every update in $categories; the toggleIsActive receives as argument the $category itself rather than its id (thus no need to fetch it in the database: we just update it directly).

e.g:

public function activeToggle(Category $category)
{
    $category->update(['is_active' => !$category->is_active]);
}

<input
      type="checkbox"
      id="is-active-{{ $category->id }}"
      wire:key="is-active-{{ $category->id }}"
      wire:click="activeToggle({{ $category }})"
      wire:loading.attr="disabled"
      {{ $category->is_active ? 'checked' : '' }}
      class="sr-only peer"/>