F
Filament•2w ago
oculorum

Problem with Viewing Related Records in RelationManager

I’m experiencing an issue with displaying the preview of a record from the list rendered by the RelationManager component in my application. My goal is to have a view that shows both the main record’s details and a list of related records. To achieve this, I used the ViewRecord component for the main record and RelationManager for the related entries. I embedded everything into a Blade template, passing the appropriate view to ViewRecord (using the $view variable). The basic functionality works correctly—I can see both the main record’s details and the list of related entries. However, the problem arises when I try to preview one of the related records from the RelationManager’s list. When I click the preview icon, a loading spinner appears, but nothing else happens—the preview modal does not open. Additionally, if there are multiple entries in the list, clicking the preview icon for one record causes the loading spinner to appear for all entries, and the eye icon disappears everywhere. Has anyone encountered a similar issue or has any ideas on how to resolve this? I’m wondering if the problem might be related to how the components are embedded in the Blade template, a JavaScript conflict, or improper state handling for the preview modals. Any suggestions or guidance would be greatly appreciated!
1 Reply
oculorum
oculorumOP•2w ago
class ViewDataImport extends ViewRecord
{
    protected static string $resource = DataImportResource::class;

    protected static string $view = 'filament.admin.data-import.view-data-import';

    public function infolist(Infolist $infolist): Infolist
    {
        return $infolist
            ->schema(components: [
                Infolists\Components\Section::make(heading: __(key: 'filament/admin.sections.basic_information'))
                    ->schema(components: [
                        Infolists\Components\Grid::make()
                            ->schema(components: [
                                Infolists\Components\TextEntry::make(name: 'file_path')
                                    ->label(label: __(key: 'filament/admin.attributes.file_path')),
                                Infolists\Components\TextEntry::make(name: 'status')
                                    ->label(label: __(key: 'filament/common.attributes.status'))
                                    ->badge(),
                            ])
                            ->columns(columns: 3),
                        Infolists\Components\TextEntry::make(name: 'total_rows')
                            ->label(label: __(key: 'filament/admin.attributes.total_rows'))
                            ->numeric(),
                        Infolists\Components\TextEntry::make(name: 'success_count')
                            ->label(label: __(key: 'filament/admin.attributes.success_count'))
                            ->numeric(),
                        Infolists\Components\TextEntry::make(name: 'failure_count')
                            ->label(label: __(key: 'filament/admin.attributes.failure_count'))
                            ->numeric(),
                    ])
                    ->columns(columns: 3),
            ]);
    }
}
class ViewDataImport extends ViewRecord
{
    protected static string $resource = DataImportResource::class;

    protected static string $view = 'filament.admin.data-import.view-data-import';

    public function infolist(Infolist $infolist): Infolist
    {
        return $infolist
            ->schema(components: [
                Infolists\Components\Section::make(heading: __(key: 'filament/admin.sections.basic_information'))
                    ->schema(components: [
                        Infolists\Components\Grid::make()
                            ->schema(components: [
                                Infolists\Components\TextEntry::make(name: 'file_path')
                                    ->label(label: __(key: 'filament/admin.attributes.file_path')),
                                Infolists\Components\TextEntry::make(name: 'status')
                                    ->label(label: __(key: 'filament/common.attributes.status'))
                                    ->badge(),
                            ])
                            ->columns(columns: 3),
                        Infolists\Components\TextEntry::make(name: 'total_rows')
                            ->label(label: __(key: 'filament/admin.attributes.total_rows'))
                            ->numeric(),
                        Infolists\Components\TextEntry::make(name: 'success_count')
                            ->label(label: __(key: 'filament/admin.attributes.success_count'))
                            ->numeric(),
                        Infolists\Components\TextEntry::make(name: 'failure_count')
                            ->label(label: __(key: 'filament/admin.attributes.failure_count'))
                            ->numeric(),
                    ])
                    ->columns(columns: 3),
            ]);
    }
}
class ImportedRowsRelationManager extends RelationManager
{
    protected static string $relationship = 'dataImportedRows';

    public function table(Table $table): Table
    {
        return $table
            ->recordTitleAttribute(attribute: 'data')
            ->columns(components: [
                Tables\Columns\TextColumn::make(name: 'error_message')
                    ->label(label: __(key: 'filament/admin.attributes.error_message'))
                    ->wrap(),
                Tables\Columns\TextColumn::make(name: 'processed_at')
                    ->label(label: __(key: 'filament/common.timestamps.processed_at'))
                    ->sortable(),
            ])
            ->filters(filters: [
            ])
            ->headerActions(actions: [
            ])
            ->actions(actions: [
                Tables\Actions\ViewAction::make()
                    ->infolist(infolist: static function (Infolist $infolist, Model $record): Infolist {
                        return $infolist
                            ->schema(components: [
                                Infolists\Components\TextEntry::make(name: 'error_message')
                                    ->label(__(key: 'filament/admin.attributes.error_message')),
                                Infolists\Components\IconEntry::make(name: 'is_valid')
                                    ->label(__(key: 'filament/admin.attributes.is_valid'))
                                    ->boolean(),
                            ]);
                    }),
            ])
            ->bulkActions(actions: [
            ]);
    }
}
class ImportedRowsRelationManager extends RelationManager
{
    protected static string $relationship = 'dataImportedRows';

    public function table(Table $table): Table
    {
        return $table
            ->recordTitleAttribute(attribute: 'data')
            ->columns(components: [
                Tables\Columns\TextColumn::make(name: 'error_message')
                    ->label(label: __(key: 'filament/admin.attributes.error_message'))
                    ->wrap(),
                Tables\Columns\TextColumn::make(name: 'processed_at')
                    ->label(label: __(key: 'filament/common.timestamps.processed_at'))
                    ->sortable(),
            ])
            ->filters(filters: [
            ])
            ->headerActions(actions: [
            ])
            ->actions(actions: [
                Tables\Actions\ViewAction::make()
                    ->infolist(infolist: static function (Infolist $infolist, Model $record): Infolist {
                        return $infolist
                            ->schema(components: [
                                Infolists\Components\TextEntry::make(name: 'error_message')
                                    ->label(__(key: 'filament/admin.attributes.error_message')),
                                Infolists\Components\IconEntry::make(name: 'is_valid')
                                    ->label(__(key: 'filament/admin.attributes.is_valid'))
                                    ->boolean(),
                            ]);
                    }),
            ])
            ->bulkActions(actions: [
            ]);
    }
}
<x-filament-panels::page>
    @if ($this->hasInfolist())
        {{ $this->infolist }}
    @else
        {{ $this->form }}
    @endif

    @if (count($relationManagers = $this->getRelationManagers()))
        <x-filament-panels::resources.relation-managers
            :active-manager="$this->activeRelationManager"
            :managers="$relationManagers"
            :owner-record="$record"
            :page-class="static::class"
        />
    @endif
</x-filament-panels::page>
<x-filament-panels::page>
    @if ($this->hasInfolist())
        {{ $this->infolist }}
    @else
        {{ $this->form }}
    @endif

    @if (count($relationManagers = $this->getRelationManagers()))
        <x-filament-panels::resources.relation-managers
            :active-manager="$this->activeRelationManager"
            :managers="$relationManagers"
            :owner-record="$record"
            :page-class="static::class"
        />
    @endif
</x-filament-panels::page>

Did you find this page helpful?