salman/igny8
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Section 2 Part 3

Browse Source
This commit is contained in:
IGNY8 VPS (Salman)
2026-01-03 08:11:41 +00:00
parent 935c7234b1
commit 4d6ee21408
15 changed files with 1209 additions and 895 deletions
Download Patch File Download Diff File Expand all files Collapse all files

1
frontend/src/layout/AppHeader.tsx
View File

@@ -24,6 +24,7 @@ const SINGLE_SITE_ROUTES = [
'/automation',
'/publisher', // Content Calendar page
'/account/content-settings', // Content settings and sub-pages
'/sites', // Site dashboard and site settings pages (matches /sites/21, /sites/21/settings, /sites/21/content)
];
const SITE_WITH_ALL_SITES_ROUTES = [

42
frontend/src/layout/AppSidebar.tsx
View File

@@ -54,16 +54,31 @@ const AppSidebar: React.FC = () => {
);
const subMenuRefs = useRef<Record<string, HTMLDivElement | null>>({});
// Check if a path is active - exact match only for menu items
// Prefix matching is only used for parent menus to determine if submenu should be open
const isActive = useCallback(
(path: string) => {
// Exact match
(path: string, exactOnly: boolean = false) => {
// Exact match always works
if (location.pathname === path) return true;
// For sub-pages, match if pathname starts with the path (except for root)
if (path !== '/' && location.pathname.startsWith(path + '/')) return true;
// For prefix matching (used by parent menus to check if any child is active)
// Skip if exactOnly is requested (for submenu items)
if (!exactOnly && path !== '/' && location.pathname.startsWith(path + '/')) {
return true;
}
return false;
},
[location.pathname]
);
// Check if a submenu item path is active - uses exact match only
const isSubItemActive = useCallback(
(path: string) => {
return location.pathname === path;
},
[location.pathname]
);
// Define menu sections with useMemo to prevent recreation on every render
// New structure: Dashboard (standalone) → SETUP → WORKFLOW → SETTINGS
@@ -242,15 +257,12 @@ const AppSidebar: React.FC = () => {
const currentPath = location.pathname;
let foundMatch = false;
// Find the matching submenu for the current path
// Find the matching submenu for the current path - use exact match only for subitems
allSections.forEach((section, sectionIndex) => {
section.items.forEach((nav, itemIndex) => {
if (nav.subItems && !foundMatch) {
const shouldOpen = nav.subItems.some((subItem) => {
if (currentPath === subItem.path) return true;
if (subItem.path !== '/' && currentPath.startsWith(subItem.path + '/')) return true;
return false;
});
// Only use exact match for submenu items to prevent multiple active states
const shouldOpen = nav.subItems.some((subItem) => currentPath === subItem.path);
if (shouldOpen) {
setOpenSubmenu((prev) => {
@@ -326,8 +338,8 @@ const AppSidebar: React.FC = () => {
return true;
})
.map((nav, itemIndex) => {
// Check if any subitem is active to determine parent active state
const hasActiveSubItem = nav.subItems?.some(subItem => isActive(subItem.path)) ?? false;
// Check if any subitem is active to determine parent active state (uses exact match for subitems)
const hasActiveSubItem = nav.subItems?.some(subItem => isSubItemActive(subItem.path)) ?? false;
const isSubmenuOpen = openSubmenu?.sectionIndex === sectionIndex && openSubmenu?.itemIndex === itemIndex;
return (
@@ -408,7 +420,7 @@ const AppSidebar: React.FC = () => {
<Link
to={subItem.path}
className={`menu-dropdown-item ${
isActive(subItem.path)
isSubItemActive(subItem.path)
? "menu-dropdown-item-active"
: "menu-dropdown-item-inactive"
}`}
@@ -418,7 +430,7 @@ const AppSidebar: React.FC = () => {
{subItem.new && (
<span
className={`ml-auto ${
isActive(subItem.path)
isSubItemActive(subItem.path)
? "menu-dropdown-badge-active"
: "menu-dropdown-badge-inactive"
} menu-dropdown-badge`}
@@ -429,7 +441,7 @@ const AppSidebar: React.FC = () => {
{subItem.pro && (
<span
className={`ml-auto ${
isActive(subItem.path)
isSubItemActive(subItem.path)
? "menu-dropdown-badge-active"
: "menu-dropdown-badge-inactive"
} menu-dropdown-badge`}