Add subcription level filtering

frontend/src/components/layout/Sidebar/Sidebar.tsx

@@ -4,6 +4,7 @@ import { useLocation, useNavigate } from 'react-router-dom';
 import { useAuthUser, useIsAuthenticated } from '../../../stores';
 import { useCurrentTenantAccess } from '../../../stores/tenant.store';
 import { getNavigationRoutes, canAccessRoute, ROUTES } from '../../../router/routes.config';
+import { useSubscriptionAwareRoutes } from '../../../hooks/useSubscriptionAwareRoutes';
 import { Button } from '../../ui';
 import { Badge } from '../../ui';
 import { Tooltip } from '../../ui';
@@ -136,11 +137,13 @@ export const Sidebar = forwardRef<SidebarRef, SidebarProps>(({
   const [hoveredItem, setHoveredItem] = useState<string | null>(null);
   const sidebarRef = React.useRef<HTMLDivElement>(null);
 
-  // Get navigation routes from config and convert to navigation items - memoized
+  // Get subscription-aware navigation routes
+  const baseNavigationRoutes = useMemo(() => getNavigationRoutes(), []);
+  const { filteredRoutes: subscriptionFilteredRoutes } = useSubscriptionAwareRoutes(baseNavigationRoutes);
+
+  // Convert routes to navigation items - memoized
   const navigationItems = useMemo(() => {
-    const navigationRoutes = getNavigationRoutes();
-    
-    const convertRoutesToItems = (routes: typeof navigationRoutes): NavigationItem[] => {
+    const convertRoutesToItems = (routes: typeof subscriptionFilteredRoutes): NavigationItem[] => {
       return routes.map(route => ({
         id: route.path,
         label: route.title,
@@ -152,8 +155,8 @@ export const Sidebar = forwardRef<SidebarRef, SidebarProps>(({
       }));
     };
 
-    return customItems || convertRoutesToItems(navigationRoutes);
-  }, [customItems]);
+    return customItems || convertRoutesToItems(subscriptionFilteredRoutes);
+  }, [customItems, subscriptionFilteredRoutes]);
 
   // Filter items based on user permissions - memoized to prevent infinite re-renders
   const visibleItems = useMemo(() => {