Better reaction panel

This commit is contained in:
LittleSheep 2024-11-23 18:04:30 +08:00
parent b8a1e5b5c0
commit 0ed8c2373d
13 changed files with 95 additions and 32 deletions

View File

@ -104,10 +104,20 @@
"postRepostingNotice": "You're about to repost a post that posted {}.",
"postReact": "React",
"postReactions": "Reactions of Post",
"postReactionPoints": {
"zero": "{} pt",
"one": "{} pt",
"other": "{} pts"
"postReactionUpvote": {
"zero": "0 upvote",
"one": "{} upvote",
"other": "{} upvotes"
},
"postReactionDownvote": {
"zero": "0 downvote",
"one": "{} downvote",
"other": "{} downvotes"
},
"postReactionSocialPoint": {
"zero": "0 point",
"one": "{} point",
"other": "{} points"
},
"postReactCompleted": "Reaction has been added.",
"postReactUncompleted": "Reaction has been removed.",

View File

@ -104,10 +104,20 @@
"postReact": "反应",
"postPosted": "帖子已经发表。",
"postReactions": "帖子的反应",
"postReactionPoints": {
"zero": "{} 点",
"one": "{} 点",
"other": "{} 点"
"postReactionUpvote": {
"zero": "0 个顶",
"one": "{} 个顶",
"other": "{} 个顶"
},
"postReactionDownvote": {
"zero": "0 个踩",
"one": "{} 个踩",
"other": "{} 个踩"
},
"postReactionSocialPoint": {
"zero": "无社会信用点变更",
"one": "{} 点社会信用点变更",
"other": "{} 点社会信用点变更"
},
"postReactCompleted": "反应已被添加。",
"postReactUncompleted": "反应已被移除。",

View File

@ -130,7 +130,7 @@ class _ChatManageScreenState extends State<ChatManageScreen> {
LoadingIndicator(isActive: _isBusy),
if (_editingChannel != null)
MaterialBanner(
leading: const Icon(Icons.edit),
leading: const Icon(Symbols.edit),
leadingPadding: const EdgeInsets.only(left: 10, right: 20),
dividerColor: Colors.transparent,
content: Text(

View File

@ -173,7 +173,13 @@ class _ExploreScreenState extends State<ExploreScreen> {
onFetchData: _fetchPosts,
itemBuilder: (context, idx) {
return GestureDetector(
child: PostItem(data: _posts[idx], maxWidth: 640),
child: PostItem(
data: _posts[idx],
maxWidth: 640,
onChanged: (data) {
setState(() => _posts[idx] = data);
},
),
onTap: () {
GoRouter.of(context).pushNamed(
'postDetail',

View File

@ -135,7 +135,7 @@ class _NotificationScreenState extends State<NotificationScreen> {
title: Text('screenNotification').tr(),
actions: [
IconButton(
icon: const Icon(Icons.checklist),
icon: const Icon(Symbols.checklist),
onPressed: _isSubmitting ? null : _markAllAsRead,
),
],

View File

@ -113,6 +113,9 @@ class _PostDetailScreenState extends State<PostDetailScreen> {
data: _data!,
maxWidth: 640,
showComments: false,
onChanged: (data) {
setState(() => _data = data);
},
),
),
const SliverToBoxAdapter(child: Divider(height: 1)),
@ -144,7 +147,6 @@ class _PostDetailScreenState extends State<PostDetailScreen> {
child: PostMiniEditor(
postReplyId: _data!.id,
onPost: () {
_childListKey.currentState!.refresh();
setState(() {
_data = _data!.copyWith(
metric: _data!.metric.copyWith(
@ -152,6 +154,7 @@ class _PostDetailScreenState extends State<PostDetailScreen> {
),
);
});
_childListKey.currentState!.refresh();
},
),
),

View File

@ -292,7 +292,8 @@ class _PostEditorScreenState extends State<PostEditorScreen> {
]),
children: <Widget>[
PostItem(
data: _writeController.repostingPost!)
data: _writeController.repostingPost!,
)
],
),
),

View File

@ -81,8 +81,8 @@ class _RealmScreenState extends State<RealmScreen> {
actions: [
IconButton(
icon: !_isCompactView
? const Icon(Icons.view_list)
: const Icon(Icons.view_module),
? const Icon(Symbols.view_list)
: const Icon(Symbols.view_module),
onPressed: () {
setState(() => _isCompactView = !_isCompactView);
},

View File

@ -191,7 +191,7 @@ class _RealmManageScreenState extends State<RealmManageScreen> {
LoadingIndicator(isActive: _isBusy),
if (_editingRealm != null)
MaterialBanner(
leading: const Icon(Icons.edit),
leading: const Icon(Symbols.edit),
leadingPadding: const EdgeInsets.only(left: 10, right: 20),
dividerColor: Colors.transparent,
content: Text(

View File

@ -232,7 +232,7 @@ class _AttachmentItemContentVideoState
)
else
const Center(
child: Icon(Icons.movie, size: 64),
child: Icon(Symbols.movie, size: 64),
),
Align(
alignment: Alignment.bottomCenter,
@ -397,7 +397,7 @@ class _AttachmentItemContentAudioState
)
else
const Center(
child: Icon(Icons.radio, size: 64),
child: Icon(Symbols.radio, size: 64),
),
Align(
alignment: Alignment.bottomCenter,
@ -485,7 +485,7 @@ class _AttachmentItemContentAudioState
child: Column(
mainAxisAlignment: MainAxisAlignment.center,
children: [
const Icon(Icons.audio_file, size: 32),
const Icon(Symbols.audio_file, size: 32),
const Gap(8),
Text(
widget.data.alt,
@ -554,8 +554,8 @@ class _AttachmentItemContentAudioState
const Gap(16),
IconButton.filled(
icon: _isPlaying
? const Icon(Icons.pause)
: const Icon(Icons.play_arrow),
? const Icon(Symbols.pause)
: const Icon(Symbols.play_arrow),
onPressed: () {
_audioPlayer!.playOrPause();
},

View File

@ -98,6 +98,9 @@ class PostCommentSliverListState extends State<PostCommentSliverList> {
child: PostItem(
data: _posts[idx],
maxWidth: widget.maxWidth,
onChanged: (data) {
setState(() => _posts[idx] = data);
},
),
onTap: () {
GoRouter.of(context).pushNamed(

View File

@ -106,9 +106,14 @@ class _PostBottomAction extends StatelessWidget {
children: [
Icon(Symbols.add_reaction, size: 20, color: iconColor),
const Gap(8),
if (data.totalDownvote > 0 || data.totalUpvote > 0)
Text('postReactionPoints').plural(
data.totalUpvote - data.totalDownvote,
if (data.totalUpvote > 0 &&
data.totalUpvote >= data.totalDownvote)
Text('postReactionUpvote').plural(
data.totalUpvote,
)
else if (data.totalDownvote > 0)
Text('postReactionDownvote').plural(
data.totalDownvote,
)
else
Text('postReact').tr(),
@ -119,12 +124,12 @@ class _PostBottomAction extends StatelessWidget {
context: context,
builder: (context) => PostReactionPopup(
data: data,
onChanged: (value, isPositive, delta) {
onChanged: (value, attr, delta) {
onChanged(data.copyWith(
totalUpvote: isPositive
totalUpvote: attr == 1
? data.totalUpvote + delta
: data.totalUpvote,
totalDownvote: !isPositive
totalDownvote: attr == 2
? data.totalDownvote + delta
: data.totalDownvote,
metric: data.metric.copyWith(reactionList: value),

View File

@ -11,7 +11,7 @@ import 'package:surface/widgets/dialog.dart';
class PostReactionPopup extends StatefulWidget {
final SnPost data;
final Function(Map<String, int> value, bool isPositive, int delta)? onChanged;
final Function(Map<String, int> value, int attr, int delta)? onChanged;
const PostReactionPopup({super.key, required this.data, this.onChanged});
@override
@ -43,7 +43,7 @@ class _PostReactionPopupState extends State<PostReactionPopup> {
if (widget.onChanged != null) {
widget.onChanged!(
_reactions,
kTemplateReactions[symbol]!.attitude == 1,
kTemplateReactions[symbol]!.attitude,
1,
);
}
@ -54,7 +54,7 @@ class _PostReactionPopupState extends State<PostReactionPopup> {
if (widget.onChanged != null) {
widget.onChanged!(
_reactions,
kTemplateReactions[symbol]!.attitude == 1,
kTemplateReactions[symbol]!.attitude,
-1,
);
}
@ -89,11 +89,36 @@ class _PostReactionPopupState extends State<PostReactionPopup> {
.textStyle(Theme.of(context).textTheme.titleLarge!),
],
).padding(horizontal: 20, top: 16, bottom: 12),
Container(
color: Theme.of(context).colorScheme.surfaceContainer,
child: Row(
children: [
const Icon(Symbols.thumb_up, size: 16),
const Gap(8),
Text('postReactionUpvote').plural(widget.data.totalUpvote),
const Gap(24),
const Icon(Symbols.thumb_down, size: 16),
const Gap(8),
Text('postReactionDownvote').plural(widget.data.totalDownvote),
const Gap(24),
Icon(
widget.data.totalUpvote >= widget.data.totalDownvote
? Symbols.trending_up
: Symbols.trending_down,
size: 16,
),
const Gap(8),
Text('postReactionSocialPoint').plural(
widget.data.totalUpvote - widget.data.totalDownvote,
),
],
).padding(vertical: 8, horizontal: 24),
),
Expanded(
child: GridView.count(
child: GridView.extent(
crossAxisSpacing: 4,
mainAxisSpacing: 4,
crossAxisCount: 4,
maxCrossAxisExtent: 120,
children: kTemplateReactions.entries.map((e) {
return InkWell(
onTap: () {