You need to sign in or sign up before continuing.
feat(brain): Brain configuration page - glassmorphism UI, context menu, workspace management
Overview
Complete brain configuration page implementation with glassmorphism UI, file cards with context menu, workspace info management, and ConditionalComponent pattern refactoring.
Changes
- Built new /dashboard/settings page with glassmorphism-styled brain configuration UI
- Added ContentPanel with responsive file cards grid (1/2/3 columns layout)
- Implemented context menu with absolute positioning inside card wrapper
- Added scroll-close behavior for context menu UX improvement
- Created WorkspaceInfo component with inline edit mode toggle
- Built AddEditDialog modal for adding/editing brain configuration items
- Added file upload functionality with drag-and-drop support
- Implemented country-specific fields (ICE for Morocco, SIREN for France)
- Refactored all inline conditionals to use ConditionalComponent pattern across 3 files
Technical Details
- Context menu uses absolute positioning within card wrapper to avoid blur bleeding
- Card structure uses outer wrapper (overflow: visible) + inner card (overflow: hidden, isolation: isolate)
- Glassmorphism styling with backdrop-filter blur effects on cards and menus
- Hover blur effect on context menu items (Modifier/Supprimer)
- Menu closes automatically on scroll event
- FontAwesome icons: pen, trash, ellipsis-vertical, brain, globe, building, etc.
- All conditional rendering uses ConditionalComponent pattern
- No commented code
Components Added
- ContentPanel.tsx - File cards grid with glassmorphism context menu
- WorkspaceInfo.tsx - Workspace details with edit mode and image upload
- AddEditDialog.tsx - Modal for adding/editing brain configuration items
- mockData.ts - Sample BrainConfigurationData entries
- index.ts - Barrel export for brain components
Components Updated
- page.tsx (settings) - Integrated brain components with galaxy background
- configuration.ts - Added brain configuration type definitions
- agent-theme-context.tsx - Updated color configurations
- sidebar.tsx - Adjusted navigation items
- fontawesome/index.tsx - Added brain-related icons + missing icons from develop
Types Added
- BrainConfigurationData (union type for different data types)
- BrainDataType (file, image, info, rule, reference, tag, alert)
- WorkspaceData (company details with country-specific fields)
- FrenchAddress, EmployeeSize, Country
Assets Added
- AyalV2.png
- aksel.png
- Wix.com_website_logo.svg
Close-[IAV-758]