wire-elements / spotlight

Livewire component that brings Spotlight/Alfred-like functionality to your Laravel application.
MIT License
927 stars 72 forks source link

ID is not defined when searching #123

Closed HarrisonHBHR closed 1 month ago

HarrisonHBHR commented 1 year ago

I've got ther inital setup of spotlight working being able to use the Ctrl + k or / to open the window. I have then created a new class using the artisan command and based the logic off the Logout command in the readme.


use Illuminate\Contracts\Auth\StatefulGuard;
use LivewireUI\Spotlight\Spotlight;
use LivewireUI\Spotlight\SpotlightCommand;

class Logout extends SpotlightCommand
{
    protected string $name = 'Logout';

    protected string $description = 'Logout out of your account';

    public function execute(Spotlight $spotlight, StatefulGuard $guard): void
    {
        $guard->logout();
        $spotlight->redirect('/');
    }
}

My config is as following and references this class like so:

    'commands' => [
        \App\Spotlight\Logout::class
    ],

    /*
    |--------------------------------------------------------------------------
    | Include CSS
    |--------------------------------------------------------------------------
    |
    | Spotlight uses TailwindCSS, if you don't use TailwindCSS you will need
    | to set this parameter to true. This includes the modern-normalize css.
    |
    */
    'include_css' => true, 

I have excluded the other areas of the config as these are the default values. The Livewire componenet is being displayed and alpine.js CDN is being used.

When I go to search I get the following error:

Alpine Expression Error: id is not defined

Expression: "id"

 <template x-for=​"([{ item:​ { id, name, description }​}​, i]​)​ in filteredItems()​" :key=​"id">​…​</template>​
D @ alpine.js:1
(anonymous) @ alpine.js:1
Promise.catch (async)
(anonymous) @ alpine.js:1
I @ alpine.js:1
(anonymous) @ alpine.js:1
K @ alpine.js:1
(anonymous) @ alpine.js:1
I @ alpine.js:1
(anonymous) @ alpine.js:1
(anonymous) @ alpine.js:1
n @ alpine.js:1
u @ alpine.js:1
14:22:20.931 

I am using livewire 2.1, and php 7.4

Any help would be appreciated. Thanks