F
Filament•2w ago
renatoalvarez

Moving Filament Repeater addAction to Actions Toolbar

Hey everyone! I’m using Repeater component and I need to move addAction button out of the repeater body and into the actions toolbar on the right. By default it renders inline, but I’d like it to live alongside the other action buttons (like Delete/Clone) on the right-hand side.
No description
2 Replies
awcodes
awcodes•2w ago
Only way to do this would be to override the view, which isn’t recommended but can be done if you’re willing to manually keep up with any changes across releases.
Omar Alnabris
Omar Alnabris•2w ago
You can achieve this using ->extraItemActions() on your repeater to insert a new item after the currently clicked one. Here’s an example: 
Repeater::make('members')
    ->schema([
        // your repeater fields
    ])
    ->extraItemActions([
        Action::make('addNewItem')
            ->icon('heroicon-m-plus')
            ->action(function (array $arguments, Repeater $component): void {
                $newUuid = Str::uuid()->toString();
                $items = $component->getState();
                $newItems = [];

                foreach ($items as $key => $value) {
                    $newItems[$key] = $value;
                    
                    if ($key === $arguments['item']) {
                            $newItems[$newUuid] = [];
                    }
                }

                $component->state($newItems);
                $component->getChildComponentContainer($newUuid)->fill();
                $component->callAfterStateUpdated();
            }),
    ])
    ->addable(false);
Repeater::make('members')
    ->schema([
        // your repeater fields
    ])
    ->extraItemActions([
        Action::make('addNewItem')
            ->icon('heroicon-m-plus')
            ->action(function (array $arguments, Repeater $component): void {
                $newUuid = Str::uuid()->toString();
                $items = $component->getState();
                $newItems = [];

                foreach ($items as $key => $value) {
                    $newItems[$key] = $value;
                    
                    if ($key === $arguments['item']) {
                            $newItems[$newUuid] = [];
                    }
                }

                $component->state($newItems);
                $component->getChildComponentContainer($newUuid)->fill();
                $component->callAfterStateUpdated();
            }),
    ])
    ->addable(false);

Did you find this page helpful?