lemmur-app-android/lib/pages/inbox.dart

400 lines
14 KiB
Dart

import 'dart:math' show pi;
import 'package:flutter/material.dart';
import 'package:flutter_hooks/flutter_hooks.dart';
import 'package:lemmy_api_client/v3.dart';
import 'package:matrix4_transform/matrix4_transform.dart';
import '../hooks/delayed_loading.dart';
import '../hooks/infinite_scroll.dart';
import '../hooks/stores.dart';
import '../l10n/l10n.dart';
import '../util/delayed_action.dart';
import '../util/extensions/api.dart';
import '../util/extensions/datetime.dart';
import '../util/goto.dart';
import '../util/icons.dart';
import '../widgets/bottom_modal.dart';
import '../widgets/cached_network_image.dart';
import '../widgets/comment/comment.dart';
import '../widgets/infinite_scroll.dart';
import '../widgets/info_table_popup.dart';
import '../widgets/markdown_mode_icon.dart';
import '../widgets/markdown_text.dart';
import '../widgets/radio_picker.dart';
import '../widgets/sortable_infinite_list.dart';
import '../widgets/tile_action.dart';
import 'write_message.dart';
class InboxPage extends HookWidget {
const InboxPage();
@override
Widget build(BuildContext context) {
final accStore = useAccountsStore();
final selected = useState(accStore.defaultInstanceHost);
final theme = Theme.of(context);
final isc = useInfiniteScrollController();
final unreadOnly = useState(true);
if (accStore.hasNoAccount) {
return Scaffold(
appBar: AppBar(),
body: const Center(child: Text('no accounts added')),
);
}
final selectedInstance = selected.value!;
toggleUnreadOnly() {
unreadOnly.value = !unreadOnly.value;
isc.clear();
}
return DefaultTabController(
length: 3,
child: Scaffold(
appBar: AppBar(
title: RadioPicker<String>(
onChanged: (val) {
selected.value = val;
isc.clear();
},
title: 'select instance',
groupValue: selectedInstance,
buttonBuilder: (context, displayString, onPressed) => TextButton(
style: TextButton.styleFrom(
padding: const EdgeInsets.symmetric(horizontal: 15),
),
onPressed: onPressed,
child: Row(
mainAxisSize: MainAxisSize.min,
mainAxisAlignment: MainAxisAlignment.center,
children: [
Flexible(
child: Text(
displayString,
style: theme.appBarTheme.titleTextStyle,
overflow: TextOverflow.fade,
softWrap: false,
),
),
const Icon(Icons.arrow_drop_down),
],
),
),
values: accStore.loggedInInstances.toList(),
),
actions: [
IconButton(
icon: Icon(unreadOnly.value ? Icons.mail : Icons.mail_outline),
onPressed: toggleUnreadOnly,
tooltip: unreadOnly.value ? 'show all' : 'show only unread',
)
],
bottom: TabBar(
tabs: [
Tab(text: L10n.of(context).replies),
Tab(text: L10n.of(context).mentions),
Tab(text: L10n.of(context).messages),
],
),
),
body: TabBarView(
children: [
SortableInfiniteList<CommentView>(
noItems: const Text('no replies'),
controller: isc,
defaultSort: SortType.new_,
fetcher: (page, batchSize, sortType) =>
LemmyApiV3(selectedInstance).run(GetReplies(
auth: accStore.defaultUserDataFor(selectedInstance)!.jwt.raw,
sort: sortType,
limit: batchSize,
page: page,
unreadOnly: unreadOnly.value,
)),
itemBuilder: (cv) => CommentWidget.fromCommentView(
cv,
canBeMarkedAsRead: true,
hideOnRead: unreadOnly.value,
),
uniqueProp: (item) => item.comment.apId,
),
SortableInfiniteList<PersonMentionView>(
noItems: const Text('no mentions'),
controller: isc,
defaultSort: SortType.new_,
fetcher: (page, batchSize, sortType) =>
LemmyApiV3(selectedInstance).run(GetPersonMentions(
auth: accStore.defaultUserDataFor(selectedInstance)!.jwt.raw,
sort: sortType,
limit: batchSize,
page: page,
unreadOnly: unreadOnly.value,
)),
itemBuilder: (umv) => CommentWidget.fromPersonMentionView(
umv,
hideOnRead: unreadOnly.value,
),
uniqueProp: (item) => item.personMention.id,
),
InfiniteScroll<PrivateMessageView>(
noItems: const Padding(
padding: EdgeInsets.only(top: 60),
child: Text('no messages'),
),
controller: isc,
fetcher: (page, batchSize) => LemmyApiV3(selectedInstance).run(
GetPrivateMessages(
auth: accStore.defaultUserDataFor(selectedInstance)!.jwt.raw,
limit: batchSize,
page: page,
unreadOnly: unreadOnly.value,
),
),
itemBuilder: (mv) => PrivateMessageTile(
privateMessageView: mv,
hideOnRead: unreadOnly.value,
),
uniqueProp: (item) => item.privateMessage.apId,
),
],
),
),
);
}
}
class PrivateMessageTile extends HookWidget {
final PrivateMessageView privateMessageView;
final bool hideOnRead;
const PrivateMessageTile({
required this.privateMessageView,
this.hideOnRead = false,
});
static const double _iconSize = 16;
@override
Widget build(BuildContext context) {
final accStore = useAccountsStore();
final theme = Theme.of(context);
final pmv = useState(privateMessageView);
final raw = useState(false);
final selectable = useState(false);
final deleted = useState(pmv.value.privateMessage.deleted);
final deleteDelayed = useDelayedLoading(const Duration(milliseconds: 250));
final read = useState(pmv.value.privateMessage.read);
final readDelayed = useDelayedLoading(const Duration(milliseconds: 200));
final toMe = useMemoized(() =>
pmv.value.recipient.originInstanceHost == pmv.value.instanceHost &&
pmv.value.recipient.id ==
accStore.defaultUserDataFor(pmv.value.instanceHost)?.userId);
final otherSide =
useMemoized(() => toMe ? pmv.value.creator : pmv.value.recipient);
void showMoreMenu() {
showBottomModal(
context: context,
builder: (context) {
pop() => Navigator.of(context).pop();
return Column(
children: [
ListTile(
title: Text(raw.value ? 'Show fancy' : 'Show raw'),
leading: markdownModeIcon(fancy: !raw.value),
onTap: () {
raw.value = !raw.value;
pop();
},
),
ListTile(
title: Text('Make ${selectable.value ? 'un' : ''}selectable'),
leading: Icon(
selectable.value ? Icons.assignment : Icons.content_cut),
onTap: () {
selectable.value = !selectable.value;
pop();
},
),
ListTile(
title: const Text('Nerd stuff'),
leading: const Icon(Icons.info_outline),
onTap: () {
pop();
showInfoTablePopup(
context: context, table: pmv.value.toJson());
},
),
],
);
},
);
}
handleDelete() => delayedAction<PrivateMessageView>(
context: context,
delayedLoading: deleteDelayed,
instanceHost: pmv.value.instanceHost,
query: DeletePrivateMessage(
privateMessageId: pmv.value.privateMessage.id,
auth: accStore.defaultUserDataFor(pmv.value.instanceHost)!.jwt.raw,
deleted: !deleted.value,
),
onSuccess: (val) => deleted.value = val.privateMessage.deleted,
);
handleRead() => delayedAction<PrivateMessageView>(
context: context,
delayedLoading: readDelayed,
instanceHost: pmv.value.instanceHost,
query: MarkPrivateMessageAsRead(
privateMessageId: pmv.value.privateMessage.id,
auth: accStore.defaultUserDataFor(pmv.value.instanceHost)!.jwt.raw,
read: !read.value,
),
// TODO: add notification for notifying parent list
onSuccess: (val) => read.value = val.privateMessage.read,
);
if (hideOnRead && read.value) {
return const SizedBox.shrink();
}
final body = raw.value
? selectable.value
? SelectableText(pmv.value.privateMessage.content)
: Text(pmv.value.privateMessage.content)
: MarkdownText(
pmv.value.privateMessage.content,
instanceHost: pmv.value.instanceHost,
selectable: selectable.value,
);
return Padding(
padding: const EdgeInsets.all(8),
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Row(
children: [
Text(
'${toMe ? L10n.of(context).from : L10n.of(context).to} ',
style: TextStyle(color: theme.textTheme.caption?.color),
),
InkWell(
borderRadius: BorderRadius.circular(10),
onTap: () => goToUser.fromPersonSafe(context, otherSide),
child: Row(
children: [
if (otherSide.avatar != null)
Padding(
padding: const EdgeInsets.only(right: 5),
child: CachedNetworkImage(
imageUrl: otherSide.avatar!,
height: 20,
width: 20,
imageBuilder: (context, imageProvider) => Container(
decoration: BoxDecoration(
shape: BoxShape.circle,
image: DecorationImage(
fit: BoxFit.cover,
image: imageProvider,
),
),
),
errorBuilder: (_, ___) => const SizedBox.shrink(),
),
),
Text(
otherSide.originPreferredName,
style: TextStyle(color: theme.colorScheme.secondary),
),
],
),
),
const Spacer(),
if (pmv.value.privateMessage.updated != null) const Text('🖊 '),
Text(pmv.value.privateMessage.updated?.timeago(context) ??
pmv.value.privateMessage.published.timeago(context)),
const SizedBox(width: 5),
Transform(
transform: Matrix4Transform()
.rotateByCenter((toMe ? -1 : 1) * pi / 2,
const Size(_iconSize, _iconSize))
.flipVertically(
origin: const Offset(_iconSize / 2, _iconSize / 2))
.matrix4,
child: const Opacity(
opacity: 0.8,
child: Icon(Icons.reply, size: _iconSize),
),
)
],
),
const SizedBox(height: 5),
if (pmv.value.privateMessage.deleted)
Text(
L10n.of(context).deleted_by_creator,
style: const TextStyle(fontStyle: FontStyle.italic),
)
else
body,
Row(children: [
const Spacer(),
TileAction(
icon: moreIcon,
onPressed: showMoreMenu,
tooltip: L10n.of(context).more,
),
if (toMe) ...[
TileAction(
iconColor: read.value ? theme.colorScheme.secondary : null,
icon: Icons.check,
tooltip: L10n.of(context).mark_as_read,
onPressed: handleRead,
delayedLoading: readDelayed,
),
TileAction(
icon: Icons.reply,
tooltip: L10n.of(context).reply,
onPressed: () {
Navigator.of(context).push(
WriteMessagePage.sendRoute(
instanceHost: pmv.value.instanceHost,
recipient: otherSide,
),
);
},
)
] else ...[
TileAction(
icon: Icons.edit,
tooltip: L10n.of(context).edit,
onPressed: () async {
final val = await Navigator.of(context)
.push(WriteMessagePage.editRoute(pmv.value));
if (val != null) pmv.value = val;
},
),
TileAction(
delayedLoading: deleteDelayed,
icon: deleted.value ? Icons.restore : Icons.delete,
tooltip: deleted.value
? L10n.of(context).restore
: L10n.of(context).delete,
onPressed: handleDelete,
),
]
]),
const Divider(),
],
),
);
}
}