Hydrogen/Solian
2
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

✨ Basic event based rendering

Browse Source
This commit is contained in:
LittleSheep
2024-06-28 00:59:11 +08:00
parent bbc9ea69f7
commit 78f9ad941b
11 changed files with 352 additions and 275 deletions
Download Patch File Download Diff File Expand all files Collapse all files

139
lib/widgets/chat/chat_event.dart Normal file
View File

@ -0,0 +1,139 @@
import 'package:flutter/material.dart';
import 'package:font_awesome_flutter/font_awesome_flutter.dart';
import 'package:get/get.dart';
import 'package:solian/models/event.dart';
import 'package:solian/widgets/account/account_avatar.dart';
import 'package:solian/widgets/account/account_profile_popup.dart';
import 'package:solian/widgets/chat/chat_event_action_log.dart';
import 'package:solian/widgets/chat/chat_event_message.dart';
import 'package:timeago/timeago.dart' show format;
class ChatEvent extends StatelessWidget {
final Event item;
final bool isContentPreviewing;
final bool isQuote;
final bool isMerged;
final bool isHasMerged;
const ChatEvent({
super.key,
required this.item,
this.isContentPreviewing = false,
this.isMerged = false,
this.isHasMerged = false,
this.isQuote = false,
});
Widget buildContent() {
switch (item.type) {
case 'messages.new':
return ChatEventMessage(
item: item,
isContentPreviewing: isContentPreviewing,
isMerged: isMerged,
isHasMerged: isHasMerged,
isQuote: isQuote,
);
case 'messages.edit':
return ChatEventMessageActionLog(
icon: const Icon(Icons.edit_note, size: 16),
text: 'messageEditDesc'.trParams({'id': '#${item.id}'}),
isMerged: isMerged,
isHasMerged: isHasMerged,
);
case 'messages.delete':
return ChatEventMessageActionLog(
icon: const Icon(Icons.cancel_schedule_send, size: 16),
text: 'messageDeleteDesc'.trParams({'id': '#${item.id}'}),
isMerged: isMerged,
isHasMerged: isHasMerged,
);
case 'system.changes':
return ChatEventMessageActionLog(
icon: const Icon(Icons.manage_history, size: 16),
text: item.body['text'],
isMerged: isMerged,
isHasMerged: isHasMerged,
);
default:
return ChatEventMessageActionLog(
icon: const Icon(Icons.error, size: 16),
text: 'messageTypeUnsupported'.trParams({'type': item.type}),
isMerged: isMerged,
isHasMerged: isHasMerged,
);
}
}
Widget buildBody(BuildContext context) {
if (isContentPreviewing || isMerged) {
return buildContent();
} else if (isQuote) {
return Row(
mainAxisAlignment: MainAxisAlignment.center,
children: [
Transform.scale(
scaleX: -1,
child: const FaIcon(FontAwesomeIcons.reply, size: 14),
),
const SizedBox(width: 12),
AccountAvatar(content: item.sender.account.avatar, radius: 8),
const SizedBox(width: 4),
Text(
item.sender.account.nick,
style: const TextStyle(fontWeight: FontWeight.bold),
),
Expanded(child: buildContent()),
],
);
} else {
return Column(
key: Key('m${item.uuid}'),
children: [
Row(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
GestureDetector(
child: AccountAvatar(content: item.sender.account.avatar),
onTap: () {
showModalBottomSheet(
useRootNavigator: true,
isScrollControlled: true,
backgroundColor: Theme.of(context).colorScheme.surface,
context: context,
builder: (context) => AccountProfilePopup(
account: item.sender.account,
),
);
},
),
Expanded(
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Row(
children: [
Text(
item.sender.account.nick,
style: const TextStyle(fontWeight: FontWeight.bold),
),
const SizedBox(width: 4),
Text(format(item.createdAt, locale: 'en_short'))
],
).paddingSymmetric(horizontal: 12),
buildContent(),
],
),
),
],
).paddingSymmetric(horizontal: 12),
],
);
}
}
@override
Widget build(BuildContext context) {
return buildBody(context);
}
}

14
lib/widgets/chat/chat_message_action.dart → lib/widgets/chat/chat_event_action.dart
View File

@ -6,16 +6,16 @@ import 'package:solian/models/channel.dart';
import 'package:solian/models/event.dart';
import 'package:solian/models/realm.dart';
import 'package:solian/providers/auth.dart';
import 'package:solian/widgets/chat/chat_message_deletion.dart';
import 'package:solian/widgets/chat/chat_event_deletion.dart';
class ChatMessageAction extends StatefulWidget {
class ChatEventAction extends StatefulWidget {
final Channel channel;
final Realm? realm;
final Event item;
final Function? onEdit;
final Function? onReply;
const ChatMessageAction({
const ChatEventAction({
super.key,
required this.channel,
required this.realm,
@ -25,14 +25,16 @@ class ChatMessageAction extends StatefulWidget {
});
@override
State<ChatMessageAction> createState() => _ChatMessageActionState();
State<ChatEventAction> createState() => _ChatEventActionState();
}
class _ChatMessageActionState extends State<ChatMessageAction> {
class _ChatEventActionState extends State<ChatEventAction> {
bool _isBusy = false;
bool _canModifyContent = false;
void checkAbleToModifyContent() async {
if (!['messages.new'].contains(widget.item.type)) return;
final AuthProvider provider = Get.find();
if (!await provider.isAuthorized) return;
@ -106,7 +108,7 @@ class _ChatMessageActionState extends State<ChatMessageAction> {
onTap: () async {
final value = await showDialog(
context: context,
builder: (context) => ChatMessageDeletionDialog(
builder: (context) => ChatEventDeletionDialog(
channel: widget.channel,
realm: widget.realm,
item: widget.item,

43
lib/widgets/chat/chat_event_action_log.dart Normal file
View File

@ -0,0 +1,43 @@
import 'dart:math';
import 'package:flutter/material.dart';
import 'package:flutter_markdown/flutter_markdown.dart';
import 'package:get/get.dart';
import 'package:solian/models/event.dart';
import 'package:solian/widgets/attachments/attachment_list.dart';
import 'package:timeago/timeago.dart' show format;
import 'package:url_launcher/url_launcher_string.dart';
class ChatEventMessageActionLog extends StatelessWidget {
final Widget icon;
final String text;
final bool isMerged;
final bool isHasMerged;
const ChatEventMessageActionLog({
super.key,
required this.icon,
required this.text,
this.isMerged = false,
this.isHasMerged = false,
});
@override
Widget build(BuildContext context) {
return Opacity(
opacity: 0.75,
child: Row(
crossAxisAlignment: CrossAxisAlignment.center,
children: [
icon,
const SizedBox(width: 4),
Text(text),
],
).paddingOnly(
left: isMerged ? 64 : 12,
top: 2,
bottom: isHasMerged ? 2 : 0,
),
);
}
}

10
lib/widgets/chat/chat_message_deletion.dart → lib/widgets/chat/chat_event_deletion.dart
View File

@ -6,12 +6,12 @@ import 'package:solian/models/event.dart';
import 'package:solian/models/realm.dart';
import 'package:solian/providers/auth.dart';
class ChatMessageDeletionDialog extends StatefulWidget {
class ChatEventDeletionDialog extends StatefulWidget {
final Channel channel;
final Realm? realm;
final Event item;
const ChatMessageDeletionDialog({
const ChatEventDeletionDialog({
super.key,
required this.channel,
required this.realm,
@ -19,11 +19,11 @@ class ChatMessageDeletionDialog extends StatefulWidget {
});
@override
State<ChatMessageDeletionDialog> createState() =>
_ChatMessageDeletionDialogState();
State<ChatEventDeletionDialog> createState() =>
_ChatEventDeletionDialogState();
}
class _ChatMessageDeletionDialogState extends State<ChatMessageDeletionDialog> {
class _ChatEventDeletionDialogState extends State<ChatEventDeletionDialog> {
bool _isBusy = false;
void performAction() async {

93
lib/widgets/chat/chat_event_message.dart Normal file
View File

@ -0,0 +1,93 @@
import 'dart:math';
import 'package:flutter/material.dart';
import 'package:flutter_markdown/flutter_markdown.dart';
import 'package:get/get.dart';
import 'package:solian/models/event.dart';
import 'package:solian/widgets/attachments/attachment_list.dart';
import 'package:url_launcher/url_launcher_string.dart';
class ChatEventMessage extends StatelessWidget {
final Event item;
final bool isContentPreviewing;
final bool isQuote;
final bool isMerged;
final bool isHasMerged;
const ChatEventMessage({
super.key,
required this.item,
this.isContentPreviewing = false,
this.isMerged = false,
this.isHasMerged = false,
this.isQuote = false,
});
Widget buildContent() {
final body = EventMessageBody.fromJson(item.body);
final hasAttachment = body.attachments?.isNotEmpty ?? false;
return Markdown(
shrinkWrap: true,
physics: const NeverScrollableScrollPhysics(),
data: body.text,
selectable: true,
padding: const EdgeInsets.all(0),
onTapLink: (text, href, title) async {
if (href == null) return;
await launchUrlString(
href,
mode: LaunchMode.externalApplication,
);
},
).paddingOnly(
left: 12,
right: 12,
top: 2,
bottom: hasAttachment ? 4 : (isHasMerged ? 2 : 0),
);
}
Widget buildBody(BuildContext context) {
final body = EventMessageBody.fromJson(item.body);
if (isContentPreviewing || isQuote) {
return buildContent();
} else if (isMerged) {
return Column(
children: [
buildContent().paddingOnly(left: 52),
if (body.attachments?.isNotEmpty ?? false)
AttachmentList(
key: Key('m${item.uuid}attachments'),
parentId: item.uuid,
attachmentsId: body.attachments ?? List.empty(),
).paddingSymmetric(vertical: 4),
],
);
} else {
return Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
buildContent(),
if (body.attachments?.isNotEmpty ?? false)
SizedBox(
width: min(MediaQuery.of(context).size.width, 640),
child: AttachmentList(
key: Key('m${item.uuid}attachments'),
parentId: item.uuid,
attachmentsId: body.attachments ?? List.empty(),
divided: true,
viewport: 1,
),
),
],
);
}
}
@override
Widget build(BuildContext context) {
return buildBody(context);
}
}

198
lib/widgets/chat/chat_message.dart
View File

@ -1,198 +0,0 @@
import 'dart:math';
import 'package:flutter/material.dart';
import 'package:flutter_animate/flutter_animate.dart';
import 'package:flutter_markdown/flutter_markdown.dart';
import 'package:font_awesome_flutter/font_awesome_flutter.dart';
import 'package:get/get.dart';
import 'package:solian/models/event.dart';
import 'package:solian/widgets/account/account_avatar.dart';
import 'package:solian/widgets/account/account_profile_popup.dart';
import 'package:solian/widgets/attachments/attachment_list.dart';
import 'package:timeago/timeago.dart' show format;
import 'package:url_launcher/url_launcher_string.dart';
class ChatMessage extends StatelessWidget {
final Event item;
final bool isContentPreviewing;
final bool isReply;
final bool isMerged;
final bool isHasMerged;
const ChatMessage({
super.key,
required this.item,
this.isContentPreviewing = false,
this.isMerged = false,
this.isHasMerged = false,
this.isReply = false,
});
Future<String?> decodeContent(Map<String, dynamic> content) async {
String? text;
if (item.type == 'm.text') {
switch (content['algorithm']) {
case 'plain':
text = content['value'];
default:
throw Exception('Unsupported algorithm');
}
}
return text;
}
Widget buildContent() {
final hasAttachment = item.attachments?.isNotEmpty ?? false;
return FutureBuilder(
future: decodeContent(item.body),
builder: (context, snapshot) {
if (!snapshot.hasData) {
return Opacity(
opacity: 0.8,
child: Row(
children: [
const Icon(Icons.more_horiz),
const SizedBox(width: 4),
Text('messageDecoding'.tr)
],
),
).animate(onPlay: (c) => c.repeat()).fade(begin: 0, end: 1);
} else if (snapshot.hasError) {
return Opacity(
opacity: 0.9,
child: Row(
children: [
const Icon(Icons.close),
const SizedBox(width: 4),
Text(
'messageDecodeFailed'
.trParams({'message': snapshot.error.toString()}),
)
],
),
);
}
if (snapshot.data?.isNotEmpty ?? false) {
return Markdown(
shrinkWrap: true,
physics: const NeverScrollableScrollPhysics(),
data: snapshot.data ?? '',
padding: const EdgeInsets.all(0),
onTapLink: (text, href, title) async {
if (href == null) return;
await launchUrlString(
href,
mode: LaunchMode.externalApplication,
);
},
).paddingOnly(
left: 12,
right: 12,
top: 2,
bottom: hasAttachment ? 4 : 0,
);
} else {
return const SizedBox();
}
},
);
}
Widget buildBody(BuildContext context) {
if (isContentPreviewing) {
return buildContent();
} else if (isMerged) {
return Column(
children: [
buildContent().paddingOnly(left: 52),
if (item.attachments?.isNotEmpty ?? false)
AttachmentList(
key: Key('m${item.uuid}attachments'),
parentId: item.uuid,
attachmentsId: item.attachments ?? List.empty(),
).paddingSymmetric(vertical: 4),
],
);
} else if (isReply) {
return Row(
mainAxisAlignment: MainAxisAlignment.center,
children: [
Transform.scale(
scaleX: -1,
child: const FaIcon(FontAwesomeIcons.reply, size: 14),
),
const SizedBox(width: 12),
AccountAvatar(content: item.sender.account.avatar, radius: 8),
const SizedBox(width: 4),
Text(
item.sender.account.nick,
style: const TextStyle(fontWeight: FontWeight.bold),
),
Expanded(child: buildContent()),
],
);
} else {
return Column(
key: Key('m${item.uuid}'),
children: [
Row(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
GestureDetector(
child: AccountAvatar(content: item.sender.account.avatar),
onTap: () {
showModalBottomSheet(
useRootNavigator: true,
isScrollControlled: true,
backgroundColor: Theme.of(context).colorScheme.surface,
context: context,
builder: (context) => AccountProfilePopup(
account: item.sender.account,
),
);
},
),
Expanded(
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Row(
children: [
Text(
item.sender.account.nick,
style: const TextStyle(fontWeight: FontWeight.bold),
),
const SizedBox(width: 4),
Text(format(item.createdAt, locale: 'en_short'))
],
).paddingSymmetric(horizontal: 12),
buildContent(),
if (item.attachments?.isNotEmpty ?? false)
SizedBox(
width: min(MediaQuery.of(context).size.width, 640),
child: AttachmentList(
key: Key('m${item.uuid}attachments'),
parentId: item.uuid,
attachmentsId: item.attachments ?? List.empty(),
divided: true,
viewport: 1,
),
),
],
),
),
],
).paddingSymmetric(horizontal: 12),
],
);
}
}
@override
Widget build(BuildContext context) {
return buildBody(context);
}
}

45
lib/widgets/chat/chat_message_input.dart
View File

@ -7,7 +7,7 @@ import 'package:solian/models/channel.dart';
import 'package:solian/models/event.dart';
import 'package:solian/providers/auth.dart';
import 'package:solian/widgets/attachments/attachment_publish.dart';
import 'package:solian/widgets/chat/chat_message.dart';
import 'package:solian/widgets/chat/chat_event.dart';
import 'package:uuid/uuid.dart';
class ChatMessageInput extends StatefulWidget {
@ -54,14 +54,6 @@ class _ChatMessageInputState extends State<ChatMessageInput> {
);
}
Map<String, dynamic> encodeMessage(String content) {
return {
'value': content.trim(),
'keypair_id': null,
'algorithm': 'plain',
};
}
Future<void> sendMessage() async {
_focusNode.requestFocus();
@ -71,15 +63,24 @@ class _ChatMessageInputState extends State<ChatMessageInput> {
final client = auth.configureClient('messaging');
// TODO Deal with the @ ping (query uid with username), and then add into related_user and replace the @ with internal link in body
final payload = {
'uuid': const Uuid().v4(),
'type': 'm.text',
'content': encodeMessage(_textController.value.text),
'attachments': List.from(_attachments),
'reply_to': _replyTo?.id,
'type': _editTo == null ? 'messages.new' : 'messages.edit',
'body': {
'text': _textController.value.text,
'algorithm': 'plain',
'attachments': List.from(_attachments),
'related_users': [
if (_replyTo != null) _replyTo!.sender.accountId,
],
if (_replyTo != null) 'quote_event': _replyTo!.id,
if (_editTo != null) 'related_event': _editTo!.id,
}
};
// The mock data
// The local mock data
final sender = Sender(
id: 0,
createdAt: DateTime.now(),
@ -94,18 +95,15 @@ class _ChatMessageInputState extends State<ChatMessageInput> {
uuid: payload['uuid'] as String,
createdAt: DateTime.now(),
updatedAt: DateTime.now(),
body: payload['content'] as Map<String, dynamic>,
body: payload['body'] as Map<String, dynamic>,
type: payload['type'] as String,
attachments: _attachments,
sender: sender,
replyId: _replyTo?.id,
replyTo: _replyTo,
channelId: widget.channel.id,
senderId: sender.id,
);
if (_editTo == null) {
message.isSending = true;
message.isPending = true;
widget.onSent(message);
}
@ -139,9 +137,10 @@ class _ChatMessageInputState extends State<ChatMessageInput> {
}
void syncWidget() {
if (widget.edit != null) {
if (widget.edit != null && widget.edit!.type.startsWith('messages')) {
final body = EventMessageBody.fromJson(widget.edit!.body);
_editTo = widget.edit!;
_textController.text = widget.edit!.body['value'];
_textController.text = body.text;
}
if (widget.reply != null) {
_replyTo = widget.reply!;
@ -177,7 +176,7 @@ class _ChatMessageInputState extends State<ChatMessageInput> {
.colorScheme
.surfaceContainerHighest
.withOpacity(0.5),
content: ChatMessage(
content: ChatEvent(
item: _replyTo!,
isContentPreviewing: true,
),
@ -192,7 +191,7 @@ class _ChatMessageInputState extends State<ChatMessageInput> {
.colorScheme
.surfaceContainerHighest
.withOpacity(0.5),
content: ChatMessage(
content: ChatEvent(
item: _editTo!,
isContentPreviewing: true,
),