hordelab/hub
2
0 Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Chat Threads, ConversationAgent (WIP)

Browse Source
This commit is contained in:
Shivering Ocelot committed 2025-06-16 19:59:37 -05:00
1 parent 22fe5619d8
commit e8d80c5495
6 files changed
+519 -46
Download Patch File Download Diff File Expand all files Collapse all files

No files matched your search

frontend/lib/chat_screen.dart
+184 -43
View File
@@ -5,18 +5,32 @@ import 'styles.dart';
import 'backend.dart';
import 'dart:async';
class Message {
final int? id;
final String sender;
final String text;
final bool isFromUser;
abstract class ChatEntry {
String content;
bool isFromUser;
Message({required this.sender, required this.text, this.id}) : isFromUser = sender == "user";
ChatEntry({required this.content, required this.isFromUser});
Alignment get alignment => isFromUser ? Alignment.centerRight : Alignment.centerLeft;
EdgeInsets get padding => isFromUser ? EdgeInsets.zero : const EdgeInsets.only(left: 10);
}
class Message extends ChatEntry {
int? id;
String sender;
int? threadId;
Message({required this.sender, required content, this.id, this.threadId}) : super(content: content, isFromUser: sender == "user");
}
class ThreadHeader extends ChatEntry {
final int threadId;
final int messageCount;
ThreadHeader({required this.threadId, required this.messageCount})
: super(content: "Thread ($messageCount messages)", isFromUser: false);
}
class ChatScreen extends StatefulWidget {
final int chatId;
@@ -25,7 +39,9 @@ class ChatScreen extends StatefulWidget {
static Future<List<Message>> getChatMessages(int chatId) async {
final response = await Backend.sendAction("get-chat-messages", {'chatId': chatId});
List<dynamic> messageObjects = response['messages'];
List<Message> messages = messageObjects.map((msg) => Message(sender: msg['sender'], text: msg['content'])).toList();
List<Message> messages = messageObjects.map((msg) =>
Message(sender: msg['sender'], content: msg['content'], id: msg['id'], threadId: msg['threadId'])
).toList();
return messages;
}
@@ -34,8 +50,15 @@ class ChatScreen extends StatefulWidget {
}
class _ChatScreenState extends State<ChatScreen> {
// Chat State
String? _title;
List<Message> _messages = [];
int? currentThreadId;
// UI State
Set<int> expandedThreads = {};
// Internal Funcionality
Offset? _longPressOffset;
StreamSubscription? _chatSubscription;
final TextEditingController _textController = TextEditingController();
@@ -46,7 +69,7 @@ class _ChatScreenState extends State<ChatScreen> {
super.initState();
_loadInitialData();
_chatSubscription = Backend.chatMessages(widget.chatId).listen((data) {
final message = Message(sender: data['sender'], text: data['content']);
final message = Message(sender: data['sender'], content: data['content'], threadId: data['threadId']);
if (!message.isFromUser) {
addMessage(message);
}
@@ -70,9 +93,58 @@ class _ChatScreenState extends State<ChatScreen> {
setState(() {
_messages.addAll(initialMessages);
_title = chatInfo.name;
currentThreadId = initialMessages.last.threadId;
if (currentThreadId != null) {
expandedThreads.add(currentThreadId!);
}
});
}
List<ChatEntry> get displayEntries {
List<ChatEntry> result = [];
Map<int, List<Message>> threadGroups = {};
// First pass: Group messages by thread
for (var message in _messages) {
if (message.threadId != null) {
threadGroups.putIfAbsent(message.threadId!, () => []).add(message);
}
}
// Second pass: Build the display list with correct ordering
for (var message in _messages) {
if (message.threadId == null) {
// Non-threaded messages go directly to the result
result.add(message);
} else {
final threadId = message.threadId!;
final threadMessages = threadGroups[threadId]!;
// If expanded, add messages as they appear
if (expandedThreads.contains(threadId)) {
// Add the thread header before the first message
if (message == threadMessages.first) {
result.add(ThreadHeader(threadId: threadId, messageCount: threadMessages.length));
}
result.add(message);
} else {
// Add collapsed thread header in place of the last message
if (message == threadMessages.last) {
result.add(ThreadHeader(threadId: threadId, messageCount: threadMessages.length));
}
}
}
}
// Add current thread mannually if it has no messages
if (currentThreadId != null && !threadGroups.containsKey(currentThreadId!)) {
result.add(ThreadHeader(threadId: currentThreadId!, messageCount: 0));
}
return result;
}
void addMessage(Message message) {
setState(() {
_messages.add(message);
@@ -82,8 +154,12 @@ class _ChatScreenState extends State<ChatScreen> {
void sendMessage(String content) {
if (content.trim().isEmpty) return; // Don't send empty messages
_textController.clear();
final newMessage = Message(sender: "user", text: content);
Backend.sendAction("send-chat-message", {'chatId': widget.chatId, 'content': content}).then((response) {
final newMessage = Message(sender: "user", content: content, threadId: currentThreadId);
Backend.sendAction("send-chat-message", {
'chatId': widget.chatId,
'content': content,
'threadId': currentThreadId,
}).then((response) {
if (response['error'] != null) {
print("Error sending chat message: ${response['error']}");
}
@@ -91,6 +167,16 @@ class _ChatScreenState extends State<ChatScreen> {
addMessage(newMessage);
}
void createThread () async {
final response = await Backend.sendAction("create-chat-thread", {'chatId': widget.chatId});
if (response['threadId'] != null) {
setState(() {
currentThreadId = response['threadId'];
expandedThreads.add(currentThreadId!);
});
}
}
Color getMessageColor(BuildContext context) {
final backgroundColor = Theme.of(context).scaffoldBackgroundColor;
final messageColor = Color.alphaBlend(Colors.white.withOpacity(0.1), backgroundColor);
@@ -116,6 +202,12 @@ class _ChatScreenState extends State<ChatScreen> {
print('Edit clicked');
},
),
PopupMenuItem(
child: Text('Start Topic'),
onTap: () {
print('TODO: Start Topic from message');
},
),
PopupMenuItem(
child: Text('Delete'),
onTap: () {
@@ -126,6 +218,36 @@ class _ChatScreenState extends State<ChatScreen> {
],
);
}
Widget _buildThreadHeader(BuildContext context, ThreadHeader header) {
return GestureDetector(
onTap: () {
setState(() {
if (expandedThreads.contains(header.threadId)) {
expandedThreads.remove(header.threadId);
} else {
expandedThreads.add(header.threadId);
}
});
},
child: Container(
padding: EdgeInsets.all(8),
margin: EdgeInsets.symmetric(vertical: 4),
decoration: BoxDecoration(
color: getMessageColor(context),
borderRadius: BorderRadius.circular(4),
),
child: Row(
children: [
Icon(expandedThreads.contains(header.threadId)
? Icons.expand_less
: Icons.expand_more),
Text(header.content),
],
),
),
);
}
@override
Widget build(BuildContext context) {
@@ -144,42 +266,51 @@ class _ChatScreenState extends State<ChatScreen> {
children: [
Expanded(
child: ListView.builder(
itemCount: _messages.length,
itemCount: displayEntries.length,
itemBuilder: (context, index) {
final message = _messages[index];
return GestureDetector(
onLongPressStart: (details) {
_longPressOffset = details.globalPosition;
},
onLongPress: () {
_showMessageContextMenu(context, _longPressOffset!);
_longPressOffset = null;
},
onSecondaryTapUp: (details) {
_showMessageContextMenu(context, details.globalPosition);
},
child: Padding(
padding: isWideScreen ? message.padding : EdgeInsets.zero,
child: Align(
alignment: isWideScreen ? Alignment.centerLeft : message.alignment,
child: Container(
margin: EdgeInsets.symmetric(vertical: 2, horizontal: 8),
padding: EdgeInsets.all(10),
decoration: BoxDecoration(
color: getMessageColor(context),
borderRadius: BorderRadius.circular(12),
final entry = displayEntries[index];
if (entry is ThreadHeader) {
return _buildThreadHeader(context, entry);
} else if (entry is Message) {
final message = entry as Message;
return GestureDetector(
onLongPressStart: (details) {
_longPressOffset = details.globalPosition;
},
onLongPress: () {
_showMessageContextMenu(context, _longPressOffset!);
_longPressOffset = null;
},
onSecondaryTapUp: (details) {
_showMessageContextMenu(context, details.globalPosition);
},
child: Padding(
padding: isWideScreen ? message.padding : EdgeInsets.zero,
child: Align(
alignment: isWideScreen ? Alignment.centerLeft : message.alignment,
child: Container(
margin: EdgeInsets.symmetric(vertical: 2, horizontal: 8),
padding: EdgeInsets.all(10),
decoration: BoxDecoration(
color: getMessageColor(context),
borderRadius: BorderRadius.circular(12),
),
child: Text(message.content),
),
child: Text(message.text),
),
),
),
);
);
} else {
// Unknown entry type
return Text(entry.content);
}
},
),
),
Padding(
padding: const EdgeInsets.all(8.0),
child: Row(
child: Column(
children: [
Expanded(
child: KeyboardListener(
@@ -200,12 +331,22 @@ class _ChatScreenState extends State<ChatScreen> {
),
),
),
SizedBox(width: 8),
ElevatedButton(
onPressed: () {
sendMessage(_textController.text);
},
child: Text('Send'),
Row(
children: [
ElevatedButton(
onPressed: () {
sendMessage(_textController.text);
},
child: Text('Send'),
),
ElevatedButton(
onPressed: () {
createThread();
print("TODO: Start new topic");
},
child: Text('Start New Topic'),
),
],
),
],
),