Rendering Livewire Table Using Wizard Step in Resource

Trying to display a table in multistep form Wizard. To Generate the table I am using Livewire component.
// Resource file code
 return [
            Wizard::make()
                ->steps([
                    Step::make('Select Channels')
                        ->schema([
                            TextInput::make('search')
                                ->label('Search Channels')
                                ->placeholder('Search channels...')
                                ->reactive()
                                ->afterStateUpdated(function ($state, $get, $set) {
                                }),
                            Forms\Components\ViewField::make('channelTable')
                                ->view('livewire.channel-table'), // Embed the Livewire component
                        ]),

// Livewire component.
class ChannelTable extends Component implements HasTable
{
    use Tables\Concerns\InteractsWithTable;
    public function table(Tables\Table $table): Tables\Table
    {
        return $table
            ->columns([CheckboxColumn::make('selected')
                    ->label('Select')
                    ->toggleable()
                    ->bulkToggleable(),
                TextColumn::make('name')
                    ->label('Channel Name')
                    ->sortable()
                    ->searchable(),
            ])
            ->filters([
                Tables\Filters\Filter::make('search')
                ->query(fn ($query, $search) => $query->where('name', 'like', "%{$search}%")),
            ])
            ->query(fn () => Channel::query()) 
            ->paginated(10) 
            ->defaultSort('name'); 
    }

    public function render()
    {
        return view('livewire.channel-table'); 
    }

    public function makeFilamentTranslatableContentDriver(): ?TranslatableContentDriver
    {
        return null; 
    }
}

//blade
 {{ $this->table }} 
loop_error.PNG
Was this page helpful?