From 9012566dbfad122d800075792f61b23fe1a62629 Mon Sep 17 00:00:00 2001 From: LittleSheep Date: Wed, 16 Oct 2024 22:32:44 +0800 Subject: [PATCH] :lipstick: Optimized notification list --- assets/locales/en_us.json | 3 +- assets/locales/zh_cn.json | 3 +- lib/models/notification.dart | 3 ++ lib/providers/notifications.dart | 9 ++++-- lib/screens/account/notification.dart | 43 +++++++++++++++++++++++++-- lib/widgets/relative_date.dart | 9 ++++-- 6 files changed, 62 insertions(+), 8 deletions(-) diff --git a/assets/locales/en_us.json b/assets/locales/en_us.json index 4558578..cf4ea74 100644 --- a/assets/locales/en_us.json +++ b/assets/locales/en_us.json @@ -487,5 +487,6 @@ "shareImageFooter": "Only on the Solar Network", "fileSavedAt": "File saved at @path", "showIp": "Show IP Address", - "shotOn": "Shot on @device" + "shotOn": "Shot on @device", + "unread": "Unread" } diff --git a/assets/locales/zh_cn.json b/assets/locales/zh_cn.json index e2b1353..006c774 100644 --- a/assets/locales/zh_cn.json +++ b/assets/locales/zh_cn.json @@ -483,5 +483,6 @@ "shareImageFooter": "上 Solar Network 看更多有趣帖子", "fileSavedAt": "文件保存于 @path", "showIp": "显示 IP 地址", - "shotOn": "由 @device 拍摄" + "shotOn": "由 @device 拍摄", + "unread": "未读" } diff --git a/lib/models/notification.dart b/lib/models/notification.dart index eb40c89..7e45d90 100755 --- a/lib/models/notification.dart +++ b/lib/models/notification.dart @@ -5,6 +5,9 @@ part 'notification.g.dart'; const Map NotificationTopicIcons = { 'passport.security.alert': Icons.gpp_maybe, + 'interactive.subscription': Icons.subscriptions, + 'interactive.feedback': Icons.add_reaction, + 'messaging.callStart': Icons.call_received, }; @JsonSerializable() diff --git a/lib/providers/notifications.dart b/lib/providers/notifications.dart index a93b3a6..f7bef84 100644 --- a/lib/providers/notifications.dart +++ b/lib/providers/notifications.dart @@ -55,7 +55,11 @@ class NotificationProvider extends GetxController { await client.put('/notifications/read', {'messages': markList}); } - nty.notifications.clear(); + nty.notifications.value = nty.notifications.map((x) { + x.readAt = DateTime.now(); + return x; + }).toList(); + nty.notifications.refresh(); isBusy.value = false; } @@ -79,7 +83,8 @@ class NotificationProvider extends GetxController { await client.put('/notifications/read/${element.id}', {}); - nty.notifications.removeAt(index); + nty.notifications[0].readAt = DateTime.now(); + nty.notifications.refresh(); isBusy.value = false; } diff --git a/lib/screens/account/notification.dart b/lib/screens/account/notification.dart index 3e3fb73..4e5efc4 100644 --- a/lib/screens/account/notification.dart +++ b/lib/screens/account/notification.dart @@ -5,6 +5,7 @@ import 'package:solian/models/notification.dart'; import 'package:solian/providers/notifications.dart'; import 'package:solian/widgets/loading_indicator.dart'; import 'package:solian/widgets/markdown_text_content.dart'; +import 'package:solian/widgets/relative_date.dart'; import 'package:uuid/uuid.dart'; class NotificationScreen extends StatefulWidget { @@ -107,12 +108,26 @@ class _NotificationScreenState extends State { crossAxisAlignment: CrossAxisAlignment.start, children: [ Icon(NotificationTopicIcons[element.topic]), - const Gap(12), + const Gap(16), Expanded( child: Column( crossAxisAlignment: CrossAxisAlignment.start, children: [ + if (element.readAt == null) + Badge( + label: Row( + children: [ + const Icon( + Icons.new_releases_outlined, + color: Colors.white, + size: 12, + ), + const Gap(4), + Text('unread'.tr), + ], + ), + ).paddingOnly(bottom: 4), Text( element.title, style: Theme.of(context) @@ -126,7 +141,8 @@ class _NotificationScreenState extends State { .textTheme .titleSmall, ), - const Gap(4), + if (element.subtitle != null) + const Gap(4), MarkdownTextContent( content: element.body, isAutoWarp: true, @@ -134,6 +150,29 @@ class _NotificationScreenState extends State { parentId: 'notification-${element.id}', ), + const Gap(8), + Opacity( + opacity: 0.75, + child: Row( + children: [ + RelativeDate( + element.createdAt, + style: TextStyle(fontSize: 12), + ), + const Gap(4), + Text( + '·', + style: TextStyle(fontSize: 12), + ), + const Gap(4), + RelativeDate( + element.createdAt, + style: TextStyle(fontSize: 12), + isFull: true, + ), + ], + ), + ), ], ), ), diff --git a/lib/widgets/relative_date.dart b/lib/widgets/relative_date.dart index ae9c9f1..ab36d35 100644 --- a/lib/widgets/relative_date.dart +++ b/lib/widgets/relative_date.dart @@ -4,20 +4,25 @@ import 'package:timeago/timeago.dart'; class RelativeDate extends StatelessWidget { final DateTime date; + final TextStyle? style; final bool isFull; - const RelativeDate(this.date, {super.key, this.isFull = false}); + const RelativeDate(this.date, {super.key, this.style, this.isFull = false}); @override Widget build(BuildContext context) { if (isFull) { - return Text(DateFormat('y/M/d HH:mm').format(date)); + return Text( + DateFormat('y/M/d HH:mm').format(date), + style: style, + ); } return Text( format( date, locale: 'en_short', ), + style: style, ); } }