@orsetra/shared-ui 1.1.3 → 1.1.5

package/components/layout/layout-container.tsx

@@ -1,7 +1,7 @@
 "use client"
 
 import { useState, useEffect } from "react"
-import { usePathname } from "next/navigation"
+import { usePathname, useSearchParams } from "next/navigation"
 import { MainSidebar, type SidebarMode } from "./sidebar/main-sidebar"
 import { Sidebar, SidebarProvider, useSidebar } from "./sidebar/sidebar"
 import { type SidebarMenus, type MainMenuItem, type MenuApiResponse, resolveIcon } from "./sidebar/data"
@@ -19,19 +19,21 @@ interface LayoutContainerProps {
   mode?: SidebarMode
   userMenuConfig?: UserMenuConfig
   fetchMenus?: () => Promise<MenuApiResponse>
-  getSidebarMode?: (pathname: string) => SidebarMode
-  getCurrentMenu?: (pathname: string) => string
+  getSidebarMode?: (pathname: string, searchParams: URLSearchParams) => SidebarMode
+  getCurrentMenu?: (pathname: string, searchParams: URLSearchParams) => string
+  getCurrentMenuItem?: (pathname: string, searchParams: URLSearchParams) => string
 }
 
-function LayoutContent({ children, sidebarMenus = {}, user, onSignOut, mode = 'expanded', userMenuConfig, main_base_url, fetchMenus, getSidebarMode, getCurrentMenu }: LayoutContainerProps) {
+function LayoutContent({ children, sidebarMenus = {}, user, onSignOut, mode = 'expanded', userMenuConfig, main_base_url, fetchMenus, getSidebarMode, getCurrentMenu, getCurrentMenuItem }: LayoutContainerProps) {
   const pathname = usePathname()
+  const searchParams = useSearchParams()
   const { setOpen } = useSidebar()
   const isMobile = useIsMobile()
   const [isMainSidebarOpen, setIsMainSidebarOpen] = useState(false)
   const [currentMenu, setCurrentMenu] = useState<string>("overview")
   
   // Use custom mode function if provided, otherwise use prop
-  const effectiveMode = getSidebarMode ? getSidebarMode(pathname) : mode
+  const effectiveMode = getSidebarMode ? getSidebarMode(pathname, searchParams) : mode
   const isMinimized = effectiveMode === 'minimized'
   // Force hidden mode on mobile
   const isHidden = effectiveMode === 'hidden' || isMobile
@@ -84,9 +86,9 @@ function LayoutContent({ children, sidebarMenus = {}, user, onSignOut, mode = 'e
 
   useEffect(() => {
     // Use custom menu function if provided, otherwise use default getMenuFromPath
-    const contextualMenu = getCurrentMenu ? getCurrentMenu(pathname) : getMenuFromPath(pathname)
+    const contextualMenu = getCurrentMenu ? getCurrentMenu(pathname, searchParams) : getMenuFromPath(pathname)
     setCurrentMenu(contextualMenu)
-  }, [pathname, getCurrentMenu])
+  }, [pathname, searchParams, getCurrentMenu])
 
   const handleMainSidebarToggle = () => {
     setIsMainSidebarOpen(!isMainSidebarOpen)
@@ -110,6 +112,7 @@ function LayoutContent({ children, sidebarMenus = {}, user, onSignOut, mode = 'e
           sidebarMenus={effectiveSidebarMenus}
           main_base_url={main_base_url}
           sectionLabels={sectionLabels}
+          getCurrentMenuItem={getCurrentMenuItem}
         />
       )}
 

package/components/layout/sidebar/sidebar.tsx

@@ -5,7 +5,7 @@ import { Slot } from "@radix-ui/react-slot"
 import { VariantProps, cva } from "class-variance-authority"
 import { PanelLeft } from "lucide-react"
 import Link from "next/link"
-import { usePathname } from "next/navigation"
+import { usePathname, useSearchParams } from "next/navigation"
 
 import { useIsMobile } from "../../../hooks/use-mobile"
 import { cn } from "../../../lib/utils"
@@ -172,12 +172,14 @@ interface SidebarProps {
   sidebarMenus?: SidebarMenus
   main_base_url?: string
   sectionLabels?: Record<string, string>
+  getCurrentMenuItem?: (pathname: string, searchParams: URLSearchParams) => string
 }
 
 
 
-function Sidebar({ currentMenu, onMainMenuToggle, sidebarMenus = {}, main_base_url = "", sectionLabels = {} }: SidebarProps = {}) {
+function Sidebar({ currentMenu, onMainMenuToggle, sidebarMenus = {}, main_base_url = "", sectionLabels = {}, getCurrentMenuItem }: SidebarProps = {}) {
   const pathname = usePathname()
+  const searchParams = useSearchParams()
   const { state } = useSidebar()
   const [settingsOpen, setSettingsOpen] = React.useState(false)
   const settingsRef = React.useRef<HTMLDivElement>(null)
@@ -229,10 +231,11 @@ function Sidebar({ currentMenu, onMainMenuToggle, sidebarMenus = {}, main_base_u
         </div>
       )}
 
-      {/* Navigation principale avec espacements ajustés */}
       <nav className="flex-1 px-3 py-4 space-y-1 overflow-y-auto">
         {currentNavigation.map((item) => {
-          const isActive = pathname === item.href || pathname.startsWith(`${item.href}/`)
+          // Use custom function if provided, otherwise use default pathname matching
+          const activeItemId = getCurrentMenuItem ? getCurrentMenuItem(pathname, searchParams) : null
+          const isActive = activeItemId ? item.id === activeItemId : (pathname === item.href || pathname.startsWith(`${item.href}/`))
           
           const handleClick = (e: React.MouseEvent) => {
             const href = item.href

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@orsetra/shared-ui",
-  "version": "1.1.3",
+  "version": "1.1.5",
   "description": "Shared UI components for Orsetra platform",
   "main": "./index.ts",
   "types": "./index.ts",