feat(frontend): Add persistant filtered detail navigation in the url (#12585)

* Add filtered detail navigation

* Satisfy navigation lint checks

* Fix missing Fragment import in PageDetail

* Address detail navigation review feedback

* Move detail navigation into breadcrumb bar

* Address URL and layout review feedback

* Address detail navigation review feedback

* fix doclinks

* test: update stock return validation assertion

* fix: keep detail navigation actions stable

* style: apply biome formatting

* fix: use ActionIcon disabled state

* test: use ActionIcon disabled state

* fix: isolate detail navigation query params

---------

Co-authored-by: Matthias Mair <code@mjmair.com>
Co-authored-by: Oliver <oliver.henry.walters@gmail.com>
This commit is contained in:
Jɤ KέϞϞψ
2026-08-19 17:01:51 +10:00
committed by GitHub
co-authored by Matthias Mair Oliver
parent 8f1bb69eba
commit 16ca6c245f
11 changed files with 873 additions and 77 deletions
+10 -2
View File
@@ -24,8 +24,8 @@ From the main menu, users can access the following items:
- [Dashboard](#dashboard)
- [Global Search](./global_search.md)
- [Spotlight](#spotlight)
- [Barcode Scanning](#barcode-scanning)
- [Notifications](#notifications)
- [Barcode Scanning](../../barcodes/index.md#quick-scan)
- [Notifications](../../part/notification.md)
- [User Menu](#user-menu)
As well as allowing navigation to the following main sections:
@@ -84,6 +84,14 @@ On some pages, a breadcrumb navigation trail is provided at the top of the page,
{{ image("concepts/ui_breadcrumbs.png", "Breadcrumb Navigation") }}
#### Filtered Detail Navigation
When a detail page is opened from a table that supports detail navigation, the breadcrumb bar can show the current position in the table result set together with Previous and Next buttons. The navigation uses the table's active filters and sort order, so moving between records follows the same list the user was viewing.
The navigation context is stored in the detail URL. This makes links shareable and allows the same filtered result set to be restored when the link is opened in a fresh browser context. The position indicator uses the full result count, while the buttons are hidden at the first and last records.
The navigation controls also work with detail pages provided by frontend plugins that use the standard table and page components.
### Navigation Tree
On some pages, a navigation tree is provided on the left-hand side of the page, next to the breadcrumbs. The navigation tree provides a hierarchical view of the current section of the system, allowing users to quickly navigate to related pages and sections.