Skip to content

feat(navigation): add NavSection Holocene component#3263

Merged
KATIETOLER merged 14 commits intomainfrom
nav-groups/kt
Apr 6, 2026
Merged

feat(navigation): add NavSection Holocene component#3263
KATIETOLER merged 14 commits intomainfrom
nav-groups/kt

Conversation

@KATIETOLER
Copy link
Copy Markdown
Contributor

@KATIETOLER KATIETOLER commented Apr 1, 2026

Adds a NavGroup component to the Holocene design system so the cloud nav can compose independent groups of
nav items — enabling other elements to be placed between groups without modifying the OSS nav.

  • Add NavSection Holocene component to replace ad-hoc nav group rendering in SideNavigation
  • Split getLinkList into linkList (primary) and linkListForSecondGroup (secondary) in the OSS app layout
  • Tighten NavLinkItem types and clean up global.ts
  • Add secondaryLinkList prop to BottomNavigation/BottomNavLinks so secondary links render in the mobile
    menu
  • Add navContent?: Snippet prop to side-nav.svelte — when isCloud && navContent, renders the snippet
    instead of the inline {#each} loop; OSS path is completely unchanged
  • Wire NavGroup into the cloud nav path in +layout.svelte via {#snippet navContent()}
  • Refactor BottomNavigation and BottomNavLinks to accept a sections: NavLinkItem[][] API matching
    SideNavigation, replacing separate linkList/secondaryLinkList props; migrate both components to Svelte 5
    and render sections via NavSection with auto-inserted dividers

@vercel
Copy link
Copy Markdown

vercel bot commented Apr 1, 2026

The latest updates on your projects. Learn more about Vercel for GitHub.

Project Deployment Actions Updated (UTC)
holocene Ready Ready Preview, Comment Apr 6, 2026 2:56pm

Request Review

@temporal-cicd
Copy link
Copy Markdown
Contributor

temporal-cicd bot commented Apr 1, 2026

Warnings
⚠️

📊 Strict Mode: 1 error in 1 file (0.1% of 1085 total)

src/routes/(app)/+layout.svelte (1)
  • L62:23: Argument of type '(namespace: string) => { namespace: string; onClick: (namespace: string) => void; }' is not assignable to parameter of type '(value: string | null | undefined, index: number, array: (string | null | undefined)[]) => { namespace: string; onClick: (namespace: string) => void; }'.

Generated by 🚫 dangerJS against cfc2e3f

@KATIETOLER KATIETOLER changed the title feat(navigation): add NavGroup Holocene component feat(navigation): add NavSection Holocene component Apr 2, 2026
@Alex-Tideman Alex-Tideman self-requested a review April 3, 2026 13:27
Add nav-group.svelte to the Holocene design system. It accepts a
NavLinkListItem[] and renders NavigationItems with no wrapper element,
keeping items directly inside the parent role="list" container.

Wire it into the cloud nav path via a navContent snippet prop on
side-nav.svelte. When isCloud && navContent, the snippet renders
instead of the inline {#each} loop. The OSS nav path is unchanged —
it falls through to the existing loop as before.

This enables the cloud nav to compose multiple NavGroup instances
with other elements interleaved between them, which was not possible
with the single {#each} loop approach.
Remove the isCloud guard in side-nav.svelte so both OSS and cloud
nav use the navContent snippet path.

Split linkList at its divider into two derived arrays and render
them as separate NavGroups with an explicit <hr> between them.
This gives callers independent control over each section without
needing divider sentinels in the item arrays.
NavGroup only renders link items, not dividers, so typing navItems
as NavLinkListItem[] was too broad and required an isNavLinkItem
guard inside the template.

- Export NavLinkItem from global.ts
- Update NavGroup prop to NavLinkItem[], drop the type guard
- Filter linkListForFirstGroup/Second with isNavLinkItem so the
  derived slices satisfy the narrower type
Replace the single getLinkList function (which used a divider
sentinel to communicate group boundaries) with two explicit
functions: getNavPrimaryLinks and getNavSecondaryLinks.

- Remove NavDividerItem type and the divider sentinel item
- NavLinkListItem is now just an alias for NavLinkItem
- Divider rendering moves to the navContent snippet in the
  layout, where it belongs as a presentational concern
- Drop isNavLinkItem filter from derived values — no longer
  needed since both functions return NavLinkItem[] directly
Replace the flat linkList + navContent snippet pattern with a
typed sections array. SideNavigation now owns divider logic.

- Rename nav-group.svelte -> nav-section.svelte
- SideNavigation accepts sections: NavLinkItem[][] instead of
  linkList + navContent snippet
- Dividers rendered between sections, never after the last one
- Remove duplicate linkListForFirstGroup derived in layout
- Layout passes sections={[linkList, linkListForSecondGroup]}
@KATIETOLER KATIETOLER merged commit f5b2fab into main Apr 6, 2026
16 checks passed
@KATIETOLER KATIETOLER deleted the nav-groups/kt branch April 6, 2026 15:12
temporal-cicd bot pushed a commit that referenced this pull request Apr 10, 2026
Auto-generated version bump from 2.48.1 to 2.48.2

Specific version: 2.48.2

Changes included:
- [`92cd681e`](92cd681) Re-wire auth to use a provider pattern. Lots of tests remove cloud references (#3230)
- [`3d92202b`](3d92202) Use --top-nav-height CSS variable for sticky element positioning (#3250)
- [`16295986`](1629598) Bump saved view limits from 20 to 50 (#3254)
- [`a9fa0e91`](a9fa0e9) Display cron string instead of calendar spec when schedule has a cron string in comment field (#3241)
- [`f1811715`](f181171) use full for 100% instead of 100vh (#3256)
- [`0dfadd74`](0dfadd7) Add samples-ruby to workflows table empty state (#3259)
- [`d85d61a3`](d85d61a) Display human-readable schedule spec labels (#3261)
- [`b63049c5`](b63049c) Add invite icon to Holocene design system (#3262)
- [`00c6418c`](00c6418) Bump google.golang.org/grpc from 1.66.1 to 1.79.3 in /server (#3232)
- [`b04a3676`](b04a367) Add back animation (#3251)
- [`7b651524`](7b65152) Bump github.com/go-jose/go-jose/v4 from 4.1.3 to 4.1.4 in /server (#3268)
- [`45f4fdea`](45f4fde) use snippets for nexus CTAs (#3266)
- [`420f5c9d`](420f5c9) min-h-full instead of screen (#3270)
- [`f5b2fab6`](f5b2fab) feat(navigation): add NavSection Holocene component (#3263)
- [`657b2728`](657b272) Adds requested design changes to breadcrumb items (#3267)
- [`6763cc4d`](6763cc4) Remove serena (#3273)
- [`dfff353e`](dfff353) Display Principal fields in Event History (#3272)
- [`2d289bce`](2d289bc) Update CODEOWNERS to wildcard for temporalio/frontend-engineering (#3275)
- [`a2eaf16e`](a2eaf16) Persist workflow view and sort order preferences across navigation (#3260)
- [`c5d4c996`](c5d4c99) Add link from Event Card to jump to event id page from Timeline. Remove unnecessary padding (#3277)
- [`e5b3ea55`](e5b3ea5) fix(deps): upgrade lodash, svelte, kit, storybook, tar-fs for security (#3269)
- [`b44afbe6`](b44afbe) fix(deps): upgrade vite and add picomatch/svgo overrides for security (#3279)
- [`4e8cb4e9`](4e8cb4e) Fix unpause confirmation modal title (#3280)
- [`740b3529`](740b352) Add Slack notification when DESIGN FEEDBACK REQUESTED label is added to a PR (#3282)
- [`7e8170e4`](7e8170e) Add check for COLLABORATOR (#3283)
- [`dc27109d`](dc27109) fix: update nav item margin from mb-1 to mb-2 (#3290)
- [`3e6416d2`](3e6416d) Pass execution runId in workflow request for schedule recent run (#3289)
- [`ae3a1844`](ae3a184) Fix schedule edit double-encoding header fields (#3287)
- [`09c083e0`](09c083e) fix: prevent reset modal from closing on authorization error (#3291)
- [`0aa3b72b`](0aa3b72) Sort namespace picker alphabetically (#3286)
- [`4c3d0057`](4c3d005) Sort alphabetically utility (#3293)
- [`67a988b9`](67a988b) Bump @sveltejs/kit from 2.55.0 to 2.57.1 (#3294)
laurakwhit added a commit that referenced this pull request Apr 10, 2026
Auto-generated version bump from 2.48.1 to 2.48.2

Specific version: 2.48.2

Changes included:
- [`92cd681e`](92cd681) Re-wire auth to use a provider pattern. Lots of tests remove cloud references (#3230)
- [`3d92202b`](3d92202) Use --top-nav-height CSS variable for sticky element positioning (#3250)
- [`16295986`](1629598) Bump saved view limits from 20 to 50 (#3254)
- [`a9fa0e91`](a9fa0e9) Display cron string instead of calendar spec when schedule has a cron string in comment field (#3241)
- [`f1811715`](f181171) use full for 100% instead of 100vh (#3256)
- [`0dfadd74`](0dfadd7) Add samples-ruby to workflows table empty state (#3259)
- [`d85d61a3`](d85d61a) Display human-readable schedule spec labels (#3261)
- [`b63049c5`](b63049c) Add invite icon to Holocene design system (#3262)
- [`00c6418c`](00c6418) Bump google.golang.org/grpc from 1.66.1 to 1.79.3 in /server (#3232)
- [`b04a3676`](b04a367) Add back animation (#3251)
- [`7b651524`](7b65152) Bump github.com/go-jose/go-jose/v4 from 4.1.3 to 4.1.4 in /server (#3268)
- [`45f4fdea`](45f4fde) use snippets for nexus CTAs (#3266)
- [`420f5c9d`](420f5c9) min-h-full instead of screen (#3270)
- [`f5b2fab6`](f5b2fab) feat(navigation): add NavSection Holocene component (#3263)
- [`657b2728`](657b272) Adds requested design changes to breadcrumb items (#3267)
- [`6763cc4d`](6763cc4) Remove serena (#3273)
- [`dfff353e`](dfff353) Display Principal fields in Event History (#3272)
- [`2d289bce`](2d289bc) Update CODEOWNERS to wildcard for temporalio/frontend-engineering (#3275)
- [`a2eaf16e`](a2eaf16) Persist workflow view and sort order preferences across navigation (#3260)
- [`c5d4c996`](c5d4c99) Add link from Event Card to jump to event id page from Timeline. Remove unnecessary padding (#3277)
- [`e5b3ea55`](e5b3ea5) fix(deps): upgrade lodash, svelte, kit, storybook, tar-fs for security (#3269)
- [`b44afbe6`](b44afbe) fix(deps): upgrade vite and add picomatch/svgo overrides for security (#3279)
- [`4e8cb4e9`](4e8cb4e) Fix unpause confirmation modal title (#3280)
- [`740b3529`](740b352) Add Slack notification when DESIGN FEEDBACK REQUESTED label is added to a PR (#3282)
- [`7e8170e4`](7e8170e) Add check for COLLABORATOR (#3283)
- [`dc27109d`](dc27109) fix: update nav item margin from mb-1 to mb-2 (#3290)
- [`3e6416d2`](3e6416d) Pass execution runId in workflow request for schedule recent run (#3289)
- [`ae3a1844`](ae3a184) Fix schedule edit double-encoding header fields (#3287)
- [`09c083e0`](09c083e) fix: prevent reset modal from closing on authorization error (#3291)
- [`0aa3b72b`](0aa3b72) Sort namespace picker alphabetically (#3286)
- [`4c3d0057`](4c3d005) Sort alphabetically utility (#3293)
- [`67a988b9`](67a988b) Bump @sveltejs/kit from 2.55.0 to 2.57.1 (#3294)

Co-authored-by: laurakwhit <15069288+laurakwhit@users.noreply.github.com>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants