859 lines
29 KiB
Dart
859 lines
29 KiB
Dart
import 'dart:convert';
|
|
import 'package:flutter/material.dart';
|
|
import '../../../shared/theme/theme_extensions.dart';
|
|
|
|
import 'package:flutter/cupertino.dart';
|
|
import 'package:flutter_riverpod/flutter_riverpod.dart';
|
|
import 'package:flutter_animate/flutter_animate.dart';
|
|
import 'dart:io' show Platform;
|
|
import '../../../core/providers/app_providers.dart';
|
|
|
|
class ModernMessageBubble extends ConsumerStatefulWidget {
|
|
final dynamic message;
|
|
final bool isUser;
|
|
final bool isStreaming;
|
|
final String? modelName;
|
|
final VoidCallback? onCopy;
|
|
final VoidCallback? onEdit;
|
|
final VoidCallback? onRegenerate;
|
|
final VoidCallback? onLike;
|
|
final VoidCallback? onDislike;
|
|
|
|
const ModernMessageBubble({
|
|
super.key,
|
|
required this.message,
|
|
required this.isUser,
|
|
this.isStreaming = false,
|
|
this.modelName,
|
|
this.onCopy,
|
|
this.onEdit,
|
|
this.onRegenerate,
|
|
this.onLike,
|
|
this.onDislike,
|
|
});
|
|
|
|
@override
|
|
ConsumerState<ModernMessageBubble> createState() =>
|
|
_ModernMessageBubbleState();
|
|
}
|
|
|
|
class _ModernMessageBubbleState extends ConsumerState<ModernMessageBubble>
|
|
with TickerProviderStateMixin {
|
|
bool _showActions = false;
|
|
late AnimationController _fadeController;
|
|
late AnimationController _slideController;
|
|
static const int _maxCachedImages = 24;
|
|
|
|
// Cache for image base64 data to prevent repeated API calls
|
|
final Map<String, String?> _imageCache = {};
|
|
|
|
@override
|
|
void initState() {
|
|
super.initState();
|
|
_fadeController = AnimationController(
|
|
duration: AnimationDuration.microInteraction,
|
|
vsync: this,
|
|
);
|
|
_slideController = AnimationController(
|
|
duration: AnimationDuration.messageSlide,
|
|
vsync: this,
|
|
);
|
|
}
|
|
|
|
@override
|
|
void dispose() {
|
|
_fadeController.dispose();
|
|
_slideController.dispose();
|
|
super.dispose();
|
|
}
|
|
|
|
void _toggleActions() {
|
|
setState(() {
|
|
_showActions = !_showActions;
|
|
});
|
|
|
|
if (_showActions) {
|
|
_fadeController.forward();
|
|
_slideController.forward();
|
|
} else {
|
|
_fadeController.reverse();
|
|
_slideController.reverse();
|
|
}
|
|
}
|
|
|
|
@override
|
|
Widget build(BuildContext context) {
|
|
if (widget.isUser) {
|
|
return _buildUserMessage();
|
|
} else {
|
|
return _buildAssistantMessage();
|
|
}
|
|
}
|
|
|
|
Widget _buildUserMessage() {
|
|
return Container(
|
|
width: double.infinity,
|
|
margin: const EdgeInsets.only(
|
|
bottom: Spacing.messagePadding,
|
|
left: Spacing.xxxl,
|
|
right: Spacing.xs,
|
|
),
|
|
child: Row(
|
|
mainAxisAlignment: MainAxisAlignment.end,
|
|
children: [
|
|
Flexible(
|
|
child: GestureDetector(
|
|
onLongPress: () => _toggleActions(),
|
|
child: Container(
|
|
padding: const EdgeInsets.symmetric(
|
|
horizontal: Spacing.messagePadding,
|
|
vertical: Spacing.sm,
|
|
),
|
|
decoration: BoxDecoration(
|
|
gradient: LinearGradient(
|
|
begin: Alignment.topLeft,
|
|
end: Alignment.bottomRight,
|
|
colors: [
|
|
context.conduitTheme.chatBubbleUser.withValues(
|
|
alpha: 0.95,
|
|
),
|
|
context.conduitTheme.chatBubbleUser,
|
|
],
|
|
),
|
|
borderRadius: BorderRadius.circular(
|
|
AppBorderRadius.messageBubble,
|
|
),
|
|
border: Border.all(
|
|
color: context.conduitTheme.chatBubbleUserBorder,
|
|
width: BorderWidth.regular,
|
|
),
|
|
boxShadow: ConduitShadows.high,
|
|
),
|
|
child: Column(
|
|
crossAxisAlignment: CrossAxisAlignment.start,
|
|
children: [
|
|
// Display images if any
|
|
if (widget.message.attachmentIds != null &&
|
|
widget.message.attachmentIds!.isNotEmpty)
|
|
_buildAttachmentImages(),
|
|
|
|
// Display text content if any
|
|
if (widget.message.content.isNotEmpty) ...[
|
|
if (widget.message.attachmentIds != null &&
|
|
widget.message.attachmentIds!.isNotEmpty)
|
|
const SizedBox(height: Spacing.sm),
|
|
_buildCustomText(
|
|
widget.message.content,
|
|
context.conduitTheme.chatBubbleUserText,
|
|
),
|
|
],
|
|
|
|
// Action buttons for user messages
|
|
if (_showActions) ...[
|
|
const SizedBox(height: Spacing.md),
|
|
_buildUserActionButtons(),
|
|
],
|
|
],
|
|
),
|
|
),
|
|
),
|
|
),
|
|
],
|
|
),
|
|
)
|
|
.animate()
|
|
.fadeIn(duration: AnimationDuration.messageAppear)
|
|
.slideX(
|
|
begin: AnimationValues.messageSlideDistance,
|
|
end: 0,
|
|
duration: AnimationDuration.messageSlide,
|
|
curve: AnimationCurves.messageSlide,
|
|
);
|
|
}
|
|
|
|
Widget _buildAssistantMessage() {
|
|
return Container(
|
|
width: double.infinity,
|
|
margin: const EdgeInsets.only(
|
|
bottom: Spacing.lg,
|
|
left: Spacing.xs,
|
|
right: Spacing.xxxl,
|
|
),
|
|
child: Column(
|
|
crossAxisAlignment: CrossAxisAlignment.start,
|
|
children: [
|
|
// Simplified AI Name and Avatar
|
|
Padding(
|
|
padding: const EdgeInsets.only(bottom: 12),
|
|
child: Row(
|
|
children: [
|
|
Container(
|
|
width: 20,
|
|
height: 20,
|
|
decoration: BoxDecoration(
|
|
gradient: LinearGradient(
|
|
colors: [
|
|
context.conduitTheme.buttonPrimary.withValues(
|
|
alpha: 0.9,
|
|
),
|
|
context.conduitTheme.buttonPrimary,
|
|
],
|
|
),
|
|
borderRadius: BorderRadius.circular(
|
|
AppBorderRadius.small,
|
|
),
|
|
),
|
|
child: Icon(
|
|
Icons.auto_awesome,
|
|
color: context.conduitTheme.buttonPrimaryText,
|
|
size: 12,
|
|
),
|
|
),
|
|
const SizedBox(width: Spacing.xs),
|
|
Text(
|
|
widget.modelName ?? 'Assistant',
|
|
style: TextStyle(
|
|
color: context.conduitTheme.textSecondary,
|
|
fontSize: AppTypography.bodySmall,
|
|
fontWeight: FontWeight.w500,
|
|
letterSpacing: 0.1,
|
|
),
|
|
),
|
|
],
|
|
),
|
|
),
|
|
|
|
// Message Content
|
|
GestureDetector(
|
|
onLongPress: () => _toggleActions(),
|
|
child: Container(
|
|
padding: const EdgeInsets.all(Spacing.messagePadding),
|
|
decoration: BoxDecoration(
|
|
color: context.conduitTheme.chatBubbleAssistant,
|
|
borderRadius: BorderRadius.circular(
|
|
AppBorderRadius.messageBubble,
|
|
),
|
|
border: Border.all(
|
|
color: context.conduitTheme.chatBubbleAssistantBorder,
|
|
width: BorderWidth.regular,
|
|
),
|
|
boxShadow: ConduitShadows.low,
|
|
),
|
|
child: Column(
|
|
crossAxisAlignment: CrossAxisAlignment.start,
|
|
children: [
|
|
// Check for typing indicator - show for empty content OR explicit typing indicator during streaming
|
|
if ((widget.message.content.isEmpty ||
|
|
widget.message.content == '[TYPING_INDICATOR]') &&
|
|
widget.isStreaming) ...[
|
|
_buildTypingIndicator(),
|
|
] else if (widget.message.content.isNotEmpty &&
|
|
widget.message.content != '[TYPING_INDICATOR]') ...[
|
|
_buildCustomText(
|
|
widget.message.content,
|
|
context.conduitTheme.chatBubbleAssistantText,
|
|
),
|
|
] else
|
|
// Fallback: show empty state for non-streaming empty messages
|
|
const SizedBox.shrink(),
|
|
|
|
// Action buttons
|
|
if (_showActions) ...[
|
|
const SizedBox(height: Spacing.md),
|
|
_buildActionButtons(),
|
|
],
|
|
],
|
|
),
|
|
),
|
|
),
|
|
],
|
|
),
|
|
)
|
|
.animate()
|
|
.fadeIn(duration: AnimationDuration.messageAppear)
|
|
.slideX(
|
|
begin: -AnimationValues.messageSlideDistance,
|
|
end: 0,
|
|
duration: AnimationDuration.messageSlide,
|
|
curve: AnimationCurves.messageSlide,
|
|
);
|
|
}
|
|
|
|
Widget _buildAttachmentImages() {
|
|
if (widget.message.attachmentIds == null ||
|
|
widget.message.attachmentIds!.isEmpty) {
|
|
return const SizedBox.shrink();
|
|
}
|
|
|
|
return Column(
|
|
crossAxisAlignment: CrossAxisAlignment.start,
|
|
children: widget.message.attachmentIds!.map<Widget>((attachmentId) {
|
|
return Consumer(
|
|
builder: (context, ref, child) {
|
|
final api = ref.watch(apiServiceProvider);
|
|
if (api == null) return const SizedBox.shrink();
|
|
|
|
return FutureBuilder<String?>(
|
|
future: _getCachedImageBase64(api, attachmentId),
|
|
builder: (context, snapshot) {
|
|
if (snapshot.connectionState == ConnectionState.waiting) {
|
|
return Container(
|
|
height: 150,
|
|
width: 200,
|
|
margin: const EdgeInsets.only(bottom: Spacing.xs),
|
|
decoration: BoxDecoration(
|
|
color: context.conduitTheme.surfaceBackground.withValues(
|
|
alpha: 0.5,
|
|
),
|
|
borderRadius: BorderRadius.circular(AppBorderRadius.sm),
|
|
),
|
|
child: Center(
|
|
child: CircularProgressIndicator(
|
|
color: context.conduitTheme.buttonPrimary,
|
|
strokeWidth: 2,
|
|
),
|
|
),
|
|
);
|
|
}
|
|
|
|
if (snapshot.hasError ||
|
|
!snapshot.hasData ||
|
|
snapshot.data == null) {
|
|
return Container(
|
|
height: 100,
|
|
width: 150,
|
|
margin: const EdgeInsets.only(bottom: Spacing.xs),
|
|
decoration: BoxDecoration(
|
|
color: context.conduitTheme.surfaceBackground.withValues(
|
|
alpha: 0.3,
|
|
),
|
|
borderRadius: BorderRadius.circular(AppBorderRadius.sm),
|
|
border: Border.all(
|
|
color: context.conduitTheme.textSecondary.withValues(
|
|
alpha: 0.3,
|
|
),
|
|
),
|
|
),
|
|
child: Column(
|
|
mainAxisAlignment: MainAxisAlignment.center,
|
|
children: [
|
|
Icon(
|
|
Icons.broken_image_outlined,
|
|
color: context.conduitTheme.textSecondary,
|
|
size: 32,
|
|
),
|
|
const SizedBox(height: Spacing.xs),
|
|
Text(
|
|
'Image unavailable',
|
|
style: TextStyle(
|
|
color: context.conduitTheme.textSecondary,
|
|
fontSize: AppTypography.bodySmall,
|
|
),
|
|
),
|
|
],
|
|
),
|
|
);
|
|
}
|
|
|
|
final base64Data = snapshot.data!;
|
|
try {
|
|
// Handle data URLs (data:image/...;base64,...)
|
|
String actualBase64;
|
|
if (base64Data.startsWith('data:')) {
|
|
// Extract base64 part from data URL
|
|
final commaIndex = base64Data.indexOf(',');
|
|
if (commaIndex != -1) {
|
|
actualBase64 = base64Data.substring(commaIndex + 1);
|
|
} else {
|
|
throw Exception('Invalid data URL format');
|
|
}
|
|
} else {
|
|
// Direct base64 string
|
|
actualBase64 = base64Data;
|
|
}
|
|
|
|
final imageBytes = base64.decode(actualBase64);
|
|
return Container(
|
|
margin: const EdgeInsets.only(bottom: Spacing.xs),
|
|
constraints: const BoxConstraints(
|
|
maxWidth: 300,
|
|
maxHeight: 300,
|
|
),
|
|
child: ClipRRect(
|
|
borderRadius: BorderRadius.circular(AppBorderRadius.sm),
|
|
child: Image.memory(
|
|
imageBytes,
|
|
fit: BoxFit.cover,
|
|
errorBuilder: (context, error, stackTrace) {
|
|
return Container(
|
|
height: 100,
|
|
width: 150,
|
|
decoration: BoxDecoration(
|
|
color: context.conduitTheme.surfaceBackground
|
|
.withValues(alpha: 0.3),
|
|
borderRadius: BorderRadius.circular(
|
|
AppBorderRadius.sm,
|
|
),
|
|
),
|
|
child: Column(
|
|
mainAxisAlignment: MainAxisAlignment.center,
|
|
children: [
|
|
Icon(
|
|
Icons.error_outline,
|
|
color: context.conduitTheme.error,
|
|
size: 32,
|
|
),
|
|
const SizedBox(height: Spacing.xs),
|
|
Text(
|
|
'Failed to load image',
|
|
style: TextStyle(
|
|
color: context.conduitTheme.error,
|
|
fontSize: AppTypography.bodySmall,
|
|
),
|
|
),
|
|
],
|
|
),
|
|
);
|
|
},
|
|
),
|
|
),
|
|
);
|
|
} catch (e) {
|
|
return Container(
|
|
height: 100,
|
|
width: 150,
|
|
margin: const EdgeInsets.only(bottom: Spacing.xs),
|
|
decoration: BoxDecoration(
|
|
color: context.conduitTheme.surfaceBackground.withValues(
|
|
alpha: 0.3,
|
|
),
|
|
borderRadius: BorderRadius.circular(AppBorderRadius.sm),
|
|
),
|
|
child: Column(
|
|
mainAxisAlignment: MainAxisAlignment.center,
|
|
children: [
|
|
Icon(
|
|
Icons.error_outline,
|
|
color: context.conduitTheme.error,
|
|
size: 32,
|
|
),
|
|
const SizedBox(height: Spacing.xs),
|
|
Text(
|
|
'Invalid image format',
|
|
style: TextStyle(
|
|
color: context.conduitTheme.error,
|
|
fontSize: AppTypography.bodySmall,
|
|
),
|
|
),
|
|
],
|
|
),
|
|
);
|
|
}
|
|
},
|
|
);
|
|
},
|
|
);
|
|
}).toList(),
|
|
);
|
|
}
|
|
|
|
Future<String?> _getCachedImageBase64(dynamic api, String fileId) async {
|
|
// Check cache first to prevent repeated API calls
|
|
if (_imageCache.containsKey(fileId)) {
|
|
return _imageCache[fileId];
|
|
}
|
|
|
|
// If not in cache, get the image and cache it
|
|
final result = await _getImageBase64(api, fileId);
|
|
// Simple LRU-like eviction to bound memory
|
|
if (_imageCache.length >= _maxCachedImages) {
|
|
_imageCache.remove(_imageCache.keys.first);
|
|
}
|
|
_imageCache[fileId] = result;
|
|
return result;
|
|
}
|
|
|
|
Future<String?> _getImageBase64(dynamic api, String fileId) async {
|
|
try {
|
|
// Check if this is already a data URL (for images)
|
|
if (fileId.startsWith('data:')) {
|
|
return fileId;
|
|
}
|
|
|
|
// First, get file info to determine if it's an image
|
|
final fileInfo = await api.getFileInfo(fileId);
|
|
final fileName =
|
|
fileInfo['filename'] ??
|
|
fileInfo['meta']?['name'] ??
|
|
fileInfo['name'] ??
|
|
fileInfo['file_name'] ??
|
|
fileInfo['original_name'] ??
|
|
fileInfo['original_filename'] ??
|
|
'';
|
|
final ext = fileName.toLowerCase().split('.').last;
|
|
|
|
// Only process image files
|
|
if (!['jpg', 'jpeg', 'png', 'gif', 'webp'].contains(ext)) {
|
|
debugPrint('DEBUG: Skipping non-image file: $fileName');
|
|
return null;
|
|
}
|
|
|
|
// Get file content as base64 string
|
|
final fileContent = await api.getFileContent(fileId);
|
|
return fileContent;
|
|
} catch (e) {
|
|
debugPrint('DEBUG: Error getting image content for $fileId: $e');
|
|
return null;
|
|
}
|
|
}
|
|
|
|
Widget _buildCustomText(String text, [Color? textColor]) {
|
|
// Simple markdown-like parsing for efficiency
|
|
final lines = text.split('\n');
|
|
final widgets = <Widget>[];
|
|
|
|
for (int i = 0; i < lines.length; i++) {
|
|
final line = lines[i];
|
|
if (line.trim().isEmpty) {
|
|
if (i < lines.length - 1) {
|
|
widgets.add(const SizedBox(height: Spacing.sm));
|
|
}
|
|
continue;
|
|
}
|
|
|
|
// Parse basic markdown
|
|
Widget textWidget = _parseMarkdownLine(line, textColor);
|
|
|
|
if (i < lines.length - 1) {
|
|
widgets.add(textWidget);
|
|
widgets.add(const SizedBox(height: Spacing.xs));
|
|
} else {
|
|
widgets.add(textWidget);
|
|
}
|
|
}
|
|
|
|
return Column(
|
|
crossAxisAlignment: CrossAxisAlignment.start,
|
|
children: widgets,
|
|
);
|
|
}
|
|
|
|
Widget _parseMarkdownLine(String line, [Color? textColor]) {
|
|
// Handle code blocks
|
|
if (line.startsWith('```')) {
|
|
return Container(
|
|
margin: const EdgeInsets.symmetric(vertical: Spacing.xs),
|
|
padding: const EdgeInsets.all(Spacing.md),
|
|
decoration: BoxDecoration(
|
|
color: context.conduitTheme.surfaceBackground.withValues(
|
|
alpha: Alpha.badgeBackground,
|
|
),
|
|
borderRadius: BorderRadius.circular(AppBorderRadius.sm),
|
|
border: Border.all(
|
|
color: context.conduitTheme.textPrimary.withValues(
|
|
alpha: Alpha.subtle,
|
|
),
|
|
width: BorderWidth.regular,
|
|
),
|
|
),
|
|
child: Text(
|
|
line.substring(3),
|
|
style: AppTypography.chatCodeStyle.copyWith(
|
|
color: textColor ?? context.conduitTheme.textSecondary,
|
|
),
|
|
),
|
|
)
|
|
.animate()
|
|
.fadeIn(duration: AnimationDuration.microInteraction)
|
|
.slideX(
|
|
begin: 0.1,
|
|
end: 0,
|
|
duration: AnimationDuration.microInteraction,
|
|
);
|
|
}
|
|
|
|
// Handle headers
|
|
if (line.startsWith('#')) {
|
|
int level = 0;
|
|
while (level < line.length && line[level] == '#') {
|
|
level++;
|
|
}
|
|
final fontSize = AppTypography.headlineMedium - (level * 2);
|
|
return Text(
|
|
line.substring(level).trim(),
|
|
style: AppTypography.headlineMediumStyle.copyWith(
|
|
color: textColor ?? context.conduitTheme.textPrimary,
|
|
fontSize: fontSize.toDouble(),
|
|
),
|
|
)
|
|
.animate()
|
|
.fadeIn(duration: AnimationDuration.microInteraction)
|
|
.slideX(
|
|
begin: 0.1,
|
|
end: 0,
|
|
duration: AnimationDuration.microInteraction,
|
|
);
|
|
}
|
|
|
|
// Handle inline code
|
|
if (line.contains('`')) {
|
|
final parts = line.split('`');
|
|
final widgets = <Widget>[];
|
|
|
|
for (int i = 0; i < parts.length; i++) {
|
|
if (parts[i].isNotEmpty) {
|
|
if (i % 2 == 1) {
|
|
// Inline code
|
|
widgets.add(
|
|
Container(
|
|
padding: const EdgeInsets.symmetric(
|
|
horizontal: Spacing.xs + Spacing.xxs,
|
|
vertical: Spacing.xxs,
|
|
),
|
|
decoration: BoxDecoration(
|
|
color: context.conduitTheme.textPrimary.withValues(
|
|
alpha: Alpha.badgeBackground,
|
|
),
|
|
borderRadius: BorderRadius.circular(AppBorderRadius.xs),
|
|
),
|
|
child: Text(
|
|
parts[i],
|
|
style: AppTypography.chatCodeStyle.copyWith(
|
|
color: textColor ?? context.conduitTheme.textSecondary,
|
|
),
|
|
),
|
|
),
|
|
);
|
|
} else {
|
|
// Regular text
|
|
widgets.add(
|
|
Text(
|
|
parts[i],
|
|
style: AppTypography.chatMessageStyle.copyWith(
|
|
color: textColor ?? context.conduitTheme.textPrimary,
|
|
),
|
|
),
|
|
);
|
|
}
|
|
}
|
|
}
|
|
|
|
return Wrap(
|
|
crossAxisAlignment: WrapCrossAlignment.start,
|
|
children: widgets,
|
|
)
|
|
.animate()
|
|
.fadeIn(duration: AnimationDuration.microInteraction)
|
|
.slideX(
|
|
begin: 0.1,
|
|
end: 0,
|
|
duration: AnimationDuration.microInteraction,
|
|
);
|
|
}
|
|
|
|
// Regular text
|
|
return Text(
|
|
line,
|
|
style: AppTypography.chatMessageStyle.copyWith(
|
|
color: textColor ?? context.conduitTheme.textPrimary,
|
|
letterSpacing: 0.1,
|
|
),
|
|
)
|
|
.animate()
|
|
.fadeIn(duration: AnimationDuration.microInteraction)
|
|
.slideX(
|
|
begin: 0.1,
|
|
end: 0,
|
|
duration: AnimationDuration.microInteraction,
|
|
);
|
|
}
|
|
|
|
Widget _buildTypingIndicator() {
|
|
return Consumer(
|
|
builder: (context, ref, child) {
|
|
// Show only animated dots, no text
|
|
return _buildTypingDots();
|
|
},
|
|
);
|
|
}
|
|
|
|
Widget _buildTypingDots() {
|
|
return Row(
|
|
children: List.generate(3, (index) {
|
|
return Container(
|
|
margin: EdgeInsets.only(right: index < 2 ? Spacing.xs : 0),
|
|
width: 6,
|
|
height: 6,
|
|
decoration: BoxDecoration(
|
|
color: context.conduitTheme.loadingIndicator,
|
|
borderRadius: BorderRadius.circular(3),
|
|
),
|
|
)
|
|
.animate(onPlay: (controller) => controller.repeat())
|
|
.scale(
|
|
duration: AnimationDuration.typingIndicator,
|
|
begin: const Offset(
|
|
AnimationValues.typingIndicatorScale,
|
|
AnimationValues.typingIndicatorScale,
|
|
),
|
|
end: const Offset(1.0, 1.0),
|
|
curve: AnimationCurves.typingIndicator,
|
|
delay: Duration(
|
|
milliseconds: index * 200,
|
|
), // Stagger the animation
|
|
);
|
|
}),
|
|
);
|
|
}
|
|
|
|
Widget _buildActionButtons() {
|
|
final isErrorMessage = widget.message.content.contains('⚠️') ||
|
|
widget.message.content.contains('Error') ||
|
|
widget.message.content.contains('timeout') ||
|
|
widget.message.content.contains('retry options');
|
|
|
|
return Wrap(
|
|
spacing: Spacing.sm,
|
|
runSpacing: Spacing.sm,
|
|
children: [
|
|
_buildActionButton(
|
|
icon: Platform.isIOS
|
|
? CupertinoIcons.doc_on_clipboard
|
|
: Icons.content_copy,
|
|
label: 'Copy',
|
|
onTap: widget.onCopy,
|
|
),
|
|
if (isErrorMessage) ...[
|
|
_buildActionButton(
|
|
icon: Platform.isIOS ? CupertinoIcons.arrow_clockwise : Icons.refresh,
|
|
label: 'Retry',
|
|
onTap: widget.onRegenerate,
|
|
),
|
|
] else ...[
|
|
_buildActionButton(
|
|
icon: Platform.isIOS ? CupertinoIcons.pencil : Icons.edit_outlined,
|
|
label: 'Edit',
|
|
onTap: widget.onEdit,
|
|
),
|
|
_buildActionButton(
|
|
icon: Platform.isIOS
|
|
? CupertinoIcons.speaker_1
|
|
: Icons.volume_up_outlined,
|
|
label: 'Read',
|
|
onTap: () => _handleTextToSpeech(context),
|
|
),
|
|
_buildActionButton(
|
|
icon: Platform.isIOS
|
|
? CupertinoIcons.hand_thumbsup
|
|
: Icons.thumb_up_outlined,
|
|
label: 'Like',
|
|
onTap: widget.onLike,
|
|
),
|
|
_buildActionButton(
|
|
icon: Platform.isIOS
|
|
? CupertinoIcons.hand_thumbsdown
|
|
: Icons.thumb_down_outlined,
|
|
label: 'Dislike',
|
|
onTap: widget.onDislike,
|
|
),
|
|
_buildActionButton(
|
|
icon: Platform.isIOS ? CupertinoIcons.refresh : Icons.refresh,
|
|
label: 'Regenerate',
|
|
onTap: widget.onRegenerate,
|
|
),
|
|
],
|
|
],
|
|
);
|
|
}
|
|
|
|
Widget _buildActionButton({
|
|
required IconData icon,
|
|
required String label,
|
|
VoidCallback? onTap,
|
|
}) {
|
|
return GestureDetector(
|
|
onTap: onTap,
|
|
child: Container(
|
|
padding: const EdgeInsets.symmetric(
|
|
horizontal: Spacing.actionButtonPadding,
|
|
vertical: Spacing.xs,
|
|
),
|
|
decoration: BoxDecoration(
|
|
color: context.conduitTheme.surfaceBackground.withValues(
|
|
alpha: Alpha.buttonHover,
|
|
),
|
|
borderRadius: BorderRadius.circular(AppBorderRadius.actionButton),
|
|
border: Border.all(
|
|
color: context.conduitTheme.textPrimary.withValues(
|
|
alpha: Alpha.subtle,
|
|
),
|
|
width: BorderWidth.regular,
|
|
),
|
|
),
|
|
child: Row(
|
|
mainAxisSize: MainAxisSize.min,
|
|
children: [
|
|
Icon(
|
|
icon,
|
|
size: IconSize.small,
|
|
color: context.conduitTheme.iconSecondary,
|
|
),
|
|
const SizedBox(width: Spacing.xs),
|
|
Text(
|
|
label,
|
|
style: AppTypography.labelStyle.copyWith(
|
|
color: context.conduitTheme.textSecondary,
|
|
),
|
|
),
|
|
],
|
|
),
|
|
),
|
|
).animate().scale(
|
|
duration: AnimationDuration.buttonPress,
|
|
curve: AnimationCurves.buttonPress,
|
|
);
|
|
}
|
|
|
|
Widget _buildUserActionButtons() {
|
|
return Wrap(
|
|
spacing: Spacing.sm,
|
|
runSpacing: Spacing.sm,
|
|
children: [
|
|
_buildActionButton(
|
|
icon: Platform.isIOS ? CupertinoIcons.pencil : Icons.edit_outlined,
|
|
label: 'Edit',
|
|
onTap: widget.onEdit,
|
|
),
|
|
_buildActionButton(
|
|
icon: Platform.isIOS
|
|
? CupertinoIcons.doc_on_clipboard
|
|
: Icons.content_copy,
|
|
label: 'Copy',
|
|
onTap: widget.onCopy,
|
|
),
|
|
_buildActionButton(
|
|
icon: Platform.isIOS
|
|
? CupertinoIcons.speaker_1
|
|
: Icons.volume_up_outlined,
|
|
label: 'Read',
|
|
onTap: () => _handleTextToSpeech(context),
|
|
),
|
|
],
|
|
);
|
|
}
|
|
|
|
void _handleTextToSpeech(BuildContext context) {
|
|
// Implementation for text-to-speech functionality
|
|
ScaffoldMessenger.of(context).showSnackBar(
|
|
SnackBar(
|
|
content: Text('Text-to-speech feature coming soon!'),
|
|
backgroundColor: context.conduitTheme.info,
|
|
behavior: SnackBarBehavior.floating,
|
|
shape: RoundedRectangleBorder(
|
|
borderRadius: BorderRadius.circular(AppBorderRadius.snackbar),
|
|
),
|
|
),
|
|
);
|
|
}
|
|
}
|