Filament•3mo ago

Grid not applying to Section

applying grid to section in modal not working as expected wanted to set it to 4 columns but it shows as 1 column instead

protected static function getPermissionForm($permissions, int $grid)
    {
        return [
            Forms\Components\Grid::make($grid)
                ->schema($permissions->map(fn ($permission) => Forms\Components\Section::make($permission->original_name ?? 'Permission')->schema([
                    Forms\Components\Select::make("permission.{$permission->id}.role_ids")
                        ->label('Select Role(s)')
                        ->multiple()
                        ->options(PermissionAssignmentService::getRoleOptions())
                        ->searchable()
                        ->default($permission->roles->pluck('id')->toArray()),
                ]))->toArray()),
        ];
    }

protected static function getPermissionForm($permissions, int $grid)
    {
        return [
            Forms\Components\Grid::make($grid)
                ->schema($permissions->map(fn ($permission) => Forms\Components\Section::make($permission->original_name ?? 'Permission')->schema([
                    Forms\Components\Select::make("permission.{$permission->id}.role_ids")
                        ->label('Select Role(s)')
                        ->multiple()
                        ->options(PermissionAssignmentService::getRoleOptions())
                        ->searchable()
                        ->default($permission->roles->pluck('id')->toArray()),
                ]))->toArray()),
        ];
    }

4 Replies

RollandOP•3mo ago

protected static function getPermissionAssignmentBulkAction(
        ?string $name = null,
        string $icon = 'heroicon-o-shield-check',
        $color = null,
        MaxWidth|string|null $width = MaxWidth::Screen
    ): BulkAction {
        return BulkAction::make($name ?? 'managePermissions')
            ->label('Manage Permissions')
            ->icon($icon)
            ->color($color ?? 'primary')
            ->modalHeading('Manage Permissions for Roles')
            ->modalWidth($width)
            ->form(fn ($records) => self::getPermissionForm($records->flatMap(fn ($record) => $record->permissions), 4))
            ->action(function (array $data, $records) {
                $permissions = $records->flatMap(fn ($record) => $record->permissions);
                $changedPermissionsCount = self::countChangedPermissions($permissions, $data['permissions']);

                if ($changedPermissionsCount > 5) {
                    ProcessBulkPermissionAssignment::dispatch($permissions, $data['permissions']);
                    Notification::make()
                        ->title('Bulk Permission Update Queued')
                        ->body("Your request to update {$changedPermissionsCount} permissions has been queued and will be processed shortly.")
                        ->success()
                        ->send();
                } else {
                    PermissionAssignmentService::managePermissionsForRoles($permissions, $data['permissions']);
                }
            })
            ->deselectRecordsAfterCompletion()
            ->slideOver();
    }

protected static function getPermissionAssignmentBulkAction(
        ?string $name = null,
        string $icon = 'heroicon-o-shield-check',
        $color = null,
        MaxWidth|string|null $width = MaxWidth::Screen
    ): BulkAction {
        return BulkAction::make($name ?? 'managePermissions')
            ->label('Manage Permissions')
            ->icon($icon)
            ->color($color ?? 'primary')
            ->modalHeading('Manage Permissions for Roles')
            ->modalWidth($width)
            ->form(fn ($records) => self::getPermissionForm($records->flatMap(fn ($record) => $record->permissions), 4))
            ->action(function (array $data, $records) {
                $permissions = $records->flatMap(fn ($record) => $record->permissions);
                $changedPermissionsCount = self::countChangedPermissions($permissions, $data['permissions']);

                if ($changedPermissionsCount > 5) {
                    ProcessBulkPermissionAssignment::dispatch($permissions, $data['permissions']);
                    Notification::make()
                        ->title('Bulk Permission Update Queued')
                        ->body("Your request to update {$changedPermissionsCount} permissions has been queued and will be processed shortly.")
                        ->success()
                        ->send();
                } else {
                    PermissionAssignmentService::managePermissionsForRoles($permissions, $data['permissions']);
                }
            })
            ->deselectRecordsAfterCompletion()
            ->slideOver();
    }

Wrax•3mo ago

Have you tried defining ->columnSpan(1) on the Grid's child fields? Assuming your $grid is equal to 4. You might also be better off passing an array so you can explicitly set responsive breakpoints & override the 'default'

`use Filament\Infolists\Components\Grid;
 
Grid::make([
    'default' => 1,
    'sm' => 2,
    'md' => 3,
    'lg' => 4,
    'xl' => 6,
    '2xl' => 8,
])
    ->schema([
        // ...
    ])

`use Filament\Infolists\Components\Grid;
 
Grid::make([
    'default' => 1,
    'sm' => 2,
    'md' => 3,
    'lg' => 4,
    'xl' => 6,
    '2xl' => 8,
])
    ->schema([
        // ...
    ])

more: https://filamentphp.com/docs/3.x/infolists/layout/grid#grid-component

Grid - Infolist Builder - Filament

toeknee•3mo ago

 Forms\Components\Grid::make($grid)
                ->columns(4)
                ->schema($permissions->map(fn ($permission) => Forms\Components\Section::make($permission->original_name ?? 'Permission')->schema([
                    Forms\Components\Select::make("permission.{$permission->id}.role_ids")
                        ->label('Select Role(s)')
                        ->multiple()
                        ->columnSpan(1)
                        ->options(PermissionAssignmentService::getRoleOptions())
                        ->searchable()
                        ->default($permission->roles->pluck('id')->toArray()),
                ]))->toArray()),

 Forms\Components\Grid::make($grid)
                ->columns(4)
                ->schema($permissions->map(fn ($permission) => Forms\Components\Section::make($permission->original_name ?? 'Permission')->schema([
                    Forms\Components\Select::make("permission.{$permission->id}.role_ids")
                        ->label('Select Role(s)')
                        ->multiple()
                        ->columnSpan(1)
                        ->options(PermissionAssignmentService::getRoleOptions())
                        ->searchable()
                        ->default($permission->roles->pluck('id')->toArray()),
                ]))->toArray()),

RollandOP•3mo ago

Thank you. But I manage to make it work on my end. Turns out I just need to add the ->columnSpan(1) on the Section component.

Gaming

Programming

Grid not applying to Section