Solian/lib/screens/account/notification.dart

275 lines
12 KiB
Dart
Raw Normal View History

2024-05-25 05:00:40 +00:00
import 'package:flutter/material.dart';
import 'package:gap/gap.dart';
2024-05-25 05:00:40 +00:00
import 'package:get/get.dart';
import 'package:solian/models/notification.dart';
2024-10-16 14:38:01 +00:00
import 'package:solian/models/post.dart';
2024-10-15 16:50:48 +00:00
import 'package:solian/providers/notifications.dart';
2024-10-16 14:38:01 +00:00
import 'package:solian/router.dart';
2024-10-15 16:50:48 +00:00
import 'package:solian/widgets/loading_indicator.dart';
import 'package:solian/widgets/markdown_text_content.dart';
2024-10-16 14:38:01 +00:00
import 'package:solian/widgets/posts/post_item.dart';
2024-10-16 14:32:44 +00:00
import 'package:solian/widgets/relative_date.dart';
2024-05-25 05:00:40 +00:00
import 'package:uuid/uuid.dart';
class NotificationScreen extends StatefulWidget {
const NotificationScreen({super.key});
@override
State<NotificationScreen> createState() => _NotificationScreenState();
}
class _NotificationScreenState extends State<NotificationScreen> {
@override
Widget build(BuildContext context) {
2024-10-15 16:50:48 +00:00
final NotificationProvider nty = Get.find();
2024-05-25 05:00:40 +00:00
return SizedBox(
height: MediaQuery.of(context).size.height * 0.85,
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Text(
'notification'.tr,
style: Theme.of(context).textTheme.headlineSmall,
).paddingOnly(left: 24, right: 24, top: 32, bottom: 16),
Expanded(
child: Obx(() {
2024-10-15 16:50:48 +00:00
return RefreshIndicator(
onRefresh: () => nty.fetchNotification(),
child: CustomScrollView(
slivers: [
2024-10-15 16:53:29 +00:00
SliverToBoxAdapter(
child: LoadingIndicator(
isActive: nty.isBusy.value,
2024-05-25 05:00:40 +00:00
),
),
2024-10-15 16:50:48 +00:00
if (nty.notifications
.where((x) => x.readAt == null)
.isEmpty)
SliverToBoxAdapter(
child: Container(
padding: const EdgeInsets.symmetric(horizontal: 10),
color: Theme.of(context)
.colorScheme
.surfaceContainerHigh,
child: ListTile(
leading: const Icon(Icons.check),
title: Text('notifyEmpty'.tr),
subtitle: Text('notifyEmptyCaption'.tr),
),
),
2024-05-25 05:00:40 +00:00
),
2024-10-15 16:50:48 +00:00
if (nty.notifications
.where((x) => x.readAt == null)
.isNotEmpty)
SliverToBoxAdapter(
child: Container(
padding: const EdgeInsets.symmetric(horizontal: 10),
color:
Theme.of(context).colorScheme.secondaryContainer,
child: ListTile(
leading: const Icon(Icons.checklist),
title: Text('notifyAllRead'.tr),
2024-10-15 16:53:29 +00:00
onTap: nty.isBusy.value
? null
: () => nty.markAllRead(),
2024-05-25 05:00:40 +00:00
),
),
2024-10-15 16:50:48 +00:00
),
SliverList.separated(
itemCount: nty.notifications.length,
itemBuilder: (BuildContext context, int index) {
var element = nty.notifications[index];
return ClipRect(
child: Dismissible(
2024-10-15 16:53:29 +00:00
direction: element.readAt == null
? DismissDirection.horizontal
2024-10-15 16:53:29 +00:00
: DismissDirection.none,
2024-10-15 16:50:48 +00:00
key: Key(const Uuid().v4()),
background: Container(
color: Colors.lightBlue,
padding:
const EdgeInsets.symmetric(horizontal: 20),
alignment: Alignment.centerLeft,
child:
const Icon(Icons.check, color: Colors.white),
),
2024-10-15 16:53:29 +00:00
secondaryBackground: Container(
color: Colors.lightBlue,
padding:
const EdgeInsets.symmetric(horizontal: 20),
alignment: Alignment.centerRight,
child:
const Icon(Icons.check, color: Colors.white),
),
child: Container(
padding: const EdgeInsets.symmetric(
horizontal: 28,
vertical: 16,
2024-10-15 16:50:48 +00:00
),
child: Row(
2024-10-15 16:50:48 +00:00
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Icon(NotificationTopicIcons[element.topic]),
2024-10-16 14:32:44 +00:00
const Gap(16),
Expanded(
child: Column(
crossAxisAlignment:
CrossAxisAlignment.start,
children: [
2024-10-16 14:32:44 +00:00
if (element.readAt == null)
Badge(
label: Row(
children: [
2024-10-20 08:15:24 +00:00
Icon(
2024-10-16 14:32:44 +00:00
Icons.new_releases_outlined,
2024-10-20 08:15:24 +00:00
color: Theme.of(context)
.colorScheme
.onSurface,
2024-10-16 14:32:44 +00:00
size: 12,
),
const Gap(4),
Text('unread'.tr),
],
),
).paddingOnly(bottom: 4),
Text(
element.title,
style: Theme.of(context)
.textTheme
.titleMedium,
),
if (element.subtitle != null)
Text(
element.subtitle!,
style: Theme.of(context)
.textTheme
.titleSmall,
),
2024-10-16 14:32:44 +00:00
if (element.subtitle != null)
const Gap(4),
MarkdownTextContent(
content: element.body,
isAutoWarp: true,
isSelectable: true,
parentId:
'notification-${element.id}',
),
2024-10-16 14:38:01 +00:00
if ([
'interactive.feedback',
'interactive.subscription'
].contains(element.topic) &&
element.metadata?['related_post'] !=
null)
_PostRelatedNotificationWidget(
metadata: element.metadata!,
),
2024-10-16 14:32:44 +00:00
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,
),
],
),
),
],
),
),
2024-10-15 16:50:48 +00:00
],
),
),
2024-10-15 16:53:29 +00:00
onDismissed: (_) => nty.markOneRead(element, index),
2024-10-15 16:50:48 +00:00
),
);
},
separatorBuilder: (_, __) =>
const Divider(thickness: 0.3, height: 0.3),
),
],
),
2024-05-25 05:00:40 +00:00
);
}),
),
],
),
);
}
}
class NotificationButton extends StatelessWidget {
const NotificationButton({super.key});
@override
Widget build(BuildContext context) {
2024-10-15 16:50:48 +00:00
final NotificationProvider nty = Get.find();
2024-05-25 05:00:40 +00:00
final button = IconButton(
icon: const Icon(Icons.notifications),
onPressed: () {
showModalBottomSheet(
useRootNavigator: true,
isScrollControlled: true,
context: context,
builder: (context) => const NotificationScreen(),
2024-10-15 16:50:48 +00:00
).then((_) => nty.notificationUnread.value = 0);
2024-05-25 05:00:40 +00:00
},
);
return Obx(() {
2024-10-15 16:50:48 +00:00
if (nty.notificationUnread.value > 0) {
2024-05-25 05:00:40 +00:00
return Badge(
isLabelVisible: true,
offset: const Offset(-8, 2),
2024-10-15 16:50:48 +00:00
label: Text(nty.notificationUnread.value.toString()),
2024-05-25 05:00:40 +00:00
child: button,
);
} else {
return button;
}
});
}
}
2024-10-16 14:38:01 +00:00
class _PostRelatedNotificationWidget extends StatelessWidget {
final Map<String, dynamic> metadata;
const _PostRelatedNotificationWidget({super.key, required this.metadata});
@override
Widget build(BuildContext context) {
return GestureDetector(
child: Card(
margin: const EdgeInsets.symmetric(vertical: 4),
child: PostItem(
item: Post.fromJson(metadata['related_post']),
isCompact: true,
).paddingAll(8),
),
onTap: () {
final data = Post.fromJson(metadata['related_post']);
Navigator.pop(context);
AppRouter.instance.pushNamed(
'postDetail',
pathParameters: {'id': data.id.toString()},
extra: data,
);
},
);
}
}