(this page was created automatically. In case of formatting issues, please visit the official Wiki Page)
Local Navigation
Overview
Local Navigation helps users move within a specific product area or workflow. It complements Global Navigation by enabling navigation that is context-specific, task-oriented, and adaptive to the current dashboard or process step. While Global Navigation connects users to system-level destinations and cross-product areas, Local Navigation supports the “work inside the page”—helping users understand where they are in a flow, jump between related sections, and move forward or backward without losing context.
Local Navigation is intentionally dynamic and flexible. It does not need to exist everywhere in Edge.One. Simple applications might not require it at all. Local Navigation is introduced as soon as dashboards develop dependencies between each other—such as favorites, nodes, and multi-dashboard processes. Because it is limited to the current dashboard context, Local Navigation can vary between dashboards and should reflect the structure and needs of that area rather than forcing a one-size-fits-all approach.
Anatomy
Local Navigation is composed of a set of reusable navigation surfaces that appear within a dashboard to help users move through related content and workflows. These elements are chosen based on the complexity of the application area: some dashboards only need lightweight navigation (for example, breadcrumbs or in-content links), while others benefit from a persistent structure such as a Navigation Boardlet. The following sections describe the key components and how they work together to support both vertical drilldowns and horizontal, step-based flows.
Navigation Boardlet (link to page)
The Navigation Boardlet is an expandable navigation element placed on the far left of the dashboard, spanning from top to bottom of the page. It provides a collection of tools and links to different aspects of the current application area, usually presented as a list or a tree list. Navigation items are commonly organized into groups to improve scanning and to align with the information architecture.
The boardlet can include dynamic elements that update to reflect the current stage of the application or the user’s context For example, counters to the right of links can indicate the number of items in a library behind that link. By combining hierarchical structures with direct links, the Navigation Boardlet supports both horizontal navigation (moving between peer areas or steps) and vertical navigation (drilling down into deeper levels of detail).
Click here for more information on the Navigation Boardlet.
Breadcrumbs
Breadcrumbs show users their current location relative to the information architecture. They enable users to quickly move up to a parent level or return to a previous step. Breadcrumbs are always located in the left part of the header. Breadcrumbs support vertical navigation inside drilldowns and adjust based on the user’s current position in the structure.
All page items in the breadcrumb component are interactive and link to the corresponding pages. The go-back icon moves back one step at a time within the page structure.
Navigation Actions inside the Content
Navigation actions are navigation elements placed inside the dashboard content. They enable users to move through workflows and drilldowns directly from where they are working, rather than relying only on side navigation structures.
Common placements include:
- Buttons in toolbars
- Links and buttons within dashboard content
- Actions inside tables
- Actions from dialogs
Tables
Table navigation is commonly provided as part of row actions, usually in the last column. It typically routes users to a drilldown page (for example, a details view), representing vertical navigation to the next layer in the breadcrumb structure. The destination screen should provide a clear “back” option to return to the prior context.
Buttons and Links
Navigation can happen through buttons or links placed within the dashboard content, often to support process flows. They are commonly used for horizontal navigation through a sequence of steps. Typical examples include “Next” and “Back.” These actions usually appear in toolbars, footer bars, or at the bottom of the content and should be used sparingly to avoid clutter and conflicting navigation paths.
For more information, please go to the Wizard pattern
Dialogs
Dialog navigation is usually implemented through footer bar actions. It typically includes two directions:
- An option to return to the current page (“Back” or cancel/close).
- An option to move forward by initiating a process or confirming an action (for example, accept, submit, or continue), which often leads to a new page.
Depending on the action performed, dialog-based navigation can represent vertical navigation (to a deeper level) or horizontal navigation (to the next step in a flow).
