import 'package:flutter/material.dart'; import '../models/project_workspace.dart'; class WorkspaceHomePage extends StatefulWidget { final Future Function(ProjectWorkspace)? onLaunchCodeServer; const WorkspaceHomePage({ super.key, this.onLaunchCodeServer, }); @override State createState() => _WorkspaceHomePageState(); } class _WorkspaceHomePageState extends State { ProjectWorkspace? _selectedProject; @override void initState() { super.initState(); // Default to the first active workspace if (mockProjectWorkspaces.isNotEmpty) { _selectedProject = mockProjectWorkspaces.first; } } @override Widget build(BuildContext context) { final theme = Theme.of(context); final isLargeScreen = MediaQuery.of(context).size.width > 600; return Scaffold( backgroundColor: const Color(0xFF0F0F1A), // Sleek deep dark background appBar: AppBar( title: Row( children: [ Container( padding: const EdgeInsets.all(6), decoration: BoxDecoration( color: Colors.deepPurpleAccent.withValues(alpha: 0.2), borderRadius: BorderRadius.circular(8), ), child: const Icon(Icons.blur_on, color: Colors.deepPurpleAccent, size: 24), ), const SizedBox(width: 12), const Text( 'NomadCode Console', style: TextStyle( fontWeight: FontWeight.bold, letterSpacing: 0.5, color: Colors.white, ), ), ], ), backgroundColor: const Color(0xFF16162A), elevation: 0, actions: [ IconButton( icon: const Icon(Icons.refresh, color: Colors.white70), onPressed: () { // Refresh state placeholder }, ), ], ), body: isLargeScreen ? _buildDualPaneLayout(theme) : _buildSinglePaneLayout(theme), ); } Widget _buildDualPaneLayout(ThemeData theme) { return Row( crossAxisAlignment: CrossAxisAlignment.stretch, children: [ // Left Panel: Workspaces list Expanded( flex: 2, child: Container( decoration: const BoxDecoration( color: Color(0xFF131326), border: Border( right: BorderSide(color: Color(0xFF1E1E38), width: 1), ), ), child: _buildWorkspaceList(), ), ), // Right Panel: Selected Workspace Details Expanded( flex: 3, child: _selectedProject == null ? const Center( child: Text( 'Select a workspace to view details', style: TextStyle(color: Colors.white38), ), ) : _buildWorkspaceDetails(theme, _selectedProject!), ), ], ); } Widget _buildSinglePaneLayout(ThemeData theme) { return Column( children: [ Expanded( child: _buildWorkspaceList(), ), if (_selectedProject != null) Container( padding: const EdgeInsets.all(16), decoration: const BoxDecoration( color: Color(0xFF16162A), border: Border( top: BorderSide(color: Color(0xFF1E1E38), width: 1), ), ), child: Column( mainAxisSize: MainAxisSize.min, children: [ Row( children: [ Expanded( child: Text( _selectedProject!.name, style: const TextStyle( color: Colors.white, fontSize: 18, fontWeight: FontWeight.bold, ), ), ), _buildLaunchButton(_selectedProject!), ], ), ], ), ), ], ); } Widget _buildWorkspaceList() { return ListView.builder( padding: const EdgeInsets.symmetric(vertical: 16, horizontal: 12), itemCount: mockProjectWorkspaces.length, itemBuilder: (context, index) { final project = mockProjectWorkspaces[index]; final isSelected = _selectedProject?.id == project.id; return Card( color: isSelected ? const Color(0xFF21213D) : const Color(0xFF181830), elevation: isSelected ? 4 : 1, shape: RoundedRectangleBorder( borderRadius: BorderRadius.circular(12), side: BorderSide( color: isSelected ? Colors.deepPurpleAccent : const Color(0xFF26264A), width: 1.5, ), ), margin: const EdgeInsets.only(bottom: 12), child: InkWell( borderRadius: BorderRadius.circular(12), onTap: () { setState(() { _selectedProject = project; }); }, child: Padding( padding: const EdgeInsets.all(16), child: Row( children: [ Container( width: 48, height: 48, decoration: BoxDecoration( color: isSelected ? Colors.deepPurpleAccent.withValues(alpha: 0.15) : const Color(0xFF232345), shape: BoxShape.circle, ), child: Icon( project.status == ProjectStatus.active ? Icons.code : Icons.pause_circle_outline, color: project.status == ProjectStatus.active ? Colors.cyanAccent : Colors.amberAccent, size: 24, ), ), const SizedBox(width: 16), Expanded( child: Column( crossAxisAlignment: CrossAxisAlignment.start, children: [ Text( project.name, style: const TextStyle( color: Colors.white, fontWeight: FontWeight.bold, fontSize: 16, ), ), const SizedBox(height: 4), Text( project.description, maxLines: 1, overflow: TextOverflow.ellipsis, style: const TextStyle( color: Colors.white60, fontSize: 13, ), ), ], ), ), const SizedBox(width: 8), if (project.tasksCount > 0) Container( padding: const EdgeInsets.symmetric(horizontal: 8, vertical: 4), decoration: BoxDecoration( color: Colors.deepPurpleAccent.withValues(alpha: 0.3), borderRadius: BorderRadius.circular(12), ), child: Text( '${project.tasksCount} Tasks', style: const TextStyle( color: Colors.white, fontSize: 10, fontWeight: FontWeight.bold, ), ), ), ], ), ), ), ); }, ); } Widget _buildWorkspaceDetails(ThemeData theme, ProjectWorkspace project) { return SingleChildScrollView( padding: const EdgeInsets.all(24), child: Column( crossAxisAlignment: CrossAxisAlignment.start, children: [ Row( crossAxisAlignment: CrossAxisAlignment.start, children: [ Expanded( child: Column( crossAxisAlignment: CrossAxisAlignment.start, children: [ Text( project.name, style: const TextStyle( color: Colors.white, fontSize: 28, fontWeight: FontWeight.bold, letterSpacing: -0.5, ), ), const SizedBox(height: 8), Container( padding: const EdgeInsets.symmetric(horizontal: 10, vertical: 4), decoration: BoxDecoration( color: project.status == ProjectStatus.active ? Colors.cyanAccent.withValues(alpha: 0.15) : Colors.amberAccent.withValues(alpha: 0.15), borderRadius: BorderRadius.circular(12), ), child: Text( project.status.name.toUpperCase(), style: TextStyle( color: project.status == ProjectStatus.active ? Colors.cyanAccent : Colors.amberAccent, fontSize: 11, fontWeight: FontWeight.bold, letterSpacing: 1.0, ), ), ), ], ), ), _buildLaunchButton(project), ], ), const SizedBox(height: 24), const Divider(color: Color(0xFF26264A)), const SizedBox(height: 16), const Text( 'DESCRIPTION', style: TextStyle( color: Colors.white38, fontSize: 12, fontWeight: FontWeight.bold, letterSpacing: 1.0, ), ), const SizedBox(height: 8), Text( project.description, style: const TextStyle( color: Colors.white70, fontSize: 15, height: 1.5, ), ), const SizedBox(height: 32), const Text( 'ACTIVE TASKS', style: TextStyle( color: Colors.white38, fontSize: 12, fontWeight: FontWeight.bold, letterSpacing: 1.0, ), ), const SizedBox(height: 16), if (project.tasksCount == 0) Container( padding: const EdgeInsets.all(20), decoration: BoxDecoration( color: const Color(0xFF14142B), borderRadius: BorderRadius.circular(12), border: Border.all(color: const Color(0xFF222244)), ), child: const Row( children: [ Icon(Icons.check_circle_outline, color: Colors.greenAccent), SizedBox(width: 16), Text( 'No active tasks. All tasks are idle.', style: TextStyle(color: Colors.white54, fontSize: 14), ), ], ), ) else Column( children: List.generate( project.tasksCount, (i) => Container( margin: const EdgeInsets.only(bottom: 12), padding: const EdgeInsets.all(16), decoration: BoxDecoration( color: const Color(0xFF181835), borderRadius: BorderRadius.circular(12), border: Border.all(color: const Color(0xFF2B2B52)), ), child: Row( children: [ const Icon(Icons.sync, color: Colors.deepPurpleAccent), const SizedBox(width: 16), Expanded( child: Column( crossAxisAlignment: CrossAxisAlignment.start, children: [ Text( 'Task #${1000 + i + (project.name.hashCode % 100)}', style: const TextStyle( color: Colors.white, fontWeight: FontWeight.bold, fontSize: 14, ), ), const SizedBox(height: 4), const Text( 'Running workflow core optimizations...', style: TextStyle(color: Colors.white54, fontSize: 12), ), ], ), ), Container( padding: const EdgeInsets.symmetric(horizontal: 8, vertical: 4), decoration: BoxDecoration( color: Colors.cyanAccent.withValues(alpha: 0.1), borderRadius: BorderRadius.circular(6), ), child: const Text( 'running', style: TextStyle( color: Colors.cyanAccent, fontSize: 11, fontWeight: FontWeight.bold, ), ), ), ], ), ), ), ), ], ), ); } Widget _buildLaunchButton(ProjectWorkspace project) { return ElevatedButton.icon( style: ElevatedButton.styleFrom( backgroundColor: Colors.deepPurpleAccent, foregroundColor: Colors.white, padding: const EdgeInsets.symmetric(horizontal: 20, vertical: 16), shape: RoundedRectangleBorder( borderRadius: BorderRadius.circular(12), ), elevation: 6, shadowColor: Colors.deepPurpleAccent.withValues(alpha: 0.4), ), icon: const Icon(Icons.rocket_launch, size: 20), label: const Text( 'Open Workspace', style: TextStyle( fontWeight: FontWeight.bold, letterSpacing: 0.5, ), ), onPressed: () async { if (widget.onLaunchCodeServer != null) { final success = await widget.onLaunchCodeServer!(project); if (success && mounted) { ScaffoldMessenger.of(context).showSnackBar( SnackBar( content: Text('Launching ${project.name} workspace...'), behavior: SnackBarBehavior.floating, ), ); } } }, ); } }