fix(dashboard): Fix styling of nested NavLinks (#9637)
**What** Adds the `end` prop to NavLinks, so they only use their active style when the current path is a perfect match. This was added to prevent MenuItems from extensions both showing the parent and child items as active, when the child route was active. Also added a check to prevent users from adding nested settings NavLinks. <img width="218" alt="Skærmbillede 2024-10-17 kl 14 25 12" src="https://github.com/user-attachments/assets/9e4d530a-c7b4-410e-aaaf-5a21ac86eb03"> <img width="221" alt="Skærmbillede 2024-10-17 kl 14 24 03" src="https://github.com/user-attachments/assets/6769b951-8e48-4725-a373-dc64ed6936ce">
This commit is contained in:
committed by
GitHub
parent
e9a06f4b4d
commit
b50ac9730e
@@ -90,7 +90,7 @@ export class DashboardExtensionManager {
|
||||
if (item.path.includes("/:")) {
|
||||
if (process.env.NODE_ENV === "development") {
|
||||
console.warn(
|
||||
`Menu item for path "${item.path}" can't be added to the sidebar as it contains a parameter.`
|
||||
`[@medusajs/dashboard] Menu item for path "${item.path}" can't be added to the sidebar as it contains a parameter.`
|
||||
)
|
||||
}
|
||||
return
|
||||
@@ -99,6 +99,19 @@ export class DashboardExtensionManager {
|
||||
const isSettingsPath = item.path.startsWith("/settings")
|
||||
const key = isSettingsPath ? "settingsExtensions" : "coreExtensions"
|
||||
|
||||
const pathParts = item.path.split("/").filter(Boolean)
|
||||
const parentPath = "/" + pathParts.slice(0, -1).join("/")
|
||||
|
||||
// Check if this is a nested settings path
|
||||
if (isSettingsPath && pathParts.length > 2) {
|
||||
if (process.env.NODE_ENV === "development") {
|
||||
console.warn(
|
||||
`[@medusajs/dashboard] Nested settings menu item "${item.path}" can't be added to the sidebar. Only top-level settings items are allowed.`
|
||||
)
|
||||
}
|
||||
return // Skip this item entirely
|
||||
}
|
||||
|
||||
const navItem: INavItem = {
|
||||
label: item.label,
|
||||
to: item.path,
|
||||
@@ -106,9 +119,6 @@ export class DashboardExtensionManager {
|
||||
items: [],
|
||||
}
|
||||
|
||||
const pathParts = item.path.split("/").filter(Boolean)
|
||||
const parentPath = "/" + pathParts.slice(0, -1).join("/")
|
||||
|
||||
if (parentPath !== "/" && tempRegistry[parentPath]) {
|
||||
if (!tempRegistry[parentPath].items) {
|
||||
tempRegistry[parentPath].items = []
|
||||
|
||||
Reference in New Issue
Block a user