appiq-solution 1.4.8 → 1.4.9

package/flutter/punkt.claude/punkt.claude/commands/feature-ui-layer.md

@@ -1,831 +0,0 @@
-# UI Layer Development Command
-
-Develops the presentation layer (UI) for a feature following AiGo architectural patterns with RiverPod integration, Material 3, and multilingual support.
-
-**Usage:** `feature-ui-layer [FEATURE_NAME] [FEATURE_DESCRIPTION]`
-
-**Example:** `feature-ui-layer user-favorites "Allow users to mark places as favorites and view them in a separate list"`
-
-## Pre-Execution Checklist
-
-1. **Check Channel Status**: Read `/Users/vapps-it/Projects/AiGo/sourceCode/mobile_app/.claude/channel.md`
-2. **Verify Dependencies**: Ensure architecture analysis is completed
-3. **Update Channel**: Mark UI Layer status as "IN_PROGRESS" and assign agent
-4. **Check Blockers**: Verify no blockers are preventing UI development
-
-## Implementation Process
-
-### Phase 1: Analysis & Planning
-
-1. **Study Existing UI Patterns**:
-   - Analyze `lib/views/*/screens/` structure and patterns
-   - Study existing screen implementations and widgets in `lib/core/widgets/`
-   - Review AppTheme implementation and Material 3 usage
-   - Check responsive design patterns and screen mixins
-   - Understand RiverPod provider consumption in UI
-   - Review localization patterns with `context.l10n`
-
-2. **Define UI Requirements**:
-   - Identify main screens needed for the feature
-   - Plan RiverPod provider integration
-   - Define user interactions and navigation flows
-   - Plan responsive design with existing mixins
-   - Plan Material 3 component usage
-   - Identify multilingual text requirements
-
-3. **Update Channel**: Add UI requirements to channel.md
-
-### Phase 2: Screen Structure Implementation
-
-1. **Create Main Screen** (`lib/views/[feature]/screens/[feature]_screen.dart`):
-   ```dart
-   import 'package:flutter/material.dart';
-   import 'package:flutter_riverpod/flutter_riverpod.dart';
-   import 'package:aigo/core/widgets/base_scaffold.dart';
-   import 'package:aigo/core/widgets/loading_indicator.dart';
-   import 'package:aigo/core/widgets/error_screen.dart';
-   import 'package:aigo/l10n/l10n.dart';
-   import '../providers/[feature]_provider.dart';
-   import '../widgets/[feature]_list_item.dart';
-   import '../widgets/[feature]_empty_state.dart';
-   
-   class [FeatureName]Screen extends ConsumerWidget {
-     const [FeatureName]Screen({Key? key}) : super(key: key);
-   
-     @override
-     Widget build(BuildContext context, WidgetRef ref) {
-       return BaseScaffold(
-         title: context.l10n.[featureName]Title,
-         actions: [
-           IconButton(
-             icon: const Icon(Icons.add),
-             onPressed: () => _showAddDialog(context, ref),
-           ),
-         ],
-         floatingActionButton: FloatingActionButton(
-           onPressed: () => _showAddDialog(context, ref),
-           child: const Icon(Icons.add),
-         ),
-         body: const _[FeatureName]View(),
-       );
-     }
-   
-     void _showAddDialog(BuildContext context, WidgetRef ref) {
-       // Implementation for adding new items
-       showDialog(
-         context: context,
-         builder: (_) => _AddItemDialog(),
-       );
-     }
-   }
-   
-   class _[FeatureName]View extends ConsumerWidget {
-     const _[FeatureName]View({Key? key}) : super(key: key);
-   
-     @override
-     Widget build(BuildContext context, WidgetRef ref) {
-       final state = ref.watch([featureName]Provider);
-       
-       if (state.isLoading && state.items.isEmpty) {
-         return const LoadingIndicator();
-       }
-   
-       if (state.error != null && state.items.isEmpty) {
-         return ErrorScreen(
-           message: state.error!,
-           onRetry: () => ref.read([featureName]Provider.notifier).refresh(),
-         );
-       }
-   
-       if (state.items.isEmpty) {
-         return [FeatureName]EmptyState(
-           onAddPressed: () => _showAddDialog(context, ref),
-         );
-       }
-   
-       return RefreshIndicator(
-         onRefresh: () => ref.read([featureName]Provider.notifier).refresh(),
-         child: CustomScrollView(
-           slivers: [
-             SliverToBoxAdapter(
-               child: _buildHeader(context, state),
-             ),
-             SliverList(
-               delegate: SliverChildBuilderDelegate(
-                 (context, index) {
-                   final item = state.items[index];
-                   return [FeatureName]ListItem(
-                     item: item,
-                     onTap: () => _navigateToDetails(context, item),
-                     onEdit: () => _showEditDialog(context, ref, item),
-                     onDelete: () => _showDeleteConfirmation(context, ref, item),
-                   );
-                 },
-                 childCount: state.items.length,
-               ),
-             ),
-             if (state.isLoading && state.items.isNotEmpty)
-               const SliverToBoxAdapter(
-                 child: Padding(
-                   padding: EdgeInsets.all(16.0),
-                   child: Center(child: CircularProgressIndicator()),
-                 ),
-               ),
-           ],
-         ),
-       );
-     }
-   
-     Widget _buildHeader(BuildContext context, [FeatureName]State state) {
-       return Padding(
-         padding: const EdgeInsets.all(16.0),
-         child: Column(
-           crossAxisAlignment: CrossAxisAlignment.start,
-           children: [
-             Text(
-               context.l10n.[featureName]Count(state.items.length),
-               style: Theme.of(context).textTheme.bodyMedium,
-             ),
-             if (state.filters.isNotEmpty) ...[
-               const SizedBox(height: 8),
-               _buildActiveFilters(context, state),
-             ],
-           ],
-         ),
-       );
-     }
-   
-     Widget _buildActiveFilters(BuildContext context, [FeatureName]State state) {
-       return Wrap(
-         spacing: 8.0,
-         children: state.filters.entries.map((filter) {
-           return FilterChip(
-             label: Text('${filter.key}: ${filter.value}'),
-             onDeleted: () {
-               // Remove filter logic
-             },
-           );
-         }).toList(),
-       );
-     }
-   
-     void _navigateToDetails(BuildContext context, [FeatureName] item) {
-       Navigator.of(context).pushNamed(
-         '/[feature]/details',
-         arguments: item.id,
-       );
-     }
-   
-     void _showEditDialog(BuildContext context, WidgetRef ref, [FeatureName] item) {
-       showDialog(
-         context: context,
-         builder: (_) => _EditItemDialog(item: item),
-       );
-     }
-   
-     void _showDeleteConfirmation(BuildContext context, WidgetRef ref, [FeatureName] item) {
-       showDialog(
-         context: context,
-         builder: (_) => AlertDialog(
-           title: Text(context.l10n.confirmDelete),
-           content: Text(context.l10n.[featureName]DeleteConfirmation),
-           actions: [
-             TextButton(
-               onPressed: () => Navigator.of(context).pop(),
-               child: Text(context.l10n.cancel),
-             ),
-             FilledButton(
-               onPressed: () {
-                 Navigator.of(context).pop();
-                 ref.read([featureName]Provider.notifier).deleteItem(item.id);
-               },
-               child: Text(context.l10n.delete),
-             ),
-           ],
-         ),
-       );
-     }
-   
-     void _showAddDialog(BuildContext context, WidgetRef ref) {
-       showDialog(
-         context: context,
-         builder: (_) => const _AddItemDialog(),
-       );
-     }
-   }
-   ```
-
-### Phase 3: Widget Components Implementation
-
-1. **Create List Item Widget** (`lib/views/[feature]/widgets/[feature]_list_item.dart`):
-   ```dart
-   import 'package:flutter/material.dart';
-   import 'package:aigo/domain/models/[feature].dart';
-   import 'package:aigo/core/theme/app_colors.dart';
-   import 'package:aigo/l10n/l10n.dart';
-   
-   class [FeatureName]ListItem extends StatelessWidget {
-     final [FeatureName] item;
-     final VoidCallback? onTap;
-     final VoidCallback? onEdit;
-     final VoidCallback? onDelete;
-   
-     const [FeatureName]ListItem({
-       Key? key,
-       required this.item,
-       this.onTap,
-       this.onEdit,
-       this.onDelete,
-     }) : super(key: key);
-   
-     @override
-     Widget build(BuildContext context) {
-       return Card(
-         margin: const EdgeInsets.symmetric(horizontal: 16, vertical: 4),
-         child: ListTile(
-           leading: _buildLeading(context),
-           title: Text(
-             item.title,
-             style: Theme.of(context).textTheme.titleMedium,
-           ),
-           subtitle: _buildSubtitle(context),
-           trailing: _buildTrailing(context),
-           onTap: onTap,
-         ),
-       );
-     }
-   
-     Widget _buildLeading(BuildContext context) {
-       return CircleAvatar(
-         backgroundColor: AppColors.primary.withOpacity(0.1),
-         child: Icon(
-           Icons.star, // Replace with appropriate icon
-           color: AppColors.primary,
-         ),
-       );
-     }
-   
-     Widget? _buildSubtitle(BuildContext context) {
-       if (item.description?.isNotEmpty == true) {
-         return Text(
-           item.description!,
-           maxLines: 2,
-           overflow: TextOverflow.ellipsis,
-         );
-       }
-       return Text(
-         context.l10n.[featureName]CreatedAt(item.createdAt),
-         style: Theme.of(context).textTheme.bodySmall,
-       );
-     }
-   
-     Widget _buildTrailing(BuildContext context) {
-       return PopupMenuButton<String>(
-         itemBuilder: (context) => [
-           PopupMenuItem(
-             value: 'edit',
-             child: ListTile(
-               leading: const Icon(Icons.edit),
-               title: Text(context.l10n.edit),
-               contentPadding: EdgeInsets.zero,
-             ),
-           ),
-           PopupMenuItem(
-             value: 'delete',
-             child: ListTile(
-               leading: const Icon(Icons.delete),
-               title: Text(context.l10n.delete),
-               contentPadding: EdgeInsets.zero,
-             ),
-           ),
-         ],
-         onSelected: (value) {
-           switch (value) {
-             case 'edit':
-               onEdit?.call();
-               break;
-             case 'delete':
-               onDelete?.call();
-               break;
-           }
-         },
-       );
-     }
-   }
-   ```
-
-2. **Create Empty State Widget** (`lib/views/[feature]/widgets/[feature]_empty_state.dart`):
-   ```dart
-   import 'package:flutter/material.dart';
-   import 'package:lottie/lottie.dart';
-   import 'package:aigo/core/utils/app_assets.dart';
-   import 'package:aigo/l10n/l10n.dart';
-   
-   class [FeatureName]EmptyState extends StatelessWidget {
-     final VoidCallback? onAddPressed;
-   
-     const [FeatureName]EmptyState({
-       Key? key,
-       this.onAddPressed,
-     }) : super(key: key);
-   
-     @override
-     Widget build(BuildContext context) {
-       return Center(
-         child: Padding(
-           padding: const EdgeInsets.all(32.0),
-           child: Column(
-             mainAxisAlignment: MainAxisAlignment.center,
-             children: [
-               Lottie.asset(
-                 AppAssets.emptyAnimation,
-                 height: 200,
-                 repeat: false,
-               ),
-               const SizedBox(height: 24),
-               Text(
-                 context.l10n.[featureName]EmptyTitle,
-                 style: Theme.of(context).textTheme.headlineSmall,
-                 textAlign: TextAlign.center,
-               ),
-               const SizedBox(height: 16),
-               Text(
-                 context.l10n.[featureName]EmptyMessage,
-                 style: Theme.of(context).textTheme.bodyMedium,
-                 textAlign: TextAlign.center,
-               ),
-               const SizedBox(height: 32),
-               FilledButton.icon(
-                 onPressed: onAddPressed,
-                 icon: const Icon(Icons.add),
-                 label: Text(context.l10n.[featureName]AddFirst),
-               ),
-             ],
-           ),
-         ),
-       );
-     }
-   }
-   ```
-
-### Phase 4: Dialog Implementation
-
-1. **Create Add/Edit Dialog** (`lib/views/[feature]/widgets/[feature]_dialog.dart`):
-   ```dart
-   import 'package:flutter/material.dart';
-   import 'package:flutter_riverpod/flutter_riverpod.dart';
-   import 'package:aigo/domain/models/[feature].dart';
-   import 'package:aigo/l10n/l10n.dart';
-   import '../providers/[feature]_provider.dart';
-   
-   class _AddItemDialog extends ConsumerStatefulWidget {
-     const _AddItemDialog({Key? key}) : super(key: key);
-   
-     @override
-     ConsumerState<_AddItemDialog> createState() => _AddItemDialogState();
-   }
-   
-   class _AddItemDialogState extends ConsumerState<_AddItemDialog> {
-     final _formKey = GlobalKey<FormState>();
-     final _titleController = TextEditingController();
-     final _descriptionController = TextEditingController();
-   
-     @override
-     void dispose() {
-       _titleController.dispose();
-       _descriptionController.dispose();
-       super.dispose();
-     }
-   
-     @override
-     Widget build(BuildContext context) {
-       return AlertDialog(
-         title: Text(context.l10n.[featureName]AddTitle),
-         content: Form(
-           key: _formKey,
-           child: Column(
-             mainAxisSize: MainAxisSize.min,
-             children: [
-               TextFormField(
-                 controller: _titleController,
-                 decoration: InputDecoration(
-                   labelText: context.l10n.[featureName]TitleLabel,
-                   hintText: context.l10n.[featureName]TitleHint,
-                 ),
-                 validator: (value) {
-                   if (value?.trim().isEmpty == true) {
-                     return context.l10n.[featureName]TitleRequired;
-                   }
-                   return null;
-                 },
-                 autofocus: true,
-               ),
-               const SizedBox(height: 16),
-               TextFormField(
-                 controller: _descriptionController,
-                 decoration: InputDecoration(
-                   labelText: context.l10n.[featureName]DescriptionLabel,
-                   hintText: context.l10n.[featureName]DescriptionHint,
-                 ),
-                 maxLines: 3,
-               ),
-             ],
-           ),
-         ),
-         actions: [
-           TextButton(
-             onPressed: () => Navigator.of(context).pop(),
-             child: Text(context.l10n.cancel),
-           ),
-           FilledButton(
-             onPressed: _submit,
-             child: Text(context.l10n.add),
-           ),
-         ],
-       );
-     }
-   
-     void _submit() {
-       if (_formKey.currentState?.validate() == true) {
-         ref.read([featureName]Provider.notifier).addItem(
-           title: _titleController.text.trim(),
-           description: _descriptionController.text.trim().isNotEmpty
-               ? _descriptionController.text.trim()
-               : null,
-         );
-         Navigator.of(context).pop();
-       }
-     }
-   }
-   
-   class _EditItemDialog extends ConsumerStatefulWidget {
-     final [FeatureName] item;
-   
-     const _EditItemDialog({
-       Key? key,
-       required this.item,
-     }) : super(key: key);
-   
-     @override
-     ConsumerState<_EditItemDialog> createState() => _EditItemDialogState();
-   }
-   
-   class _EditItemDialogState extends ConsumerState<_EditItemDialog> {
-     final _formKey = GlobalKey<FormState>();
-     late final _titleController = TextEditingController(text: widget.item.title);
-     late final _descriptionController = TextEditingController(text: widget.item.description);
-   
-     @override
-     void dispose() {
-       _titleController.dispose();
-       _descriptionController.dispose();
-       super.dispose();
-     }
-   
-     @override
-     Widget build(BuildContext context) {
-       return AlertDialog(
-         title: Text(context.l10n.[featureName]EditTitle),
-         content: Form(
-           key: _formKey,
-           child: Column(
-             mainAxisSize: MainAxisSize.min,
-             children: [
-               TextFormField(
-                 controller: _titleController,
-                 decoration: InputDecoration(
-                   labelText: context.l10n.[featureName]TitleLabel,
-                 ),
-                 validator: (value) {
-                   if (value?.trim().isEmpty == true) {
-                     return context.l10n.[featureName]TitleRequired;
-                   }
-                   return null;
-                 },
-               ),
-               const SizedBox(height: 16),
-               TextFormField(
-                 controller: _descriptionController,
-                 decoration: InputDecoration(
-                   labelText: context.l10n.[featureName]DescriptionLabel,
-                 ),
-                 maxLines: 3,
-               ),
-             ],
-           ),
-         ),
-         actions: [
-           TextButton(
-             onPressed: () => Navigator.of(context).pop(),
-             child: Text(context.l10n.cancel),
-           ),
-           FilledButton(
-             onPressed: _submit,
-             child: Text(context.l10n.save),
-           ),
-         ],
-       );
-     }
-   
-     void _submit() {
-       if (_formKey.currentState?.validate() == true) {
-         final updatedItem = widget.item.copyWith(
-           title: _titleController.text.trim(),
-           description: _descriptionController.text.trim().isNotEmpty
-               ? _descriptionController.text.trim()
-               : null,
-         );
-         
-         ref.read([featureName]Provider.notifier).updateItem(updatedItem);
-         Navigator.of(context).pop();
-       }
-     }
-   }
-   ```
-
-### Phase 5: Details Screen Implementation
-
-1. **Create Details Screen** (`lib/views/[feature]/screens/[feature]_details_screen.dart`):
-   ```dart
-   import 'package:flutter/material.dart';
-   import 'package:flutter_riverpod/flutter_riverpod.dart';
-   import 'package:aigo/core/widgets/base_scaffold.dart';
-   import 'package:aigo/core/widgets/loading_indicator.dart';
-   import 'package:aigo/core/widgets/error_screen.dart';
-   import 'package:aigo/l10n/l10n.dart';
-   import '../providers/[feature]_provider.dart';
-   
-   class [FeatureName]DetailsScreen extends ConsumerWidget {
-     final String itemId;
-   
-     const [FeatureName]DetailsScreen({
-       Key? key,
-       required this.itemId,
-     }) : super(key: key);
-   
-     @override
-     Widget build(BuildContext context, WidgetRef ref) {
-       final asyncItem = ref.watch([featureName]ByIdProvider(itemId));
-   
-       return BaseScaffold(
-         title: context.l10n.[featureName]Details,
-         body: asyncItem.when(
-           data: (item) {
-             if (item == null) {
-               return ErrorScreen(
-                 message: context.l10n.[featureName]NotFound,
-                 onRetry: () => ref.invalidate([featureName]ByIdProvider(itemId)),
-               );
-             }
-             return _[FeatureName]DetailsView(item: item);
-           },
-           loading: () => const LoadingIndicator(),
-           error: (error, stack) => ErrorScreen(
-             message: error.toString(),
-             onRetry: () => ref.invalidate([featureName]ByIdProvider(itemId)),
-           ),
-         ),
-       );
-     }
-   }
-   
-   class _[FeatureName]DetailsView extends StatelessWidget {
-     final [FeatureName] item;
-   
-     const _[FeatureName]DetailsView({
-       Key? key,
-       required this.item,
-     }) : super(key: key);
-   
-     @override
-     Widget build(BuildContext context) {
-       return SingleChildScrollView(
-         padding: const EdgeInsets.all(16.0),
-         child: Column(
-           crossAxisAlignment: CrossAxisAlignment.start,
-           children: [
-             _buildHeader(context),
-             const SizedBox(height: 24),
-             _buildDetails(context),
-             const SizedBox(height: 24),
-             _buildMetadata(context),
-           ],
-         ),
-       );
-     }
-   
-     Widget _buildHeader(BuildContext context) {
-       return Card(
-         child: Padding(
-           padding: const EdgeInsets.all(16.0),
-           child: Column(
-             crossAxisAlignment: CrossAxisAlignment.start,
-             children: [
-               Text(
-                 item.title,
-                 style: Theme.of(context).textTheme.headlineSmall,
-               ),
-               if (item.description?.isNotEmpty == true) ...[
-                 const SizedBox(height: 8),
-                 Text(
-                   item.description!,
-                   style: Theme.of(context).textTheme.bodyMedium,
-                 ),
-               ],
-             ],
-           ),
-         ),
-       );
-     }
-   
-     Widget _buildDetails(BuildContext context) {
-       return Card(
-         child: Padding(
-           padding: const EdgeInsets.all(16.0),
-           child: Column(
-             crossAxisAlignment: CrossAxisAlignment.start,
-             children: [
-               Text(
-                 context.l10n.[featureName]DetailsTitle,
-                 style: Theme.of(context).textTheme.titleMedium,
-               ),
-               const SizedBox(height: 16),
-               _buildDetailRow(
-                 context,
-                 context.l10n.[featureName]CreatedLabel,
-                 _formatDate(item.createdAt),
-               ),
-               _buildDetailRow(
-                 context,
-                 context.l10n.[featureName]UpdatedLabel,
-                 _formatDate(item.updatedAt),
-               ),
-               _buildDetailRow(
-                 context,
-                 context.l10n.[featureName]StatusLabel,
-                 item.isActive ? context.l10n.active : context.l10n.inactive,
-               ),
-             ],
-           ),
-         ),
-       );
-     }
-   
-     Widget _buildDetailRow(BuildContext context, String label, String value) {
-       return Padding(
-         padding: const EdgeInsets.only(bottom: 8.0),
-         child: Row(
-           crossAxisAlignment: CrossAxisAlignment.start,
-           children: [
-             SizedBox(
-               width: 120,
-               child: Text(
-                 label,
-                 style: Theme.of(context).textTheme.bodySmall?.copyWith(
-                   fontWeight: FontWeight.w500,
-                 ),
-               ),
-             ),
-             Expanded(
-               child: Text(
-                 value,
-                 style: Theme.of(context).textTheme.bodyMedium,
-               ),
-             ),
-           ],
-         ),
-       );
-     }
-   
-     Widget _buildMetadata(BuildContext context) {
-       if (item.metadata == null || item.metadata!.isEmpty) {
-         return const SizedBox.shrink();
-       }
-   
-       return Card(
-         child: Padding(
-           padding: const EdgeInsets.all(16.0),
-           child: Column(
-             crossAxisAlignment: CrossAxisAlignment.start,
-             children: [
-               Text(
-                 context.l10n.[featureName]MetadataTitle,
-                 style: Theme.of(context).textTheme.titleMedium,
-               ),
-               const SizedBox(height: 16),
-               ...item.metadata!.entries.map((entry) =>
-                 _buildDetailRow(context, entry.key, entry.value.toString()),
-               ),
-             ],
-           ),
-         ),
-       );
-     }
-   
-     String _formatDate(DateTime dateTime) {
-       return '${dateTime.day}.${dateTime.month}.${dateTime.year}';
-     }
-   }
-   ```
-
-### Phase 6: Navigation Integration
-
-1. **Update App Router** (`lib/core/routing/app_router.dart`):
-   ```dart
-   // Add to routes
-   GoRoute(
-     path: '/[feature]',
-     builder: (context, state) => const [FeatureName]Screen(),
-   ),
-   GoRoute(
-     path: '/[feature]/details/:id',
-     builder: (context, state) {
-       final id = state.pathParameters['id']!;
-       return [FeatureName]DetailsScreen(itemId: id);
-     },
-   ),
-   ```
-
-## Quality Checklist
-
-### UI Implementation
-- [ ] Uses ConsumerWidget for RiverPod integration
-- [ ] Proper error and loading state handling
-- [ ] Material 3 design components
-- [ ] Responsive design with proper spacing
-- [ ] Accessibility features implemented
-
-### Localization
-- [ ] All text uses context.l10n
-- [ ] No hardcoded strings
-- [ ] Proper placeholder usage
-- [ ] RTL support for Arabic
-- [ ] Cultural considerations for translations
-
-### Navigation
-- [ ] Proper route definitions
-- [ ] Navigation patterns follow app conventions
-- [ ] Back button handling
-- [ ] Deep linking support
-
-### User Experience
-- [ ] Loading indicators for async operations
-- [ ] Pull-to-refresh functionality
-- [ ] Empty states with clear actions
-- [ ] Error states with retry options
-- [ ] Confirmation dialogs for destructive actions
-
-## Channel Communication
-
-### Before Starting
-Update channel.md:
-```markdown
-### 🎨 UI Layer Status
-- **Status:** IN_PROGRESS
-- **Assigned Agent:** [YOUR_ID]
-- **Progress:** 0%
-```
-
-### During Development
-Update progress regularly:
-```markdown
-- **Progress:** [PERCENTAGE]%
-- **Files Created:** [LIST_OF_FILES]
-- **Next Steps:** [CURRENT_WORK]
-```
-
-### After Completion
-Mark as completed:
-```markdown
-### 🎨 UI Layer Status
-- **Status:** COMPLETED
-- **Progress:** 100%
-- **Files Created:** [COMPLETE_LIST]
-```
-
-## Dependencies
-
-### Must be completed first:
-- Architecture analysis
-- Business logic layer (providers)
-
-### Can work in parallel with:
-- Domain layer (with coordination)
-- Data layer (with coordination)
-
-### Enables after completion:
-- Localization layer
-- Integration testing
-- User acceptance testing
-
-## Output Deliverables
-
-1. **Main Screen**: `lib/views/[feature]/screens/[feature]_screen.dart`
-2. **Details Screen**: `lib/views/[feature]/screens/[feature]_details_screen.dart`
-3. **List Item Widget**: `lib/views/[feature]/widgets/[feature]_list_item.dart`
-4. **Empty State Widget**: `lib/views/[feature]/widgets/[feature]_empty_state.dart`
-5. **Dialog Components**: `lib/views/[feature]/widgets/[feature]_dialog.dart`
-6. **Updated Router**: Route definitions in `lib/core/routing/app_router.dart`
-7. **Updated Channel**: Progress and completion status in channel.md
-
-All UI components must follow AiGo's Material 3 design system, RiverPod patterns, and multilingual support with proper accessibility features.