item.path && navigate(item.path)} style={{
- display: 'flex', alignItems: 'center',
- justifyContent: 'flex-start',
- gap: 10,
- padding: depth > 0 ? '6px 12px 6px 32px' : '6px 14px',
- borderRadius: 12, margin: '1px 4px', cursor: 'pointer',
- fontSize: depth > 0 ? 13 : 14, fontWeight: isActive ? 600 : 400,
- color: isActive ? '#4f46e5' : '#475569',
- background: isActive ? 'linear-gradient(135deg, rgba(99, 102, 241, 0.1) 0%, rgba(139, 92, 246, 0.08) 100%)' : 'transparent',
- transition: 'all 0.2s ease',
- }}>
-
0 ? 14 : 16,
- flexShrink: 0,
- color: isActive ? '#6366f1' : '#64748b',
- }}>{menuIcon}
-
{item.label}
+
+
0 ? '6px 12px 6px 32px' : '6px 14px',
+ borderRadius: 12, margin: '1px 4px', cursor: 'pointer',
+ fontSize: depth > 0 ? 13 : 14, fontWeight: isActive ? 600 : 400,
+ color: isActive ? '#4f46e5' : '#475569',
+ background: isActive ? 'linear-gradient(135deg, rgba(99, 102, 241, 0.1) 0%, rgba(139, 92, 246, 0.08) 100%)' : 'transparent',
+ transition: 'all 0.2s ease',
+ }}
+ >
+ 0 ? 14 : 16,
+ flexShrink: 0,
+ color: isActive ? '#6366f1' : '#64748b',
+ }}>{menuIcon}
+ {item.label}
+ {hasChildren && (
+
+
+
+ )}
+
+
+ {hasChildren && isExpanded && (
+
+ {(childMap[item.id] || []).sort((a, b) => {
+ const orderA = typeof a.sortOrder === 'number' ? a.sortOrder : Infinity;
+ const orderB = typeof b.sortOrder === 'number' ? b.sortOrder : Infinity;
+ return orderA - orderB;
+ }).map(c => renderMenuItem(c, depth + 1))}
+
+ )}
);
};
- // Render top-level items and their children in order
topLevelItems.forEach(item => {
const menuType = item.menu_type ?? item.menuType;
if (menuType === 'group') {
- // Render group with its children
- const children = (childMap[item.id] || []).sort((a, b) => {
- const orderA = typeof a.sortOrder === 'number' ? a.sortOrder : Infinity;
- const orderB = typeof b.sortOrder === 'number' ? b.sortOrder : Infinity;
- return orderA - orderB;
- });
items.push(
- {item.label}
-
- {children.map(c => renderMenuItem(c, 1))}
+ color: '#94a3b8', fontSize: 12, fontWeight: 600,
+ padding: '10px 14px 4px', letterSpacing: 0.5, textTransform: 'uppercase',
+ }}>
+ {item.label}
+
+ {(childMap[item.id] || []).sort((a, b) => {
+ const orderA = typeof a.sortOrder === 'number' ? a.sortOrder : Infinity;
+ const orderB = typeof b.sortOrder === 'number' ? b.sortOrder : Infinity;
+ return orderA - orderB;
+ }).map(c => renderMenuItem(c, 1))}
);
} else {
- // Render standalone page
items.push(renderMenuItem(item));
}
});
diff --git a/video-gen-app/src/pages/LoginPage.tsx b/video-gen-app/src/pages/LoginPage.tsx
index c143a2d5..de16ed78 100644
--- a/video-gen-app/src/pages/LoginPage.tsx
+++ b/video-gen-app/src/pages/LoginPage.tsx
@@ -280,9 +280,7 @@ const LoginPage: React.FC = () => {
};
return (
-