Update navigation logic in useControllerNav to include Home route handling

- Added condition to focus on My Apps container when on the Home route.
- Enhanced focus management by integrating Home route check into existing navigation logic for improved user experience.
This commit is contained in:
Dorian 2026-02-18 11:30:54 +00:00
parent d0312c6721
commit a7b92fb4d3

View File

@ -267,6 +267,7 @@ export function useControllerNav(containerRef?: { value: HTMLElement | null }) {
const hasZones = sidebarEls.length > 0 && mainEls.length > 0
// Right: from sidebar → main
// - On Home: go to My Apps container
// - On Apps/Marketplace: go to first app container
// - On Cloud: go to first folder (Pictures)
// - On Network (server): go to Services container
@ -274,6 +275,7 @@ export function useControllerNav(containerRef?: { value: HTMLElement | null }) {
// - On Settings: go to Change Password container
// - Otherwise: go to top right (App Switcher)
const mainZone = document.querySelector('[data-controller-zone="main"]')
const isHome = /^\/dashboard(\/)?$/.test(route.path)
const isAppsOrMarketplace = /^\/dashboard\/(apps|marketplace)(\/|$)/.test(route.path)
const isCloud = /^\/dashboard\/cloud(\/|$)/.test(route.path)
const isNetwork = /^\/dashboard\/server(\/|$)/.test(route.path)
@ -282,7 +284,7 @@ export function useControllerNav(containerRef?: { value: HTMLElement | null }) {
const firstAppContainer = mainZone?.querySelector<HTMLElement>('[data-controller-container]')
const topRightEntry = mainZone?.querySelector<HTMLElement>('[data-controller-main-entry]')
const firstFocusableInTopRight = topRightEntry ? getFocusableElements(topRightEntry)[0] : null
const firstMain = ((isAppsOrMarketplace || isCloud || isNetwork || isWeb5 || isSettings) && firstAppContainer)
const firstMain = ((isHome || isAppsOrMarketplace || isCloud || isNetwork || isWeb5 || isSettings) && firstAppContainer)
? firstAppContainer
: (firstFocusableInTopRight ?? mainEls[0])
if (e.key === 'ArrowRight' && hasZones && isInZone(activeEl, 'sidebar') && firstMain) {