smelte-sapper-template
smelte-sapper-template copied to clipboard
NavigationDrawer selected logic is wrong
<ListItem
selected={path.includes(item.to)}
https://github.com/matyunya/smelte-sapper-template/blob/780ab5b3f2324afcf7093faafc1dbff7a6268cc1/src/routes/_layout.svelte#L80-L81
That triggers whenever the current URL path happens to contain the destination.
For example, if you add a new src/routes/aboutfoo.svelte that'll set "About" as active.
I did this, instead:
selected={isActive(path, item.to)}
function isActive(path, to) {
if (to == path) {
return true
}
if (path.startsWith(to+"/")) {
return true
}
return false
}
The second if marks an item selected if the current URL is below. Whether one wants that or not depends on whether the NavigationDrawer contains just one level, or multiple. Highlighting only the most exact matching entry gets a little tricky...