From 2ea9de5ff269bb506af67a38bfd997ddd971df23 Mon Sep 17 00:00:00 2001 From: Dan Harrin Date: Mon, 2 Dec 2024 14:34:33 +0000 Subject: [PATCH 1/2] feature: Better relation manager tab customization --- .../Pages/Concerns/HasRelationManagers.php | 25 ++++++++----------- .../RelationManagers/RelationGroup.php | 24 ++++++++++++++++++ .../RelationManagers/RelationManager.php | 11 ++++++++ 3 files changed, 45 insertions(+), 15 deletions(-) diff --git a/packages/panels/src/Resources/Pages/Concerns/HasRelationManagers.php b/packages/panels/src/Resources/Pages/Concerns/HasRelationManagers.php index dec78b8700..a7d31cb697 100644 --- a/packages/panels/src/Resources/Pages/Concerns/HasRelationManagers.php +++ b/packages/panels/src/Resources/Pages/Concerns/HasRelationManagers.php @@ -71,6 +71,13 @@ trait HasRelationManagers return false; } + public function getContentTabComponent(): Tab + { + return Tab::make($this->getContentTabLabel()) + ->icon($this->getContentTabIcon()) + ->schema($this->getContentComponents()); + } + public function getContentTabLabel(): ?string { return null; @@ -121,21 +128,14 @@ trait HasRelationManagers $tabKey = strval($tabKey); if (blank($tabKey) && $hasCombinedRelationManagerTabsWithContent) { - return Tab::make($this->getContentTabLabel()) - ->icon($this->getContentTabIcon()) - ->schema($this->getContentComponents()); + return $this->getContentTabComponent(); } if ($manager instanceof RelationGroup) { $manager->ownerRecord($ownerRecord); $manager->pageClass(static::class); - return Tab::make($manager->getLabel()) - ->badge($manager->getBadge()) - ->badgeColor($manager->getBadgeColor()) - ->badgeTooltip($manager->getBadgeTooltip()) - ->icon($manager->getIcon()) - ->iconPosition($manager->getIconPosition()) + return $manager->getTabComponent() ->schema(fn (): array => collect($manager->getManagers()) ->map(fn ($groupedManager, $groupedManagerKey): Livewire => Livewire::make( $normalizedGroupedManagerClass = $this->normalizeRelationManagerClass($groupedManager), @@ -146,12 +146,7 @@ trait HasRelationManagers $normalizedManagerClass = $this->normalizeRelationManagerClass($manager); - return Tab::make($normalizedManagerClass::getTitle($ownerRecord, static::class)) - ->badge($normalizedManagerClass::getBadge($ownerRecord, static::class)) - ->badgeColor($normalizedManagerClass::getBadgeColor($ownerRecord, static::class)) - ->badgeTooltip($normalizedManagerClass::getBadgeTooltip($ownerRecord, static::class)) - ->icon($normalizedManagerClass::getIcon($ownerRecord, static::class)) - ->iconPosition($normalizedManagerClass::getIconPosition($ownerRecord, static::class)) + return $normalizedManagerClass::getTabComponent($ownerRecord, static::class) ->schema(fn (): array => [ Livewire::make( $normalizedManagerClass, diff --git a/packages/panels/src/Resources/RelationManagers/RelationGroup.php b/packages/panels/src/Resources/RelationManagers/RelationGroup.php index 33618e5727..ac87500d6a 100644 --- a/packages/panels/src/Resources/RelationManagers/RelationGroup.php +++ b/packages/panels/src/Resources/RelationManagers/RelationGroup.php @@ -3,6 +3,7 @@ namespace Filament\Resources\RelationManagers; use Closure; +use Filament\Schemas\Components\Tabs\Tab; use Filament\Support\Components\Component; use Filament\Support\Concerns\HasIcon; use Illuminate\Database\Eloquent\Model; @@ -21,6 +22,8 @@ class RelationGroup extends Component protected ?string $pageClass = null; + protected ?Closure $modifyTabUsing = null; + /** * @param array | RelationManagerConfiguration> $managers */ @@ -80,6 +83,13 @@ class RelationGroup extends Component return $this->evaluate($this->label); } + public function tab(?Closure $callback): static + { + $this->modifyTabUsing = $callback; + + return $this; + } + /** * @return array | RelationManagerConfiguration> */ @@ -164,4 +174,18 @@ class RelationGroup extends Component default => parent::resolveDefaultClosureDependencyForEvaluationByType($parameterType), }; } + + public function getTabComponent(): Tab + { + $tab = Tab::make($this->getLabel()) + ->badge($this->getBadge()) + ->badgeColor($this->getBadgeColor()) + ->badgeTooltip($this->getBadgeTooltip()) + ->icon($this->getIcon()) + ->iconPosition($this->getIconPosition()); + + return $this->evaluate($this->modifyTabUsing, [ + 'tab' => $tab, + ]) ?? $tab; + } } diff --git a/packages/panels/src/Resources/RelationManagers/RelationManager.php b/packages/panels/src/Resources/RelationManagers/RelationManager.php index 18ba579549..62b3544760 100644 --- a/packages/panels/src/Resources/RelationManagers/RelationManager.php +++ b/packages/panels/src/Resources/RelationManagers/RelationManager.php @@ -13,6 +13,7 @@ use Filament\Resources\Concerns\InteractsWithRelationshipTable; use Filament\Resources\Pages\ViewRecord; use Filament\Schemas\Components\RenderHook; use Filament\Schemas\Components\TableBuilder; +use Filament\Schemas\Components\Tabs\Tab; use Filament\Schemas\Schema; use Filament\Support\Concerns\CanBeLazy; use Filament\Support\Enums\IconPosition; @@ -136,6 +137,16 @@ class RelationManager extends Component implements Actions\Contracts\HasActions, return []; } + public static function getTabComponent(Model $ownerRecord, string $pageClass): Tab + { + return Tab::make(static::class::getTitle($ownerRecord, $pageClass)) + ->badge(static::class::getBadge($ownerRecord, $pageClass)) + ->badgeColor(static::class::getBadgeColor($ownerRecord, $pageClass)) + ->badgeTooltip(static::class::getBadgeTooltip($ownerRecord, $pageClass)) + ->icon(static::class::getIcon($ownerRecord, $pageClass)) + ->iconPosition(static::class::getIconPosition($ownerRecord, $pageClass)); + } + public static function getIcon(Model $ownerRecord, string $pageClass): ?string { return static::$icon; From 7cf83ce360f6492a6ac830ab4e381fbfafd02e9c Mon Sep 17 00:00:00 2001 From: Dan Harrin Date: Mon, 2 Dec 2024 14:53:02 +0000 Subject: [PATCH 2/2] tweaks & docs --- packages/forms/src/Components/Builder.php | 2 +- .../docs/02-resources/07-relation-managers.md | 97 +++++-------------- .../Pages/Concerns/HasRelationManagers.php | 6 +- .../Forms/Components/RuleBuilder.php | 4 +- 4 files changed, 30 insertions(+), 79 deletions(-) diff --git a/packages/forms/src/Components/Builder.php b/packages/forms/src/Components/Builder.php index 9b46802137..a1cde2ac78 100644 --- a/packages/forms/src/Components/Builder.php +++ b/packages/forms/src/Components/Builder.php @@ -681,7 +681,7 @@ class Builder extends Field implements CanConcealComponents, HasExtraItemActions $component->partiallyRender(); }) ->iconButton() - ->icon('heroicon-s-cog-6-tooth') + ->icon('heroicon-m-cog-6-tooth') ->size(ActionSize::Small) ->visible(fn (Builder $component): bool => (! $component->isDisabled()) && $component->hasBlockPreviews()); diff --git a/packages/panels/docs/02-resources/07-relation-managers.md b/packages/panels/docs/02-resources/07-relation-managers.md index 4e3f1e4735..4459e526ad 100644 --- a/packages/panels/docs/02-resources/07-relation-managers.md +++ b/packages/panels/docs/02-resources/07-relation-managers.md @@ -662,14 +662,17 @@ public function hasCombinedRelationManagerTabsWithContent(): bool } ``` -### Setting an icon for the form tab +### Customizing the content tab -On the Edit or View page class, override the `getContentTabIcon()` method: +On the Edit or View page class, override the `getContentTabComponent()` method, and use any [Tab](../../schemas/layout/tabs) customization methods: ```php -public function getContentTabIcon(): ?string +use Filament\Schemas\Components\Tabs\Tab; + +public function getContentTabComponent(): Tab { - return 'heroicon-m-cog'; + return Tab::make('Settings') + ->icon('heroicon-m-cog'); } ``` @@ -686,91 +689,39 @@ public function getContentTabPosition(): ?ContentTabPosition } ``` -## Adding badges to relation manager tabs +## Customizing relation manager tabs -You can add a badge to a relation manager tab by setting the `$badge` property: - -```php -protected static ?string $badge = 'new'; -``` - -Alternatively, you can override the `getBadge()` method: +To customize the tab for a relation manager, override the `getTabComponent()` method, and use any [Tab](../../schemas/layout/tabs) customization methods: ```php +use Filament\Schemas\Components\Tabs\Tab; use Illuminate\Database\Eloquent\Model; -public static function getBadge(Model $ownerRecord, string $pageClass): ?string +public static function getTabComponent(Model $ownerRecord, string $pageClass): Tab { - return static::$badge; + return Tab::make('Blog posts') + ->badge($ownerRecord->posts()->count()) + ->badgeColor('info') + ->badgeTooltip('The number of posts in this category') + ->icon('heroicon-m-document-text'); } ``` -Or, if you are using a [relation group](#grouping-relation-managers), you can use the `badge()` method: +If you are using a [relation group](#grouping-relation-managers), you can use the `tab()` method: ```php use Filament\Resources\RelationManagers\RelationGroup; - -RelationGroup::make('Contacts', [ - // ... -])->badge('new'); -``` - -### Changing the color of relation manager tab badges - -If a badge value is defined, it will display using the primary color by default. To style the badge contextually, set the `$badgeColor` to be a [registered color](../../styling/colors): - -```php -protected static ?string $badgeColor = 'danger'; -``` - -Alternatively, you can override the `getBadgeColor()` method: - -```php +use Filament\Schemas\Components\Tabs\Tab; use Illuminate\Database\Eloquent\Model; -public static function getBadgeColor(Model $ownerRecord, string $pageClass): ?string -{ - return 'danger'; -} -``` - -Or, if you are using a [relation group](#grouping-relation-managers), you can use the `badgeColor()` method: - -```php -use Filament\Resources\RelationManagers\RelationGroup; - RelationGroup::make('Contacts', [ // ... -])->badgeColor('danger'); -``` - -### Adding a tooltip to relation manager tab badges - -If a badge value is defined, you can add a tooltip to it by setting the `$badgeTooltip` property: - -```php -protected static ?string $badgeTooltip = 'There are new posts'; -``` - -Alternatively, you can override the `getBadgeTooltip()` method: - -```php -use Illuminate\Database\Eloquent\Model; - -public static function getBadgeTooltip(Model $ownerRecord, string $pageClass): ?string -{ - return 'There are new posts'; -} -``` - -Or, if you are using a [relation group](#grouping-relation-managers), you can use the `badgeTooltip()` method: - -```php -use Filament\Resources\RelationManagers\RelationGroup; - -RelationGroup::make('Contacts', [ - // ... -])->badgeTooltip('There are new posts'); +]) + ->tab(fn (Model $ownerRecord): Tab => Tab::make('Blog posts') + ->badge($ownerRecord->posts()->count()) + ->badgeColor('info') + ->badgeTooltip('The number of posts in this category') + ->icon('heroicon-m-document-text')); ``` ## Sharing a resource's form and table with a relation manager diff --git a/packages/panels/src/Resources/Pages/Concerns/HasRelationManagers.php b/packages/panels/src/Resources/Pages/Concerns/HasRelationManagers.php index a7d31cb697..59cbdaaec8 100644 --- a/packages/panels/src/Resources/Pages/Concerns/HasRelationManagers.php +++ b/packages/panels/src/Resources/Pages/Concerns/HasRelationManagers.php @@ -74,8 +74,7 @@ trait HasRelationManagers public function getContentTabComponent(): Tab { return Tab::make($this->getContentTabLabel()) - ->icon($this->getContentTabIcon()) - ->schema($this->getContentComponents()); + ->icon($this->getContentTabIcon()); } public function getContentTabLabel(): ?string @@ -128,7 +127,8 @@ trait HasRelationManagers $tabKey = strval($tabKey); if (blank($tabKey) && $hasCombinedRelationManagerTabsWithContent) { - return $this->getContentTabComponent(); + return $this->getContentTabComponent() + ->schema($this->getContentComponents()); } if ($manager instanceof RelationGroup) { diff --git a/packages/tables/src/Filters/QueryBuilder/Forms/Components/RuleBuilder.php b/packages/tables/src/Filters/QueryBuilder/Forms/Components/RuleBuilder.php index b713c292a3..be929431f6 100644 --- a/packages/tables/src/Filters/QueryBuilder/Forms/Components/RuleBuilder.php +++ b/packages/tables/src/Filters/QueryBuilder/Forms/Components/RuleBuilder.php @@ -69,7 +69,7 @@ class RuleBuilder extends Builder ]) ->addAction(fn (Action $action) => $action ->label(__('filament-tables::filters/query-builder.actions.add_rule_group.label')) - ->icon('heroicon-s-plus')) + ->icon('heroicon-m-plus')) ->labelBetweenItems(__('filament-tables::filters/query-builder.item_separators.or')) ->collapsible() ->expandAllAction(fn (Action $action) => $action->hidden()) @@ -112,7 +112,7 @@ class RuleBuilder extends Builder }) ->addAction(fn (Action $action) => $action ->label(__('filament-tables::filters/query-builder.actions.add_rule.label')) - ->icon('heroicon-s-plus')) + ->icon('heroicon-m-plus')) ->addBetweenAction(fn (Action $action) => $action->hidden()) ->label(__('filament-tables::filters/query-builder.form.rules.label')) ->hiddenLabel()