diff --git a/src/components/admin/admin-layout.tsx b/src/components/admin/admin-layout.tsx new file mode 100644 index 0000000..3beb5c5 --- /dev/null +++ b/src/components/admin/admin-layout.tsx @@ -0,0 +1,176 @@ +"use client" + +import { useState } from 'react' +import { AdminSidebar } from './admin-sidebar' +import { AdminTemplatesManager } from './admin-templates-manager' +import { AdminDashboard } from './admin-dashboard' +import { TemplateFeaturesManager } from './template-features-manager' +import { AdminNotificationsPanel } from './admin-notifications-panel' + +type AdminView = + | 'dashboard' + | 'templates' + | 'features' + | 'ai-features' + | 'users' + | 'notifications' + | 'analytics' + | 'settings' + | 'create-template' + | 'add-feature' + | 'ai-analyze' + +export function AdminLayout() { + const [currentView, setCurrentView] = useState('dashboard') + const [featuresDialogOpen, setFeaturesDialogOpen] = useState(false) + + const renderMainContent = () => { + switch (currentView) { + case 'dashboard': + return + + case 'templates': + case 'create-template': + return + + case 'features': + case 'add-feature': + const defaultTemplate = { + id: "default", + type: "default", + title: "Default Template", + description: "Default template for feature management", + complexity: "medium" as const, + approved: true, + usage_count: 0, + created_at: new Date().toISOString(), + updated_at: new Date().toISOString(), + is_custom: false, + status: "approved" as const + } + return ( + { + if (!open) { + setCurrentView('dashboard') + } + }} + /> + ) + + case 'ai-features': + case 'ai-analyze': + return ( +
+
+

AI Feature Analysis

+

AI-powered feature creation and optimization

+
+
+
🤖
+

AI Feature Creator

+

Analyze project requirements and generate optimized features

+
+
+

Smart Analysis

+

AI analyzes your project type and suggests relevant features

+
+
+

Essential Features

+

Creates essential features that integrate with your template

+
+
+

Auto-Optimization

+

Optimizes complexity and requirements automatically

+
+
+
+
+ ) + + case 'users': + return ( +
+
+

User Management

+

Manage user accounts and permissions

+
+
+
👥
+

User Administration

+

User management features coming soon

+
+
+ ) + + case 'notifications': + return {}} /> + + case 'analytics': + return ( +
+
+

Analytics Dashboard

+

Usage statistics and performance metrics

+
+
+
+

Total Templates

+
24
+

+3 this week

+
+
+

Active Users

+
156
+

+12 this week

+
+
+

Features Created

+
89
+

+7 this week

+
+
+

AI Analyses

+
42
+

+8 this week

+
+
+
+ ) + + case 'settings': + return ( +
+
+

System Settings

+

Configure system preferences and options

+
+
+
⚙️
+

Configuration Panel

+

System settings panel coming soon

+
+
+ ) + + default: + return + } + } + + return ( +
+ setCurrentView(view as AdminView)} + /> +
+
+ {renderMainContent()} +
+
+
+ ) +} diff --git a/src/components/admin/admin-sidebar.tsx b/src/components/admin/admin-sidebar.tsx new file mode 100644 index 0000000..ab5c53d --- /dev/null +++ b/src/components/admin/admin-sidebar.tsx @@ -0,0 +1,246 @@ +"use client" + +import { useState } from 'react' +import { Button } from '@/components/ui/button' +import { Badge } from '@/components/ui/badge' +import { + LayoutDashboard, + FileText, + Settings, + Users, + Bell, + Plus, + Search, + Filter, + ChevronLeft, + ChevronRight, + Home, + Database, + Layers, + Zap, + BarChart3, + Globe, + Code +} from 'lucide-react' +import { cn } from '@/lib/utils' + +interface AdminSidebarProps { + currentView: string + onViewChange: (view: string) => void + className?: string +} + +export function AdminSidebar({ currentView, onViewChange, className }: AdminSidebarProps) { + const [isCollapsed, setIsCollapsed] = useState(false) + + const navigationItems = [ + { + id: 'dashboard', + label: 'Dashboard', + icon: LayoutDashboard, + description: 'Overview & Analytics', + badge: null + }, + { + id: 'templates', + label: 'Templates', + icon: FileText, + description: 'Manage Templates', + badge: null + }, + { + id: 'features', + label: 'Features', + icon: Layers, + description: 'Feature Management', + badge: null + }, + { + id: 'ai-features', + label: 'AI Features', + icon: Zap, + description: 'AI-Powered Creation', + badge: 'NEW' + }, + { + id: 'users', + label: 'Users', + icon: Users, + description: 'User Management', + badge: null + }, + { + id: 'notifications', + label: 'Notifications', + icon: Bell, + description: 'System Alerts', + badge: '3' + }, + { + id: 'analytics', + label: 'Analytics', + icon: BarChart3, + description: 'Usage Statistics', + badge: null + }, + { + id: 'settings', + label: 'Settings', + icon: Settings, + description: 'System Configuration', + badge: null + } + ] + + const quickActions = [ + { + id: 'create-template', + label: 'New Template', + icon: Plus, + action: () => onViewChange('create-template') + }, + { + id: 'add-feature', + label: 'Add Feature', + icon: Layers, + action: () => onViewChange('add-feature') + }, + { + id: 'ai-analyze', + label: 'AI Analyze', + icon: Zap, + action: () => onViewChange('ai-analyze') + } + ] + + return ( +
+ {/* Header */} +
+
+ {!isCollapsed && ( +
+

Admin Panel

+

CodeNuk Management

+
+ )} + +
+
+ + {/* Navigation */} +
+
+ {!isCollapsed && ( +
+ Navigation +
+ )} + +
+ + {/* Quick Actions */} + {!isCollapsed && ( +
+
+ Quick Actions +
+
+ {quickActions.map((action) => { + const Icon = action.icon + return ( + + ) + })} +
+
+ )} +
+ + {/* Footer */} +
+ {!isCollapsed ? ( +
+
+ System Status +
+
+ Online +
+
+
+ Backend: Connected • DB: Healthy +
+
+ ) : ( +
+
+
+ )} +
+
+ ) +}