Header toolbar: fix spacing, persist search in URL, clean up filters#96
Merged
ManukMinasyan merged 4 commits into4.xfrom Mar 16, 2026
Merged
Header toolbar: fix spacing, persist search in URL, clean up filters#96ManukMinasyan merged 4 commits into4.xfrom
ManukMinasyan merged 4 commits into4.xfrom
Conversation
When `->headerToolbar()` is enabled on a Board, the filter trigger
and search field render inline with the page heading instead of in
a separate row between the title and columns.
This uses Filament's native `getHeader()` override in the BaseBoard
trait to render a custom header view that combines:
- Page heading + subheading
- Filter dropdown (right-aligned)
- Search field (right-aligned)
- Active filter indicator badges (below heading)
Usage:
```php
return $board
->headerToolbar()
->query(...)
->columns(...)
```
The default behavior (no headerToolbar) is unchanged — filters
render in their own row above the board columns.
Inline filter/search in the page header is now the default for all boards. Opt out with `->headerToolbar(false)` for the classic stacked layout. This is a breaking change appropriate for the 4.x major version.
- Remove nested fi-page-header-main-ctn wrapper that caused double padding on board page headers vs resource list pages - Persist search query in URL via queryString() method on BoardPage and BoardResourcePage (matches existing filter URL persistence) - Remove redundant "remove all filters" button from indicator row since the filter dropdown already provides a Reset action - Use gap-x-5 instead of gap-5 on board column container
ManukMinasyan
force-pushed
the
feat/header-toolbar
branch
from
f831a92 to
4d5f88f
Compare
There was a problem hiding this comment.
Pull request overview
Adds an optional “header toolbar” mode for Flowforge boards in Filament pages, moving the filters/search UI into the page header and introducing a cleaner search query-string key for board search state.
Changes:
- Introduces
Board::headerToolbar()/hasHeaderToolbar()and passes the flag into the board view config. - Overrides Filament page header rendering (when enabled) via a new
board-headerBlade view that renders heading + inline filters/search. - Adds query-string mapping so board table search state uses
?search=(and updates docs accordingly).
Reviewed changes
Copilot reviewed 4 out of 4 changed files in this pull request and generated 2 comments.
Show a summary per file
| File | Description |
|---|---|
| src/Concerns/BaseBoard.php | Adds getHeader() override to swap header rendering when header toolbar is enabled. |
| src/Board.php | Adds headerToolbar() API + exposes flag to the board view config. |
| src/BoardPage.php | Adds query-string mapping for board search (tableSearch → search). |
| src/BoardResourcePage.php | Same query-string mapping for resource-based board pages. |
| resources/views/index.blade.php | Skips rendering the existing filters partial when header toolbar mode is enabled. |
| resources/views/filament/pages/board-page.blade.php | Adjusts container stacking context (relative + z-index). |
| resources/views/filament/pages/board-header.blade.php | New header layout rendering title + inline filters/search + indicators. |
| docs/content/2.essentials/4.api-reference.md | Documents the new headerToolbar() method. |
| docs/content/2.essentials/2.customization.md | Adds customization guidance and layout constraints for header toolbar. |
Comments suppressed due to low confidence (1)
resources/views/index.blade.php:21
- When
headerToolbaris enabled this skips rendering the full filters view entirely. The newboard-headerview only renders filter UI forDropdown/Modallayouts, so enablingheaderToolbar()with any otherFiltersLayoutwill result in filters not being rendered anywhere. Consider enforcing compatibility in code (e.g., haveBoard::hasHeaderToolbar()return false unless the current filters layout is supported, or render the standard filters partial as a fallback for unsupported layouts) so users can’t accidentally lose filter controls.
@unless($config['headerToolbar'] ?? false)
@include('flowforge::components.filters')
@endunless
💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.
Comment on lines
+36
to
+44
| /** | ||
| * @return array<string, array<string, mixed>> | ||
| */ | ||
| protected function queryString(): array | ||
| { | ||
| return [ | ||
| 'tableSearch' => ['as' => 'search', 'except' => ''], | ||
| ]; | ||
| } |
Comment on lines
+44
to
53
| * @return array<string, array<string, mixed>> | ||
| */ | ||
| protected function queryString(): array | ||
| { | ||
| return [ | ||
| 'tableSearch' => ['as' => 'search', 'except' => ''], | ||
| ]; | ||
| } | ||
|
|
||
| /** |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
Summary
fi-page-header-main-ctnwrapper causing board page headings to sit 18px lower than resource list pages?search=term) matching existing filter URL persistenceChanges
Header spacing fix
The
board-header.blade.phpwas wrapping content in<div class="fi-page-header-main-ctn">which created a nested container inside Filament's own.fi-page-header-main-ctnfrom<x-filament-panels::page>. This caused double padding (32px outer + 16px inner = heading at 106px vs 88px on resource pages). Replaced with a plainflex flex-col.Search URL persistence
Added
queryString()method toBoardPageandBoardResourcePagethat maps$tableSearchto?search=URL parameter. Uses Livewire'squeryString()method (not#[Url]attribute) to avoid type conflict with Filament's untyped$tableSearchproperty inCanSearchRecordstrait.Filter indicator cleanup
Removed the standalone "remove all" X icon button from the filter indicators row. The filter dropdown already has a "Reset" action, making the button redundant. Individual filter badge dismiss buttons are preserved.
Test plan