Merge pull request #2978 from pangeachat/2840-show-all-lemma-emojis
2840-show-all-lemma-emojispull/2245/head
commit
73ae86d8bd
@ -0,0 +1,67 @@
|
||||
import 'package:flutter/material.dart';
|
||||
|
||||
import 'package:fluffychat/pages/chat/chat.dart';
|
||||
import 'package:fluffychat/pangea/common/utils/error_handler.dart';
|
||||
import 'package:fluffychat/pangea/constructs/construct_identifier.dart';
|
||||
import 'package:fluffychat/pangea/toolbar/reading_assistance_input_row/lemma_emoji_choice_item.dart';
|
||||
|
||||
class LemmaReactionPicker extends StatefulWidget {
|
||||
final ConstructIdentifier cId;
|
||||
final ChatController controller;
|
||||
final double? iconSize;
|
||||
|
||||
const LemmaReactionPicker({
|
||||
super.key,
|
||||
required this.cId,
|
||||
required this.controller,
|
||||
this.iconSize,
|
||||
});
|
||||
|
||||
@override
|
||||
LemmaReactionPickerState createState() => LemmaReactionPickerState();
|
||||
}
|
||||
|
||||
class LemmaReactionPickerState extends State<LemmaReactionPicker> {
|
||||
List<String> displayEmoji = [];
|
||||
bool loading = true;
|
||||
|
||||
@override
|
||||
void initState() {
|
||||
super.initState();
|
||||
widget.cId.getLemmaInfo().then((info) {
|
||||
loading = false;
|
||||
setState(() => displayEmoji = info.emoji);
|
||||
}).catchError((e, s) {
|
||||
ErrorHandler.logError(data: widget.cId.toJson(), e: e, s: s);
|
||||
setState(() => loading = false);
|
||||
});
|
||||
}
|
||||
|
||||
void setEmoji(String emoji) => widget.controller.sendEmojiAction(emoji);
|
||||
|
||||
@override
|
||||
Widget build(BuildContext context) {
|
||||
return Container(
|
||||
height: 50,
|
||||
alignment: Alignment.center,
|
||||
child: Row(
|
||||
mainAxisAlignment: MainAxisAlignment.center,
|
||||
spacing: 4.0,
|
||||
children: loading == false
|
||||
? displayEmoji
|
||||
.map(
|
||||
(emoji) => LemmaEmojiChoiceItem(
|
||||
content: emoji,
|
||||
onTap: () => setEmoji(emoji),
|
||||
),
|
||||
)
|
||||
.toList()
|
||||
: [1, 2, 3, 4, 5]
|
||||
.map(
|
||||
(e) => const LemmaEmojiChoicePlaceholder(),
|
||||
)
|
||||
.toList(),
|
||||
),
|
||||
);
|
||||
}
|
||||
}
|
||||
@ -0,0 +1,88 @@
|
||||
import 'package:flutter/material.dart';
|
||||
|
||||
import 'package:shimmer/shimmer.dart';
|
||||
|
||||
import 'package:fluffychat/config/app_config.dart';
|
||||
|
||||
class LemmaEmojiChoiceItem extends StatefulWidget {
|
||||
const LemmaEmojiChoiceItem({
|
||||
super.key,
|
||||
required this.content,
|
||||
required this.onTap,
|
||||
});
|
||||
|
||||
final String content;
|
||||
final Function onTap;
|
||||
|
||||
@override
|
||||
LemmaEmojiChoiceItemState createState() => LemmaEmojiChoiceItemState();
|
||||
}
|
||||
|
||||
class LemmaEmojiChoiceItemState extends State<LemmaEmojiChoiceItem> {
|
||||
bool _isHovered = false;
|
||||
|
||||
Color color(BuildContext context) {
|
||||
if (_isHovered) {
|
||||
return Theme.of(context)
|
||||
.colorScheme
|
||||
.primaryContainer
|
||||
.withAlpha((0.4 * 255).toInt());
|
||||
}
|
||||
|
||||
return Colors.transparent;
|
||||
}
|
||||
|
||||
@override
|
||||
Widget build(BuildContext context) {
|
||||
return Container(
|
||||
height: 40,
|
||||
width: 40,
|
||||
alignment: Alignment.center,
|
||||
decoration: BoxDecoration(
|
||||
color: color(context),
|
||||
borderRadius: BorderRadius.circular(AppConfig.borderRadius),
|
||||
),
|
||||
child: InkWell(
|
||||
onHover: (isHovered) => setState(() => _isHovered = isHovered),
|
||||
borderRadius: BorderRadius.circular(AppConfig.borderRadius),
|
||||
onTap: () {
|
||||
if (!mounted) {
|
||||
return;
|
||||
}
|
||||
widget.onTap();
|
||||
},
|
||||
child: Text(
|
||||
widget.content,
|
||||
style: Theme.of(context).textTheme.headlineSmall,
|
||||
),
|
||||
),
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
class LemmaEmojiChoicePlaceholder extends StatelessWidget {
|
||||
const LemmaEmojiChoicePlaceholder({
|
||||
super.key,
|
||||
this.size = 40,
|
||||
});
|
||||
|
||||
final double size;
|
||||
|
||||
@override
|
||||
Widget build(BuildContext context) {
|
||||
return Shimmer.fromColors(
|
||||
baseColor: Colors.transparent,
|
||||
highlightColor:
|
||||
Theme.of(context).colorScheme.primaryContainer.withAlpha(0xAA),
|
||||
child: Container(
|
||||
height: size,
|
||||
width: size,
|
||||
alignment: Alignment.center,
|
||||
decoration: BoxDecoration(
|
||||
color: Theme.of(context).colorScheme.primaryContainer.withAlpha(0x66),
|
||||
borderRadius: BorderRadius.circular(AppConfig.borderRadius),
|
||||
),
|
||||
),
|
||||
);
|
||||
}
|
||||
}
|
||||
Loading…
Reference in New Issue