feat: emoji picker

lib/widgets/chat_write.dart

@@ -1,4 +1,5 @@
 import 'package:collection/collection.dart';
+import 'package:emoji_picker_flutter/emoji_picker_flutter.dart';
 import 'package:flutter/material.dart';
 import 'package:ndk/ndk.dart';
 import 'package:ndk/shared/nips/nip19/nip19.dart';
@@ -7,6 +8,7 @@ import 'package:zap_stream_flutter/theme.dart';
 import 'package:zap_stream_flutter/utils.dart';
 import 'package:zap_stream_flutter/widgets/avatar.dart';
 import 'package:zap_stream_flutter/widgets/profile.dart';
+import 'package:zap_stream_flutter/widgets/reaction.dart';
 
 class WriteMessageWidget extends StatefulWidget {
   final StreamEvent stream;
@@ -143,6 +145,42 @@ class __WriteMessageWidget extends State<WriteMessageWidget> {
     Overlay.of(context).insert(_entry!);
   }
 
+  void _showEmojiPicker() {
+    if (_entry != null) {
+      _entry!.remove();
+      _entry = null;
+    }
+
+    final pos = context.findRenderObject() as RenderBox?;
+    _entry = OverlayEntry(
+      builder: (context) {
+        return Stack(
+          children: [
+            Positioned(
+              left: 0,
+              bottom: (pos?.paintBounds.bottom ?? 0),
+              width: MediaQuery.of(context).size.width,
+              child: Container(
+                padding: EdgeInsets.symmetric(horizontal: 4, vertical: 8),
+                decoration: BoxDecoration(
+                  color: LAYER_2,
+                  borderRadius: DEFAULT_BR,
+                ),
+                child: EmojiPicker(
+                  onEmojiSelected: (category, emoji) {
+                    _controller.text = _controller.text + emoji.emoji;
+                  },
+                  config: emojiPickerConfig,
+                ),
+              ),
+            ),
+          ],
+        );
+      },
+    );
+    Overlay.of(context).insert(_entry!);
+  }
+
   Future<void> _sendMessage(BuildContext context) async {
     final login = ndk.accounts.getLoggedAccount();
     if (login == null || _controller.text.isEmpty) return;
@@ -189,7 +227,17 @@ class __WriteMessageWidget extends State<WriteMessageWidget> {
                       ),
                     ),
                   ),
-                  //IconButton(onPressed: () {}, icon: Icon(Icons.mood)),
+                  IconButton(
+                    onPressed: () {
+                      if (_entry != null) {
+                        _entry!.remove();
+                        _entry = null;
+                      } else {
+                        _showEmojiPicker();
+                      }
+                    },
+                    icon: Icon(Icons.mood),
+                  ),
                   IconButton(
                     onPressed: () {
                       _sendMessage(context);

lib/widgets/reaction.dart

@@ -5,6 +5,32 @@ import 'package:ndk/entities.dart';
 import 'package:zap_stream_flutter/main.dart';
 import 'package:zap_stream_flutter/theme.dart';
 
+final emojiPickerConfig = Config(
+  height: 256,
+  checkPlatformCompatibility: true,
+  emojiViewConfig: EmojiViewConfig(
+    emojiSizeMax:
+        28 *
+        (foundation.defaultTargetPlatform == TargetPlatform.iOS ? 1.20 : 1.0),
+    backgroundColor: LAYER_1,
+  ),
+  viewOrderConfig: const ViewOrderConfig(
+    top: EmojiPickerItem.categoryBar,
+    middle: EmojiPickerItem.emojiView,
+    bottom: EmojiPickerItem.searchBar,
+  ),
+  bottomActionBarConfig: BottomActionBarConfig(
+    backgroundColor: LAYER_2,
+    buttonColor: PRIMARY_1,
+    showBackspaceButton: false,
+  ),
+  categoryViewConfig: CategoryViewConfig(backgroundColor: LAYER_2),
+  searchViewConfig: SearchViewConfig(
+    backgroundColor: LAYER_2,
+    buttonIconColor: PRIMARY_1,
+  ),
+);
+
 class ReactionWidget extends StatelessWidget {
   final Nip01Event event;
 
@@ -20,32 +46,7 @@ class ReactionWidget extends StatelessWidget {
         );
         Navigator.pop(context);
       },
-      config: Config(
+      config: emojiPickerConfig,
-        height: 256,
-        checkPlatformCompatibility: true,
-        emojiViewConfig: EmojiViewConfig(
-          emojiSizeMax:
-              28 *
-              (foundation.defaultTargetPlatform == TargetPlatform.iOS
-                  ? 1.20
-                  : 1.0),
-          backgroundColor: LAYER_1,
-        ),
-        viewOrderConfig: const ViewOrderConfig(
-          top: EmojiPickerItem.categoryBar,
-          middle: EmojiPickerItem.emojiView,
-          bottom: EmojiPickerItem.searchBar,
-        ),
-        bottomActionBarConfig: BottomActionBarConfig(
-          backgroundColor: LAYER_2,
-          buttonColor: PRIMARY_1,
-        ),
-        categoryViewConfig: CategoryViewConfig(backgroundColor: LAYER_2),
-        searchViewConfig: SearchViewConfig(
-          backgroundColor: LAYER_2,
-          buttonIconColor: PRIMARY_1,
-        ),
-      ),
     );
   }
 }