ars/iiEsaywebUIapp
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

refactor: navigation rehaul

Browse Source
This commit is contained in:
cogwheel0
2025-08-21 23:56:47 +05:30
parent b10051f687
commit 9f80b1e727
7 changed files with 1503 additions and 2284 deletions
Download Patch File Download Diff File Expand all files Collapse all files

11
lib/core/services/navigation_service.dart
View File

@@ -3,7 +3,6 @@ import 'package:flutter/material.dart';
import '../../features/auth/views/connect_signin_page.dart'; import '../../features/auth/views/connect_signin_page.dart';
import '../../features/chat/views/chat_page.dart'; import '../../features/chat/views/chat_page.dart';
import '../../features/files/views/files_page.dart'; import '../../features/files/views/files_page.dart';
import '../../features/navigation/views/chats_list_page.dart';
import '../../features/profile/views/profile_page.dart'; import '../../features/profile/views/profile_page.dart';
import '../../shared/widgets/themed_dialogs.dart'; import '../../shared/widgets/themed_dialogs.dart';
@@ -92,10 +91,7 @@ class NavigationService {
return navigateTo(Routes.serverConnection); return navigateTo(Routes.serverConnection);
} }
/// Navigate to chats list // Chats list is now provided as a left drawer in ChatPage
static Future<void> navigateToChatsList() {
return navigateTo(Routes.chatsList);
}
/// Clear navigation stack (useful for logout) /// Clear navigation stack (useful for logout)
static void clearNavigationStack() { static void clearNavigationStack() {
@@ -138,9 +134,7 @@ class NavigationService {
page = const FilesPage(); page = const FilesPage();
break; break;
case Routes.chatsList: // chats list route removed (replaced by drawer)
page = const ChatsListPage();
break;
// Removed navigation drawer route // Removed navigation drawer route
@@ -161,5 +155,4 @@ class Routes {
static const String profile = '/profile'; static const String profile = '/profile';
static const String serverConnection = '/server-connection'; static const String serverConnection = '/server-connection';
static const String files = '/files'; static const String files = '/files';
static const String chatsList = '/chats-list';
} }

125
lib/features/chat/views/chat_page.dart
View File

@@ -1,5 +1,4 @@
import 'package:flutter/material.dart'; import 'package:flutter/material.dart';
import '../../../core/services/navigation_service.dart';
import '../../../core/widgets/error_boundary.dart'; import '../../../core/widgets/error_boundary.dart';
import '../../../shared/widgets/optimized_list.dart'; import '../../../shared/widgets/optimized_list.dart';
import '../../../shared/theme/theme_extensions.dart'; import '../../../shared/theme/theme_extensions.dart';
@@ -19,10 +18,10 @@ import '../widgets/assistant_message_widget.dart' as assistant;
import '../widgets/file_attachment_widget.dart'; import '../widgets/file_attachment_widget.dart';
import '../services/voice_input_service.dart'; import '../services/voice_input_service.dart';
import '../services/file_attachment_service.dart'; import '../services/file_attachment_service.dart';
import '../../navigation/views/chats_list_page.dart';
import '../../files/views/files_page.dart'; import '../../files/views/files_page.dart';
import '../../profile/views/profile_page.dart'; import '../../profile/views/profile_page.dart';
import '../../tools/providers/tools_providers.dart'; import '../../tools/providers/tools_providers.dart';
import '../../navigation/widgets/chats_drawer.dart';
import '../../../shared/widgets/offline_indicator.dart'; import '../../../shared/widgets/offline_indicator.dart';
import '../../../core/services/connectivity_service.dart'; import '../../../core/services/connectivity_service.dart';
import '../../../core/models/chat_message.dart'; import '../../../core/models/chat_message.dart';
@@ -463,47 +462,7 @@ class _ChatPageState extends ConsumerState<ChatPage> {
} }
} }
void _showChatsListOverlay() { // Replaced bottom-sheet chat list with left drawer (see ChatsDrawer)
showModalBottomSheet(
context: context,
isScrollControlled: true,
backgroundColor: Colors.transparent,
builder: (context) => Container(
height: MediaQuery.of(context).size.height * 0.9,
decoration: BoxDecoration(
color: context.conduitTheme.surfaceBackground,
borderRadius: const BorderRadius.vertical(
top: Radius.circular(AppBorderRadius.bottomSheet),
),
border: Border.all(
color: context.conduitTheme.dividerColor,
width: BorderWidth.regular,
),
boxShadow: ConduitShadows.modal,
),
child: SafeArea(
top: false,
bottom: true,
child: Column(
mainAxisSize: MainAxisSize.min,
children: [
// Handle bar
Container(
width: 40,
height: 4,
margin: const EdgeInsets.symmetric(vertical: Spacing.sm),
decoration: BoxDecoration(
color: context.conduitTheme.dividerColor,
borderRadius: BorderRadius.circular(AppBorderRadius.xs),
),
),
Expanded(child: const ChatsListPage(isOverlay: true)),
],
),
),
),
);
}
void _showQuickAccessMenu() { void _showQuickAccessMenu() {
showModalBottomSheet( showModalBottomSheet(
@@ -1117,39 +1076,16 @@ class _ChatPageState extends ConsumerState<ChatPage> {
onPopInvokedWithResult: (bool didPop, Object? result) async { onPopInvokedWithResult: (bool didPop, Object? result) async {
if (didPop) return; if (didPop) return;
// Check if there's unsaved content // Auto-handle leaving without confirmation
final messages = ref.read(chatMessagesProvider); final messages = ref.read(chatMessagesProvider);
if (messages.isNotEmpty) { final isStreaming = messages.any((msg) => msg.isStreaming);
// Check if currently streaming if (isStreaming) {
final isStreaming = messages.any((msg) => msg.isStreaming); ref.read(chatMessagesProvider.notifier).finishStreaming();
}
final shouldPop = await NavigationService.confirmNavigation( await _saveConversationBeforeLeaving(ref);
title: 'Leave Chat?',
message: isStreaming
? 'The AI is still responding. Leave anyway?'
: 'Your conversation will be saved.',
confirmText: 'Leave',
cancelText: 'Stay',
);
if (shouldPop && context.mounted) {
// If streaming, stop it first
if (isStreaming) {
ref.read(chatMessagesProvider.notifier).finishStreaming();
}
// Save the conversation before leaving if (context.mounted) {
await _saveConversationBeforeLeaving(ref);
if (context.mounted) {
final canPopNavigator = Navigator.of(context).canPop();
if (canPopNavigator) {
Navigator.of(context).pop();
} else {
SystemNavigator.pop();
}
}
}
} else if (context.mounted) {
final canPopNavigator = Navigator.of(context).canPop(); final canPopNavigator = Navigator.of(context).canPop();
if (canPopNavigator) { if (canPopNavigator) {
Navigator.of(context).pop(); Navigator.of(context).pop();
@@ -1160,6 +1096,14 @@ class _ChatPageState extends ConsumerState<ChatPage> {
}, },
child: Scaffold( child: Scaffold(
backgroundColor: context.conduitTheme.surfaceBackground, backgroundColor: context.conduitTheme.surfaceBackground,
// Left navigation drawer with draggable edge open
drawerEnableOpenDragGesture: true,
drawerEdgeDragWidth: 32,
drawer: Drawer(
width: (MediaQuery.of(context).size.width * 0.88).clamp(280.0, 420.0),
backgroundColor: context.conduitTheme.surfaceBackground,
child: const SafeArea(child: ChatsDrawer()),
),
appBar: AppBar( appBar: AppBar(
backgroundColor: context.conduitTheme.surfaceBackground, backgroundColor: context.conduitTheme.surfaceBackground,
elevation: Elevation.none, elevation: Elevation.none,
@@ -1176,22 +1120,25 @@ class _ChatPageState extends ConsumerState<ChatPage> {
), ),
onPressed: _clearSelection, onPressed: _clearSelection,
) )
: GestureDetector( : Builder(
onTap: () { builder: (ctx) => GestureDetector(
_showChatsListOverlay(); onTap: () {
}, // Open left drawer instead of bottom sheet
onLongPress: () { Scaffold.of(ctx).openDrawer();
HapticFeedback.mediumImpact(); },
_showQuickAccessMenu(); onLongPress: () {
}, HapticFeedback.mediumImpact();
child: Padding( _showQuickAccessMenu();
padding: const EdgeInsets.all(4.0), },
child: Icon( child: Padding(
Platform.isIOS padding: const EdgeInsets.all(4.0),
? CupertinoIcons.line_horizontal_3 child: Icon(
: Icons.menu, Platform.isIOS
color: context.conduitTheme.textPrimary, ? CupertinoIcons.line_horizontal_3
size: IconSize.appBar, : Icons.menu,
color: context.conduitTheme.textPrimary,
size: IconSize.appBar,
),
), ),
), ),
), ),

274
lib/features/chat/widgets/modern_chat_input.dart
View File

@@ -1,5 +1,6 @@
import 'package:flutter/material.dart'; import 'package:flutter/material.dart';
import 'package:flutter/cupertino.dart'; import 'package:flutter/cupertino.dart';
import 'package:flutter/services.dart';
import '../../../shared/theme/theme_extensions.dart'; import '../../../shared/theme/theme_extensions.dart';
import 'package:flutter_riverpod/flutter_riverpod.dart'; import 'package:flutter_riverpod/flutter_riverpod.dart';
@@ -220,18 +221,17 @@ class _ModernChatInputState extends ConsumerState<ModernChatInput>
), ),
border: Border( border: Border(
top: BorderSide( top: BorderSide(
color: context.conduitTheme.inputBorder, color: context.conduitTheme.dividerColor,
width: BorderWidth.regular, width: BorderWidth.regular,
), ),
left: BorderSide( left: BorderSide(
color: context.conduitTheme.inputBorder, color: context.conduitTheme.dividerColor,
width: BorderWidth.regular, width: BorderWidth.regular,
), ),
right: BorderSide( right: BorderSide(
color: context.conduitTheme.inputBorder, color: context.conduitTheme.dividerColor,
width: BorderWidth.regular, width: BorderWidth.regular,
), ),
// Removed bottom border to eliminate divider
), ),
boxShadow: ConduitShadows.input, boxShadow: ConduitShadows.input,
), ),
@@ -431,41 +431,48 @@ class _ModernChatInputState extends ConsumerState<ModernChatInput>
if (isGenerating) { if (isGenerating) {
return Tooltip( return Tooltip(
message: 'Stop generating', message: 'Stop generating',
child: GestureDetector( child: Material(
onTap: stopGeneration, color: Colors.transparent,
child: Container( shape: RoundedRectangleBorder(
width: buttonSize, borderRadius: BorderRadius.circular(radius),
height: buttonSize, side: BorderSide(color: context.conduitTheme.error, width: BorderWidth.regular),
decoration: BoxDecoration( ),
color: context.conduitTheme.error.withValues( child: InkWell(
alpha: Alpha.buttonPressed, borderRadius: BorderRadius.circular(radius),
onTap: () {
HapticFeedback.lightImpact();
stopGeneration();
},
child: Container(
width: buttonSize,
height: buttonSize,
decoration: BoxDecoration(
color: context.conduitTheme.error.withValues(
alpha: Alpha.buttonPressed,
),
borderRadius: BorderRadius.circular(radius),
boxShadow: ConduitShadows.button,
), ),
borderRadius: BorderRadius.circular(radius), child: Stack(
border: Border.all( alignment: Alignment.center,
color: context.conduitTheme.error, children: [
width: BorderWidth.regular, SizedBox(
), width: buttonSize - 18,
boxShadow: ConduitShadows.button, height: buttonSize - 18,
), child: CircularProgressIndicator(
child: Stack( strokeWidth: BorderWidth.medium,
alignment: Alignment.center, valueColor: AlwaysStoppedAnimation<Color>(
children: [ context.conduitTheme.error,
SizedBox( ),
width: buttonSize - 18,
height: buttonSize - 18,
child: CircularProgressIndicator(
strokeWidth: BorderWidth.medium,
valueColor: AlwaysStoppedAnimation<Color>(
context.conduitTheme.error,
), ),
), ),
), Icon(
Icon( Platform.isIOS ? CupertinoIcons.stop_fill : Icons.stop,
Platform.isIOS ? CupertinoIcons.stop_fill : Icons.stop, size: IconSize.medium,
size: IconSize.medium, color: context.conduitTheme.error,
color: context.conduitTheme.error, ),
), ],
], ),
), ),
), ),
), ),
@@ -475,36 +482,44 @@ class _ModernChatInputState extends ConsumerState<ModernChatInput>
// Default SEND variant // Default SEND variant
return Tooltip( return Tooltip(
message: enabled ? 'Send message' : 'Send', message: enabled ? 'Send message' : 'Send',
child: GestureDetector( child: Opacity(
onTap: enabled ? _sendMessage : null,
child: Opacity(
opacity: enabled ? Alpha.primary : Alpha.disabled, opacity: enabled ? Alpha.primary : Alpha.disabled,
child: IgnorePointer( child: IgnorePointer(
ignoring: !enabled, ignoring: !enabled,
child: Container( child: Material(
width: buttonSize, color: Colors.transparent,
height: buttonSize, shape: RoundedRectangleBorder(
decoration: BoxDecoration( borderRadius: BorderRadius.circular(radius),
color: context.conduitTheme.cardBackground, side: BorderSide(
borderRadius: BorderRadius.circular(radius),
border: Border.all(
color: enabled
? context.conduitTheme.cardBorder
: context.conduitTheme.cardBorder.withValues(
alpha: Alpha.medium,
),
width: BorderWidth.regular,
),
boxShadow: ConduitShadows.button,
),
child: Icon(
Platform.isIOS ? CupertinoIcons.arrow_up : Icons.arrow_upward,
size: IconSize.medium,
color: enabled color: enabled
? context.conduitTheme.textPrimary ? context.conduitTheme.cardBorder
: context.conduitTheme.textPrimary.withValues( : context.conduitTheme.cardBorder.withValues(alpha: Alpha.medium),
alpha: Alpha.disabled, width: BorderWidth.regular,
), ),
),
child: InkWell(
borderRadius: BorderRadius.circular(radius),
onTap: enabled
? () {
PlatformUtils.lightHaptic();
_sendMessage();
}
: null,
child: Container(
width: buttonSize,
height: buttonSize,
decoration: BoxDecoration(
color: context.conduitTheme.cardBackground,
borderRadius: BorderRadius.circular(radius),
boxShadow: ConduitShadows.button,
),
child: Icon(
Platform.isIOS ? CupertinoIcons.arrow_up : Icons.arrow_upward,
size: IconSize.medium,
color: enabled
? context.conduitTheme.textPrimary
: context.conduitTheme.textPrimary.withValues(alpha: Alpha.disabled),
),
), ),
), ),
), ),
@@ -522,9 +537,30 @@ class _ModernChatInputState extends ConsumerState<ModernChatInput>
}) { }) {
return Tooltip( return Tooltip(
message: tooltip ?? '', message: tooltip ?? '',
child: GestureDetector( child: Material(
onTap: onTap, color: Colors.transparent,
child: Container( shape: RoundedRectangleBorder(
borderRadius: BorderRadius.circular(AppBorderRadius.xl),
side: BorderSide(
color: isActive
? context.conduitTheme.textPrimary.withValues(
alpha: Alpha.buttonHover + Alpha.subtle,
)
: showBackground
? context.conduitTheme.cardBorder
: Colors.transparent,
width: BorderWidth.regular,
),
),
child: InkWell(
borderRadius: BorderRadius.circular(AppBorderRadius.xl),
onTap: onTap == null
? null
: () {
HapticFeedback.selectionClick();
onTap();
},
child: Container(
width: TouchTarget.comfortable, width: TouchTarget.comfortable,
height: TouchTarget.comfortable, height: TouchTarget.comfortable,
decoration: BoxDecoration( decoration: BoxDecoration(
@@ -536,16 +572,6 @@ class _ModernChatInputState extends ConsumerState<ModernChatInput>
? context.conduitTheme.cardBackground ? context.conduitTheme.cardBackground
: Colors.transparent, : Colors.transparent,
borderRadius: BorderRadius.circular(AppBorderRadius.xl), borderRadius: BorderRadius.circular(AppBorderRadius.xl),
border: Border.all(
color: isActive
? context.conduitTheme.textPrimary.withValues(
alpha: Alpha.buttonHover + Alpha.subtle,
)
: showBackground
? context.conduitTheme.cardBorder
: Colors.transparent,
width: BorderWidth.regular,
),
boxShadow: (isActive || showBackground) boxShadow: (isActive || showBackground)
? ConduitShadows.button ? ConduitShadows.button
: null, : null,
@@ -565,10 +591,11 @@ class _ModernChatInputState extends ConsumerState<ModernChatInput>
), ),
), ),
), ),
); ));
} }
void _showAttachmentOptions() { void _showAttachmentOptions() {
HapticFeedback.selectionClick();
showModalBottomSheet( showModalBottomSheet(
context: context, context: context,
backgroundColor: Colors.transparent, backgroundColor: Colors.transparent,
@@ -578,6 +605,10 @@ class _ModernChatInputState extends ConsumerState<ModernChatInput>
borderRadius: const BorderRadius.vertical( borderRadius: const BorderRadius.vertical(
top: Radius.circular(AppBorderRadius.bottomSheet), top: Radius.circular(AppBorderRadius.bottomSheet),
), ),
border: Border.all(
color: context.conduitTheme.dividerColor,
width: BorderWidth.regular,
),
boxShadow: ConduitShadows.modal, boxShadow: ConduitShadows.modal,
), ),
padding: const EdgeInsets.all(Spacing.bottomSheetPadding), padding: const EdgeInsets.all(Spacing.bottomSheetPadding),
@@ -599,34 +630,41 @@ class _ModernChatInputState extends ConsumerState<ModernChatInput>
// Options grid // Options grid
Row( Row(
mainAxisAlignment: MainAxisAlignment.spaceEvenly,
children: [ children: [
_buildAttachmentOption( Expanded(
child: _buildAttachmentOption(
icon: Platform.isIOS ? CupertinoIcons.doc : Icons.attach_file, icon: Platform.isIOS ? CupertinoIcons.doc : Icons.attach_file,
label: 'File', label: 'File',
onTap: () { onTap: () {
HapticFeedback.lightImpact();
Navigator.pop(context); // Close modal Navigator.pop(context); // Close modal
widget.onFileAttachment?.call(); widget.onFileAttachment?.call();
}, },
), )),
_buildAttachmentOption( const SizedBox(width: Spacing.md),
Expanded(
child: _buildAttachmentOption(
icon: Platform.isIOS ? CupertinoIcons.photo : Icons.image, icon: Platform.isIOS ? CupertinoIcons.photo : Icons.image,
label: 'Photo', label: 'Photo',
onTap: () { onTap: () {
HapticFeedback.lightImpact();
Navigator.pop(context); // Close modal Navigator.pop(context); // Close modal
widget.onImageAttachment?.call(); widget.onImageAttachment?.call();
}, },
), )),
_buildAttachmentOption( const SizedBox(width: Spacing.md),
Expanded(
child: _buildAttachmentOption(
icon: Platform.isIOS icon: Platform.isIOS
? CupertinoIcons.camera ? CupertinoIcons.camera
: Icons.camera_alt, : Icons.camera_alt,
label: 'Camera', label: 'Camera',
onTap: () { onTap: () {
HapticFeedback.lightImpact();
Navigator.pop(context); // Close modal Navigator.pop(context); // Close modal
widget.onCameraCapture?.call(); widget.onCameraCapture?.call();
}, },
), )),
], ],
), ),
const SizedBox(height: Spacing.lg), const SizedBox(height: Spacing.lg),
@@ -637,6 +675,7 @@ class _ModernChatInputState extends ConsumerState<ModernChatInput>
} }
void _showUnifiedToolsModal() { void _showUnifiedToolsModal() {
HapticFeedback.selectionClick();
showModalBottomSheet( showModalBottomSheet(
context: context, context: context,
backgroundColor: Colors.transparent, backgroundColor: Colors.transparent,
@@ -649,40 +688,45 @@ class _ModernChatInputState extends ConsumerState<ModernChatInput>
required String label, required String label,
VoidCallback? onTap, VoidCallback? onTap,
}) { }) {
return GestureDetector( return Material(
onTap: onTap, color: Colors.transparent,
child: Column( child: InkWell(
mainAxisSize: MainAxisSize.min, borderRadius: BorderRadius.circular(AppBorderRadius.lg),
children: [ onTap: onTap == null
Container( ? null
width: 64, : () {
height: 64, HapticFeedback.selectionClick();
decoration: BoxDecoration( onTap();
color: context.conduitTheme.textPrimary.withValues( },
alpha: Alpha.subtle, child: Column(
), mainAxisSize: MainAxisSize.min,
borderRadius: BorderRadius.circular(AppBorderRadius.lg), children: [
border: Border.all( Container(
color: context.conduitTheme.textPrimary.withValues( width: 64,
alpha: Alpha.subtle, height: 64,
decoration: BoxDecoration(
color: context.conduitTheme.cardBackground,
borderRadius: BorderRadius.circular(AppBorderRadius.lg),
border: Border.all(
color: context.conduitTheme.cardBorder,
width: BorderWidth.regular,
), ),
width: BorderWidth.regular, ),
child: Icon(
icon,
color: context.conduitTheme.iconPrimary,
size: IconSize.xl,
), ),
), ),
child: Icon( const SizedBox(height: Spacing.sm),
icon, Text(
color: context.conduitTheme.textPrimary, label,
size: IconSize.xl, style: AppTypography.labelStyle.copyWith(
color: context.conduitTheme.textPrimary,
),
), ),
), ],
const SizedBox(height: Spacing.sm), ),
Text(
label,
style: AppTypography.labelStyle.copyWith(
color: context.conduitTheme.textPrimary,
),
),
],
), ),
); );
} }

1894
lib/features/navigation/views/chats_list_page.dart
View File

File diff suppressed because it is too large Load Diff

1046
lib/features/navigation/widgets/chats_drawer.dart Normal file
View File

File diff suppressed because it is too large Load Diff

51
lib/features/profile/views/profile_page.dart
View File

@@ -1,4 +1,5 @@
import 'package:flutter/material.dart'; import 'package:flutter/material.dart';
import 'package:flutter/services.dart';
import '../../../shared/theme/theme_extensions.dart'; import '../../../shared/theme/theme_extensions.dart';
import 'package:flutter/cupertino.dart'; import 'package:flutter/cupertino.dart';
import 'package:flutter_riverpod/flutter_riverpod.dart'; import 'package:flutter_riverpod/flutter_riverpod.dart';
@@ -797,7 +798,7 @@ class _DefaultModelBottomSheetState extends ConsumerState<_DefaultModelBottomShe
width: Spacing.xxl, width: Spacing.xxl,
height: Spacing.xs, height: Spacing.xs,
decoration: BoxDecoration( decoration: BoxDecoration(
color: context.conduitTheme.dividerColor, color: context.conduitTheme.textPrimary.withValues(alpha: Alpha.medium),
borderRadius: BorderRadius.circular(AppBorderRadius.xs), borderRadius: BorderRadius.circular(AppBorderRadius.xs),
), ),
), ),
@@ -807,6 +808,11 @@ class _DefaultModelBottomSheetState extends ConsumerState<_DefaultModelBottomShe
padding: const EdgeInsets.only(bottom: Spacing.md), padding: const EdgeInsets.only(bottom: Spacing.md),
child: Row( child: Row(
children: [ children: [
Icon(
Platform.isIOS ? CupertinoIcons.cube : Icons.psychology,
color: context.conduitTheme.iconPrimary,
),
const SizedBox(width: Spacing.sm),
Expanded( Expanded(
child: Text( child: Text(
'Default Model', 'Default Model',
@@ -817,7 +823,10 @@ class _DefaultModelBottomSheetState extends ConsumerState<_DefaultModelBottomShe
), ),
), ),
TextButton( TextButton(
onPressed: () => Navigator.pop(context, _selectedModelId), onPressed: () {
HapticFeedback.lightImpact();
Navigator.pop(context, _selectedModelId);
},
child: Text( child: Text(
'Save', 'Save',
style: context.conduitTheme.bodyMedium?.copyWith( style: context.conduitTheme.bodyMedium?.copyWith(
@@ -837,7 +846,7 @@ class _DefaultModelBottomSheetState extends ConsumerState<_DefaultModelBottomShe
controller: _searchController, controller: _searchController,
style: TextStyle(color: context.conduitTheme.textPrimary), style: TextStyle(color: context.conduitTheme.textPrimary),
decoration: InputDecoration( decoration: InputDecoration(
hintText: 'Search...', hintText: 'Search models...',
hintStyle: TextStyle( hintStyle: TextStyle(
color: context.conduitTheme.inputPlaceholder, color: context.conduitTheme.inputPlaceholder,
), ),
@@ -874,6 +883,41 @@ class _DefaultModelBottomSheetState extends ConsumerState<_DefaultModelBottomShe
), ),
), ),
// Section header (cohesive with Chats Drawer)
Padding(
padding: const EdgeInsets.only(bottom: Spacing.sm),
child: Row(
children: [
Text(
'Available Models',
style: AppTypography.bodySmallStyle.copyWith(
fontWeight: FontWeight.w600,
color: context.conduitTheme.textSecondary,
letterSpacing: 0.2,
),
),
const SizedBox(width: Spacing.xs),
Container(
padding: const EdgeInsets.symmetric(horizontal: 6, vertical: 2),
decoration: BoxDecoration(
color: context.conduitTheme.surfaceBackground.withValues(alpha: 0.6),
borderRadius: BorderRadius.circular(AppBorderRadius.xs),
border: Border.all(
color: context.conduitTheme.dividerColor,
width: BorderWidth.thin,
),
),
child: Text(
'${_filteredModels.length}',
style: AppTypography.bodySmallStyle.copyWith(
color: context.conduitTheme.textSecondary,
),
),
),
],
),
),
const SizedBox(height: Spacing.sm), const SizedBox(height: Spacing.sm),
// Models list // Models list
@@ -919,6 +963,7 @@ class _DefaultModelBottomSheetState extends ConsumerState<_DefaultModelBottomShe
isSelected: isSelected, isSelected: isSelected,
isAutoSelect: isAutoSelect, isAutoSelect: isAutoSelect,
onTap: () { onTap: () {
HapticFeedback.selectionClick();
setState(() { setState(() {
_selectedModelId = isAutoSelect ? 'auto-select' : model.id; _selectedModelId = isAutoSelect ? 'auto-select' : model.id;
}); });

386
lib/features/tools/widgets/unified_tools_modal.dart
View File

@@ -25,161 +25,184 @@ class _UnifiedToolsModalState extends ConsumerState<UnifiedToolsModal> {
final selectedToolIds = ref.watch(selectedToolIdsProvider); final selectedToolIds = ref.watch(selectedToolIdsProvider);
final toolsAsync = ref.watch(toolsListProvider); final toolsAsync = ref.watch(toolsListProvider);
final theme = context.conduitTheme;
return Container( return Container(
decoration: BoxDecoration( decoration: BoxDecoration(
color: context.conduitTheme.surfaceBackground, color: theme.surfaceBackground,
borderRadius: const BorderRadius.vertical( borderRadius: const BorderRadius.vertical(
top: Radius.circular(AppBorderRadius.bottomSheet), top: Radius.circular(AppBorderRadius.bottomSheet),
), ),
border: Border.all(color: theme.dividerColor, width: BorderWidth.regular),
boxShadow: ConduitShadows.modal, boxShadow: ConduitShadows.modal,
), ),
padding: const EdgeInsets.all(Spacing.bottomSheetPadding), child: SafeArea(
child: Column( top: false,
mainAxisSize: MainAxisSize.min, bottom: true,
children: [ child: ConstrainedBox(
// Handle bar constraints: BoxConstraints(
Container( maxHeight: MediaQuery.of(context).size.height * 0.8,
width: 40,
height: 4,
decoration: BoxDecoration(
color: context.conduitTheme.textPrimary.withValues(
alpha: Alpha.medium,
),
borderRadius: BorderRadius.circular(2),
),
), ),
const SizedBox(height: Spacing.lg), child: SingleChildScrollView(
padding: const EdgeInsets.all(Spacing.bottomSheetPadding),
// Title child: Column(
Text( crossAxisAlignment: CrossAxisAlignment.stretch,
'Tools & Search', children: [
style: AppTypography.headlineSmallStyle.copyWith( // Handle bar
color: context.conduitTheme.textPrimary, Center(
), child: Container(
), width: 40,
const SizedBox(height: Spacing.lg), height: 4,
decoration: BoxDecoration(
// Web Search Toggle color: theme.textPrimary.withValues(alpha: Alpha.medium),
_buildWebSearchToggle(webSearchEnabled), borderRadius: BorderRadius.circular(2),
const SizedBox(height: Spacing.md),
// Image Generation Toggle (conditionally shown)
if (imageGenAvailable) ...[
_buildImageGenerationToggle(imageGenEnabled),
const SizedBox(height: Spacing.md),
],
// Tools Section
toolsAsync.when(
data: (tools) {
if (tools.isEmpty) {
return Container(
width: double.infinity,
padding: const EdgeInsets.all(Spacing.md),
decoration: BoxDecoration(
color: context.conduitTheme.cardBackground,
borderRadius: BorderRadius.circular(AppBorderRadius.md),
border: Border.all(
color: context.conduitTheme.cardBorder,
width: BorderWidth.regular,
), ),
), ),
child: Text( ),
'No tools available', const SizedBox(height: Spacing.md),
style: AppTypography.bodySmallStyle.copyWith(
color: context.conduitTheme.textSecondary,
),
),
);
}
return Column( // Removed header for minimal, focused layout
crossAxisAlignment: CrossAxisAlignment.start,
children: [ // Web Search Toggle
Text( _buildWebSearchToggle(webSearchEnabled),
'Available Tools', const SizedBox(height: Spacing.md),
style: AppTypography.labelStyle.copyWith(
color: context.conduitTheme.textPrimary, // Image Generation Toggle (conditionally shown)
fontWeight: FontWeight.w600, if (imageGenAvailable) ...[
), _buildImageGenerationToggle(imageGenEnabled),
), const SizedBox(height: Spacing.md),
const SizedBox(height: Spacing.sm), ],
...tools.map(
(tool) => Padding( // Tools Section
padding: const EdgeInsets.only(bottom: Spacing.sm), toolsAsync.when(
child: _buildToolCard( data: (tools) {
tool, if (tools.isEmpty) {
selectedToolIds.contains(tool.id), return _buildNeutralCard(
child: Text(
'No tools available',
style: AppTypography.bodySmallStyle.copyWith(
color: theme.textSecondary,
),
),
);
}
return Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
_buildSectionHeader('Available Tools', tools.length),
const SizedBox(height: Spacing.sm),
...tools.map(
(tool) => Padding(
padding: const EdgeInsets.only(bottom: Spacing.sm),
child: _buildToolCard(
tool,
selectedToolIds.contains(tool.id),
),
),
),
],
);
},
loading: () => _buildNeutralCard(
child: const Center(
child: SizedBox(
width: 24,
height: 24,
child: CircularProgressIndicator(strokeWidth: 2),
),
),
),
error: (error, stack) => _buildNeutralCard(
child: Text(
'Failed to load tools',
style: AppTypography.bodySmallStyle.copyWith(
color: theme.error,
), ),
), ),
), ),
],
);
},
loading: () => Container(
width: double.infinity,
padding: const EdgeInsets.all(Spacing.md),
decoration: BoxDecoration(
color: context.conduitTheme.cardBackground,
borderRadius: BorderRadius.circular(AppBorderRadius.md),
border: Border.all(
color: context.conduitTheme.cardBorder,
width: BorderWidth.regular,
), ),
), ],
child: const Center(
child: SizedBox(
width: 24,
height: 24,
child: CircularProgressIndicator(strokeWidth: 2),
),
),
),
error: (error, stack) => Container(
width: double.infinity,
padding: const EdgeInsets.all(Spacing.md),
decoration: BoxDecoration(
color: context.conduitTheme.cardBackground,
borderRadius: BorderRadius.circular(AppBorderRadius.md),
border: Border.all(
color: context.conduitTheme.cardBorder,
width: BorderWidth.regular,
),
),
child: Text(
'Failed to load tools',
style: AppTypography.bodySmallStyle.copyWith(
color: context.conduitTheme.error,
),
),
), ),
), ),
], ),
), ),
); );
} }
Widget _buildWebSearchToggle(bool webSearchEnabled) { Widget _buildNeutralCard({required Widget child}) {
return GestureDetector( return Container(
onTap: () { width: double.infinity,
HapticFeedback.lightImpact(); padding: const EdgeInsets.all(Spacing.md),
ref.read(webSearchEnabledProvider.notifier).state = !webSearchEnabled; decoration: BoxDecoration(
}, color: context.conduitTheme.cardBackground,
child: Container( borderRadius: BorderRadius.circular(AppBorderRadius.md),
width: double.infinity, border: Border.all(
padding: const EdgeInsets.all(Spacing.md), color: context.conduitTheme.cardBorder,
decoration: BoxDecoration( width: BorderWidth.regular,
color: webSearchEnabled ),
? context.conduitTheme.buttonPrimary ),
: context.conduitTheme.cardBackground, child: child,
borderRadius: BorderRadius.circular(AppBorderRadius.md), );
border: Border.all( }
color: webSearchEnabled
? context.conduitTheme.buttonPrimary Widget _buildSectionHeader(String title, int count) {
: context.conduitTheme.cardBorder, final theme = context.conduitTheme;
width: BorderWidth.regular, return Row(
children: [
Text(
title,
style: AppTypography.bodySmallStyle.copyWith(
fontWeight: FontWeight.w600,
color: theme.textSecondary,
letterSpacing: 0.2,
), ),
), ),
const SizedBox(width: Spacing.xs),
Container(
padding: const EdgeInsets.symmetric(horizontal: 6, vertical: 2),
decoration: BoxDecoration(
color: theme.surfaceBackground.withValues(alpha: 0.6),
borderRadius: BorderRadius.circular(AppBorderRadius.xs),
border: Border.all(color: theme.dividerColor, width: BorderWidth.thin),
),
child: Text(
'$count',
style: AppTypography.bodySmallStyle.copyWith(
color: theme.textSecondary,
),
),
),
],
);
}
Widget _buildWebSearchToggle(bool webSearchEnabled) {
return Material(
color: Colors.transparent,
shape: RoundedRectangleBorder(
borderRadius: BorderRadius.circular(AppBorderRadius.md),
side: BorderSide(
color: webSearchEnabled
? context.conduitTheme.buttonPrimary
: context.conduitTheme.cardBorder,
width: BorderWidth.regular,
),
),
child: InkWell(
borderRadius: BorderRadius.circular(AppBorderRadius.md),
onTap: () {
HapticFeedback.lightImpact();
ref.read(webSearchEnabledProvider.notifier).state = !webSearchEnabled;
},
child: Container(
width: double.infinity,
padding: const EdgeInsets.all(Spacing.md),
decoration: BoxDecoration(
color: webSearchEnabled
? context.conduitTheme.buttonPrimary
: context.conduitTheme.cardBackground,
borderRadius: BorderRadius.circular(AppBorderRadius.md),
),
child: Row( child: Row(
children: [ children: [
Icon( Icon(
@@ -231,32 +254,39 @@ class _UnifiedToolsModalState extends ConsumerState<UnifiedToolsModal> {
), ),
], ],
), ),
),
), ),
); );
} }
Widget _buildImageGenerationToggle(bool imageGenEnabled) { Widget _buildImageGenerationToggle(bool imageGenEnabled) {
return GestureDetector( return Material(
onTap: () { color: Colors.transparent,
HapticFeedback.lightImpact(); shape: RoundedRectangleBorder(
ref.read(imageGenerationEnabledProvider.notifier).state = borderRadius: BorderRadius.circular(AppBorderRadius.md),
!imageGenEnabled; side: BorderSide(
},
child: Container(
width: double.infinity,
padding: const EdgeInsets.all(Spacing.md),
decoration: BoxDecoration(
color: imageGenEnabled color: imageGenEnabled
? context.conduitTheme.buttonPrimary ? context.conduitTheme.buttonPrimary
: context.conduitTheme.cardBackground, : context.conduitTheme.cardBorder,
borderRadius: BorderRadius.circular(AppBorderRadius.md), width: BorderWidth.regular,
border: Border.all( ),
),
child: InkWell(
borderRadius: BorderRadius.circular(AppBorderRadius.md),
onTap: () {
HapticFeedback.lightImpact();
ref.read(imageGenerationEnabledProvider.notifier).state =
!imageGenEnabled;
},
child: Container(
width: double.infinity,
padding: const EdgeInsets.all(Spacing.md),
decoration: BoxDecoration(
color: imageGenEnabled color: imageGenEnabled
? context.conduitTheme.buttonPrimary ? context.conduitTheme.buttonPrimary
: context.conduitTheme.cardBorder, : context.conduitTheme.cardBackground,
width: BorderWidth.regular, borderRadius: BorderRadius.circular(AppBorderRadius.md),
), ),
),
child: Row( child: Row(
children: [ children: [
Icon( Icon(
@@ -306,42 +336,49 @@ class _UnifiedToolsModalState extends ConsumerState<UnifiedToolsModal> {
), ),
], ],
), ),
),
), ),
); );
} }
Widget _buildToolCard(Tool tool, bool isSelected) { Widget _buildToolCard(Tool tool, bool isSelected) {
return GestureDetector( return Material(
onTap: () { color: Colors.transparent,
HapticFeedback.lightImpact(); shape: RoundedRectangleBorder(
final currentIds = ref.read(selectedToolIdsProvider); borderRadius: BorderRadius.circular(AppBorderRadius.md),
if (isSelected) { side: BorderSide(
ref.read(selectedToolIdsProvider.notifier).state = currentIds
.where((id) => id != tool.id)
.toList();
} else {
ref.read(selectedToolIdsProvider.notifier).state = [
...currentIds,
tool.id,
];
}
},
child: Container(
width: double.infinity,
padding: const EdgeInsets.all(Spacing.md),
decoration: BoxDecoration(
color: isSelected color: isSelected
? context.conduitTheme.buttonPrimary ? context.conduitTheme.buttonPrimary
: context.conduitTheme.cardBackground, : context.conduitTheme.cardBorder,
borderRadius: BorderRadius.circular(AppBorderRadius.md), width: BorderWidth.regular,
border: Border.all( ),
),
child: InkWell(
borderRadius: BorderRadius.circular(AppBorderRadius.md),
onTap: () {
HapticFeedback.lightImpact();
final currentIds = ref.read(selectedToolIdsProvider);
if (isSelected) {
ref.read(selectedToolIdsProvider.notifier).state = currentIds
.where((id) => id != tool.id)
.toList();
} else {
ref.read(selectedToolIdsProvider.notifier).state = [
...currentIds,
tool.id,
];
}
},
child: Container(
width: double.infinity,
padding: const EdgeInsets.all(Spacing.md),
decoration: BoxDecoration(
color: isSelected color: isSelected
? context.conduitTheme.buttonPrimary ? context.conduitTheme.buttonPrimary
: context.conduitTheme.cardBorder, : context.conduitTheme.cardBackground,
width: BorderWidth.regular, borderRadius: BorderRadius.circular(AppBorderRadius.md),
), ),
), child: Row(
child: Row(
children: [ children: [
Icon( Icon(
_getToolIcon(tool), _getToolIcon(tool),
@@ -391,6 +428,7 @@ class _UnifiedToolsModalState extends ConsumerState<UnifiedToolsModal> {
: context.conduitTheme.textSecondary, : context.conduitTheme.textSecondary,
), ),
], ],
),
), ),
), ),
); );