chore: bump version

- with links form stream info
closes #12

lib/login.dart

@@ -12,8 +12,14 @@ class LoginAccount {
   final AccountType type;
   final String pubkey;
   final String? privateKey;
+  final List<String>? signerRelays;
 
-  LoginAccount._({required this.type, required this.pubkey, this.privateKey});
+  LoginAccount._({
+    required this.type,
+    required this.pubkey,
+    this.privateKey,
+    this.signerRelays,
+  });
 
   static LoginAccount nip19(String key) {
     final keyData = bech32ToHex(key);
@@ -42,6 +48,19 @@ class LoginAccount {
     return LoginAccount._(type: AccountType.externalSigner, pubkey: key);
   }
 
+  static LoginAccount bunker(
+    String privateKey,
+    String pubkey,
+    List<String> relays,
+  ) {
+    return LoginAccount._(
+      type: AccountType.externalSigner,
+      pubkey: pubkey,
+      privateKey: privateKey,
+      signerRelays: relays,
+    );
+  }
+
   static Map<String, dynamic> toJson(LoginAccount? acc) => {
     "type": acc?.type.name,
     "pubKey": acc?.pubkey,

lib/main.dart

@@ -6,6 +6,8 @@ import 'package:ndk/ndk.dart';
 import 'package:ndk_amber/ndk_amber.dart';
 import 'package:ndk_objectbox/ndk_objectbox.dart';
 import 'package:ndk_rust_verifier/ndk_rust_verifier.dart';
+import 'package:zap_stream_flutter/pages/category.dart';
+import 'package:zap_stream_flutter/pages/hashtag.dart';
 import 'package:zap_stream_flutter/pages/login.dart';
 import 'package:zap_stream_flutter/pages/login_input.dart';
 import 'package:zap_stream_flutter/pages/new_account.dart';
@@ -42,6 +44,7 @@ const defaultRelays = [
   "wss://relay.damus.io",
   "wss://relay.primal.net",
   "wss://relay.snort.social",
+  "wss://relay.fountain.fm",
 ];
 const searchRelays = ["wss://relay.nostr.band", "wss://search.nos.today"];
 
@@ -150,6 +153,21 @@ Future<void> main() async {
                       return ProfilePage(pubkey: state.pathParameters["id"]!);
                     },
                   ),
+                  GoRoute(
+                    path: "/t/:id",
+                    builder: (context, state) {
+                      return HashtagPage(tag: state.pathParameters["id"]!);
+                    },
+                  ),
+                  GoRoute(
+                    path: "/category/:id",
+                    builder: (context, state) {
+                      return CategoryPage(
+                        category: state.pathParameters["id"]!,
+                        info: state.extra as GameInfo?,
+                      );
+                    },
+                  ),
                 ],
               ),
             ],

lib/pages/category.dart

@@ -0,0 +1,110 @@
+import 'package:cached_network_image/cached_network_image.dart';
+import 'package:flutter/material.dart';
+import 'package:flutter/widgets.dart';
+import 'package:ndk/ndk.dart';
+import 'package:zap_stream_flutter/imgproxy.dart';
+import 'package:zap_stream_flutter/rx_filter.dart';
+import 'package:zap_stream_flutter/theme.dart';
+import 'package:zap_stream_flutter/utils.dart';
+import 'package:zap_stream_flutter/widgets/category_top_zapped.dart';
+import 'package:zap_stream_flutter/widgets/header.dart';
+import 'package:zap_stream_flutter/widgets/pill.dart';
+import 'package:zap_stream_flutter/widgets/stream_grid.dart';
+
+class CategoryPage extends StatelessWidget {
+  final String category;
+  final GameInfo? info;
+
+  const CategoryPage({super.key, required this.category, required this.info});
+
+  @override
+  Widget build(BuildContext context) {
+    return SingleChildScrollView(
+      child: Container(
+        margin: EdgeInsets.all(5.0),
+        child: Column(
+          spacing: 16,
+          crossAxisAlignment: CrossAxisAlignment.start,
+          children: [
+            HeaderWidget(),
+            Row(
+              spacing: 8,
+              children: [
+                if (info?.coverImage != null)
+                  Container(
+                    clipBehavior: Clip.antiAlias,
+                    constraints: BoxConstraints(maxHeight: 200),
+                    decoration: BoxDecoration(
+                      borderRadius: DEFAULT_BR,
+                      color: LAYER_1,
+                    ),
+                    child:
+                        info!.coverImage!.startsWith("assets/")
+                            ? Image.asset(
+                              info!.coverImage!,
+                              fit: BoxFit.contain,
+                            )
+                            : CachedNetworkImage(
+                              imageUrl: proxyImg(context, info!.coverImage!),
+                              fit: BoxFit.cover,
+                            ),
+                  ),
+                Expanded(
+                  child: Column(
+                    crossAxisAlignment: CrossAxisAlignment.start,
+                    spacing: 8,
+                    children: [
+                      Text(
+                        info?.name ?? category,
+                        style: TextStyle(
+                          fontSize: 24,
+                          fontWeight: FontWeight.bold,
+                        ),
+                      ),
+                      if (info?.genres != null)
+                        Row(
+                          spacing: 4,
+                          children:
+                              info!.genres
+                                  .map(
+                                    (g) => PillWidget(
+                                      color: LAYER_1,
+                                      child: Text(
+                                        g,
+                                        style: TextStyle(
+                                          fontWeight: FontWeight.w600,
+                                        ),
+                                      ),
+                                    ),
+                                  )
+                                  .toList(),
+                        ),
+                      CategoryTopZapped(tag: category),
+                    ],
+                  ),
+                ),
+              ],
+            ),
+            RxFilter<Nip01Event>(
+              Key("category-page:$category"),
+              filters: [
+                Filter(
+                  kinds: [30_311],
+                  limit: 100,
+                  tTags: [category.toLowerCase()],
+                ),
+              ],
+              builder: (ctx, state) {
+                if (state == null) {
+                  return SizedBox.shrink();
+                } else {
+                  return StreamGrid(events: state);
+                }
+              },
+            ),
+          ],
+        ),
+      ),
+    );
+  }
+}

lib/pages/hashtag.dart

@@ -0,0 +1,45 @@
+import 'package:flutter/material.dart';
+import 'package:ndk/ndk.dart';
+import 'package:zap_stream_flutter/rx_filter.dart';
+import 'package:zap_stream_flutter/widgets/category_top_zapped.dart';
+import 'package:zap_stream_flutter/widgets/header.dart';
+import 'package:zap_stream_flutter/widgets/stream_grid.dart';
+
+class HashtagPage extends StatelessWidget {
+  final String tag;
+
+  const HashtagPage({super.key, required this.tag});
+
+  @override
+  Widget build(BuildContext context) {
+    return SingleChildScrollView(
+      child: Container(
+        margin: EdgeInsets.all(5.0),
+        child: Column(
+          crossAxisAlignment: CrossAxisAlignment.start,
+          children: [
+            HeaderWidget(),
+            Text(
+              "#$tag",
+              style: TextStyle(fontSize: 30, fontWeight: FontWeight.bold),
+            ),
+            CategoryTopZapped(tag: tag),
+            RxFilter<Nip01Event>(
+              Key("tags-page:$tag"),
+              filters: [
+                Filter(kinds: [30_311], limit: 50, tTags: [tag.toLowerCase()]),
+              ],
+              builder: (ctx, state) {
+                if (state == null) {
+                  return SizedBox.shrink();
+                } else {
+                  return StreamGrid(events: state);
+                }
+              },
+            ),
+          ],
+        ),
+      ),
+    );
+  }
+}

lib/pages/home.dart

@@ -13,6 +13,7 @@ class HomePage extends StatelessWidget {
       child: Container(
         margin: EdgeInsets.all(5.0),
         child: Column(
+          crossAxisAlignment: CrossAxisAlignment.start,
           children: [
             HeaderWidget(),
             RxFilter<Nip01Event>(
@@ -28,7 +29,6 @@ class HomePage extends StatelessWidget {
                 }
               },
             ),
-            //other stuff..
           ],
         ),
       ),

lib/pages/login.dart

@@ -1,3 +1,5 @@
+import 'dart:io';
+
 import 'package:amberflutter/amberflutter.dart';
 import 'package:flutter/widgets.dart';
 import 'package:go_router/go_router.dart';
@@ -14,29 +16,30 @@ class LoginPage extends StatelessWidget {
     return Column(
       spacing: 20,
       children: [
-        FutureBuilder(
-          future: Amberflutter().isAppInstalled(),
-          builder: (ctx, state) {
-            if (state.data ?? false) {
-              return BasicButton.text(
-                "Login with Amber",
-                onTap: () async {
-                  final amber = Amberflutter();
-                  final result = await amber.getPublicKey();
-                  if (result['signature'] != null) {
-                    final key = bech32ToHex(result['signature']);
-                    loginData.value = LoginAccount.externalPublicKeyHex(key);
-                    if (ctx.mounted) {
-                      ctx.go("/");
+        if (Platform.isAndroid)
+          FutureBuilder(
+            future: Amberflutter().isAppInstalled(),
+            builder: (ctx, state) {
+              if (state.data ?? false) {
+                return BasicButton.text(
+                  "Login with Amber",
+                  onTap: () async {
+                    final amber = Amberflutter();
+                    final result = await amber.getPublicKey();
+                    if (result['signature'] != null) {
+                      final key = bech32ToHex(result['signature']);
+                      loginData.value = LoginAccount.externalPublicKeyHex(key);
+                      if (ctx.mounted) {
+                        ctx.go("/");
+                      }
                     }
-                  }
-                },
-              );
-            } else {
-              return SizedBox.shrink();
-            }
-          },
-        ),
+                  },
+                );
+              } else {
+                return SizedBox.shrink();
+              }
+            },
+          ),
         BasicButton.text(
           "Login with Key",
           onTap: () => context.push("/login/key"),

lib/pages/login_input.dart

@@ -30,6 +30,14 @@ class _LoginInputPage extends State<LoginInputPage> {
           "Login",
           onTap: () async {
             try {
+              if (_controller.text.startsWith("bunker://")) {
+                // not supported yet in ndk
+                setState(() {
+                  _error = "Bunker login not supported yet";
+                  _controller.clear();
+                });
+                return;
+              }
               final keyData = bech32ToHex(_controller.text);
               if (keyData.isNotEmpty) {
                 loginData.value = LoginAccount.nip19(_controller.text);

lib/pages/stream.dart

@@ -166,8 +166,10 @@ class _StreamPage extends State<StreamPage> {
                   ),
                 GestureDetector(
                   onTap: () {
-                    showBottomSheet(
+                    showModalBottomSheet(
                       context: context,
+                      constraints: BoxConstraints.expand(),
+                      isScrollControlled: true,
                       builder: (context) => StreamInfoWidget(stream: stream),
                     );
                   },

lib/utils.dart

@@ -3,6 +3,7 @@ import 'dart:convert';
 import 'package:bech32/bech32.dart';
 import 'package:collection/collection.dart';
 import 'package:convert/convert.dart';
+import 'package:flutter/material.dart';
 import 'package:intl/intl.dart';
 import 'package:ndk/ndk.dart';
 import 'package:ndk/shared/nips/nip19/nip19.dart';
@@ -88,16 +89,16 @@ class StreamInfo {
 }
 
 class GameInfo {
-  String id;
-  String name;
-  List<String> genres;
-  String className;
+  final String id;
+  final String name;
+  final List<String> genres;
+  final String? coverImage;
 
-  GameInfo({
+  const GameInfo({
     required this.id,
     required this.name,
     required this.genres,
-    required this.className,
+    required this.coverImage,
   });
 }
 
@@ -196,32 +197,32 @@ StreamInfo extractStreamInfo(Nip01Event ev) {
 ({GameInfo? gameInfo, String? gameId}) extractGameTag(List<String> tags) {
   final gameId = tags.firstWhereOrNull((a) => gameTagFormat.hasMatch(a));
 
-  final internalGame = AllCategories.firstWhereOrNull(
+  final internalGame = allCategories.firstWhereOrNull(
     (a) => gameId == 'internal:${a.id}',
   );
   if (internalGame != null) {
     return (
       gameInfo: GameInfo(
-        id: internalGame.id,
+        id: "internal:${internalGame.id}",
         name: internalGame.name,
         genres: internalGame.tags,
-        className: internalGame.className,
+        coverImage: internalGame.coverImage,
       ),
       gameId: gameId,
     );
   }
 
   final lowerTags = tags.map((t) => t.toLowerCase());
-  final taggedCategory = AllCategories.firstWhereOrNull(
+  final taggedCategory = allCategories.firstWhereOrNull(
     (a) => a.tags.any(lowerTags.contains),
   );
   if (taggedCategory != null) {
     return (
       gameInfo: GameInfo(
-        id: taggedCategory.id,
+        id: "internal:${taggedCategory.id}",
         name: taggedCategory.name,
         genres: taggedCategory.tags,
-        className: taggedCategory.className,
+        coverImage: taggedCategory.coverImage,
       ),
       gameId: gameId,
     );
@@ -237,23 +238,83 @@ String getHost(Nip01Event ev) {
 }
 
 class Category {
-  String id;
-  String name;
-  List<String> tags;
-  String className;
+  final String id;
+  final String name;
+  final IconData icon;
+  final List<String> tags;
+  final int order;
+  final String? coverImage;
 
-  Category({
+  const Category({
     required this.id,
     required this.name,
+    required this.icon,
     required this.tags,
-    required this.className,
+    required this.order,
+    this.coverImage,
   });
 }
 
-List<Category> AllCategories = []; // Implement as needed
+const List<Category> allCategories = [
+  Category(
+    id: "irl",
+    name: "IRL",
+    icon: Icons.face,
+    tags: ["irl"],
+    order: 0,
+    coverImage: "assets/category/irl.jpeg",
+  ),
+  Category(
+    id: "gaming",
+    name: "Gaming",
+    icon: Icons.gamepad,
+    tags: ["gaming"],
+    order: 0,
+    coverImage: "assets/category/gaming.jpeg",
+  ),
+  Category(
+    id: "music",
+    name: "Music",
+    icon: Icons.note,
+    tags: ["music", "raido"],
+    order: 0,
+    coverImage: "assets/category/music.jpeg",
+  ),
+  Category(
+    id: "talk",
+    name: "Talk",
+    icon: Icons.mic,
+    tags: ["talk", "just-chatting"],
+    order: 0,
+    coverImage: "assets/category/talk.jpeg",
+  ),
+  Category(
+    id: "art",
+    name: "Art",
+    icon: Icons.brush,
+    tags: ["art"],
+    order: 0,
+    coverImage: "assets/category/art.jpeg",
+  ),
+  Category(
+    id: "gambling",
+    name: "Gambling",
+    icon: Icons.casino,
+    tags: ["gambling", "casino", "slots"],
+    order: 1,
+  ),
+  Category(
+    id: "science-and-technology",
+    name: "Science & Technology",
+    icon: Icons.casino,
+    tags: ["science", "tech", "technology"],
+    order: 1,
+  ),
+];
 
-String formatSats(int n) {
+String formatSats(int n, {int? maxDigits}) {
   final fmt = NumberFormat();
+  fmt.maximumFractionDigits = maxDigits ?? 2;
   if (n >= 1000000) {
     return "${fmt.format(n / 1000000)}M";
   } else if (n >= 1500) {
@@ -270,6 +331,49 @@ String zapSum(List<Nip01Event> zaps) {
   return formatSats(total);
 }
 
+class TopZaps {
+  final int sum;
+  final List<ZapReceipt> zaps;
+
+  const TopZaps({required this.sum, required this.zaps});
+}
+
+Map<String, TopZaps> topZapSender(Iterable<ZapReceipt> zaps) {
+  return Map.fromEntries(
+    zaps
+        .where((e) => e.sender != null)
+        .groupListsBy((v) => v.sender!)
+        .entries
+        .map(
+          (v) => MapEntry(
+            v.key,
+            TopZaps(
+              sum: v.value.fold(0, (acc, v) => acc + (v.amountSats ?? 0)),
+              zaps: v.value,
+            ),
+          ),
+        ),
+  );
+}
+
+Map<String, TopZaps> topZapReceiver(Iterable<ZapReceipt> zaps) {
+  return Map.fromEntries(
+    zaps
+        .where((e) => e.recipient != null)
+        .groupListsBy((v) => v.recipient!)
+        .entries
+        .map(
+          (v) => MapEntry(
+            v.key,
+            TopZaps(
+              sum: v.value.fold(0, (acc, v) => acc + (v.amountSats ?? 0)),
+              zaps: v.value,
+            ),
+          ),
+        ),
+  );
+}
+
 String bech32ToHex(String bech32) {
   final decoder = Bech32Decoder();
   final data = decoder.convert(bech32, 10_000);
@@ -365,4 +469,4 @@ String encodeBech32TLV(String hrp, List<TLV> tlvs) {
   } catch (e) {
     throw FormatException('Failed to encode Bech32 or TLV: $e');
   }
-}
+}

lib/widgets/category_top_zapped.dart

@@ -0,0 +1,109 @@
+import 'package:collection/collection.dart';
+import 'package:flutter/material.dart';
+import 'package:ndk/ndk.dart';
+import 'package:zap_stream_flutter/main.dart';
+import 'package:zap_stream_flutter/rx_filter.dart';
+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';
+
+class CategoryTopZapped extends StatelessWidget {
+  final String tag;
+  final int? limit;
+
+  const CategoryTopZapped({super.key, required this.tag, this.limit});
+
+  @override
+  Widget build(BuildContext context) {
+    return Column(
+      crossAxisAlignment: CrossAxisAlignment.start,
+      spacing: 8,
+      children: [
+        RichText(
+          text: TextSpan(
+            children: [
+              WidgetSpan(
+                child: Icon(Icons.bolt, color: ZAP_1),
+                alignment: PlaceholderAlignment.middle,
+              ),
+              TextSpan(
+                text: " Most Zapped Streamers",
+                style: TextStyle(color: LAYER_4, fontWeight: FontWeight.w500),
+              ),
+            ],
+          ),
+        ),
+
+        SingleChildScrollView(
+          scrollDirection: Axis.horizontal,
+          primary: false,
+          child: FutureBuilder(
+            future:
+                ndk.requests
+                    .query(
+                      filters: [
+                        Filter(
+                          kinds: [30_311],
+                          limit: 100,
+                          tTags: [tag.toLowerCase()],
+                        ),
+                      ],
+                    )
+                    .future,
+            builder: (context, state) {
+              final aTags =
+                  (state.data ?? [])
+                      .map((e) => "30311:${e.pubKey}:${e.getDtag()}")
+                      .toList();
+              return RxFilter<Nip01Event>(
+                Key("top-zapped:$tag:${aTags.length}"),
+                filters: [
+                  Filter(kinds: [9735], aTags: aTags),
+                ],
+                builder: (context, zaps) {
+                  final parsedZaps =
+                      zaps?.map((e) => ZapReceipt.fromEvent(e)) ?? [];
+                  final topZapped = topZapReceiver(parsedZaps).entries
+                      .sortedBy((e) => e.value.sum)
+                      .reversed
+                      .take(limit ?? 5);
+
+                  return Row(
+                    spacing: 16,
+                    children:
+                        topZapped
+                            .map(
+                              (e) => Row(
+                                spacing: 8,
+                                children: [
+                                  AvatarWidget.pubkey(e.key),
+                                  Column(
+                                    crossAxisAlignment:
+                                        CrossAxisAlignment.start,
+                                    spacing: 2,
+                                    children: [
+                                      Text(
+                                        formatSats(e.value.sum, maxDigits: 0),
+                                        style: TextStyle(
+                                          color: ZAP_1,
+                                          fontWeight: FontWeight.bold,
+                                        ),
+                                      ),
+                                      ProfileNameWidget.pubkey(e.key),
+                                    ],
+                                  ),
+                                ],
+                              ),
+                            )
+                            .toList(),
+                  );
+                },
+              );
+            },
+          ),
+        ),
+      ],
+    );
+  }
+}

lib/widgets/chat_message.dart

@@ -6,6 +6,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/chat_modal.dart';
+import 'package:zap_stream_flutter/widgets/custom_emoji.dart';
 import 'package:zap_stream_flutter/widgets/nostr_text.dart';
 import 'package:zap_stream_flutter/widgets/profile.dart';
 
@@ -79,11 +80,11 @@ class ChatReactions extends StatelessWidget {
       filters: [
         Filter(kinds: [9735, 7], eTags: [msg.id]),
       ],
-      builder: (ctx, data) => _chatReactions(data),
+      builder: (ctx, data) => _chatReactions(ctx, data),
     );
   }
 
-  Widget _chatReactions(List<Nip01Event>? events) {
+  Widget _chatReactions(BuildContext context, List<Nip01Event>? events) {
     if ((events?.length ?? 0) == 0) return SizedBox.shrink();
 
     // reactions must have e tag pointing to msg
@@ -113,21 +114,24 @@ class ChatReactions extends StatelessWidget {
           ),
         if (reactions.isNotEmpty)
           ...reactions
-              .fold(<String, Set<String>>{}, (acc, v) {
+              .fold(<String, Set<Nip01Event>>{}, (acc, v) {
                 // ignore: prefer_collection_literals
                 acc[v.content] ??= Set();
-                acc[v.content]!.add(v.pubKey);
+                acc[v.content]!.add(v);
                 return acc;
               })
               .entries
               .map(
                 (v) => Container(
                   padding: EdgeInsets.symmetric(horizontal: 4, vertical: 2),
+                  clipBehavior: Clip.antiAlias,
                   decoration: BoxDecoration(
                     color: LAYER_2,
                     borderRadius: DEFAULT_BR,
                   ),
-                  child: Center(child: Text(v.key)),
+                  child: Center(
+                    child: CustomEmoji(emoji: v.key, tags: v.value.first.tags),
+                  ),
                 ),
               ),
       ],

lib/widgets/chat_write.dart

@@ -1,8 +1,14 @@
+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';
 import 'package:zap_stream_flutter/main.dart';
 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;
@@ -15,11 +21,164 @@ class WriteMessageWidget extends StatefulWidget {
 
 class __WriteMessageWidget extends State<WriteMessageWidget> {
   late final TextEditingController _controller;
+  OverlayEntry? _entry;
+  late FocusNode _focusNode;
 
   @override
   void initState() {
     super.initState();
+    _focusNode = FocusNode();
+    _focusNode.addListener(() {
+      if (!_focusNode.hasFocus && _entry != null) {
+        _entry!.remove();
+        _entry = null;
+      }
+    });
     _controller = TextEditingController();
+    _controller.addListener(() {
+      if (_controller.text.endsWith("@")) {
+        // start auto-complete
+        _showAutoComplete();
+      }
+    });
+  }
+
+  @override
+  void dispose() {
+    if (_entry != null) {
+      _entry!.remove();
+    }
+    _controller.dispose();
+    super.dispose();
+  }
+
+  void _showAutoComplete() {
+    if (_entry != null) {
+      _entry!.remove();
+      _entry = null;
+    }
+
+    final pos = context.findRenderObject() as RenderBox?;
+    _entry = OverlayEntry(
+      builder: (context) {
+        return ValueListenableBuilder(
+          valueListenable: _controller,
+          builder: (context, v, _) {
+            final selectionStart = v.text.lastIndexOf("@");
+            if (selectionStart == -1) {
+              _entry!.remove();
+              _entry = null;
+              return SizedBox();
+            }
+            final search = v.text.substring(selectionStart + 1, v.text.length);
+            if (search.isEmpty) {
+              return SizedBox();
+            }
+            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: FutureBuilder(
+                      future: ndkCache.searchMetadatas(search, 5),
+                      builder: (context, state) {
+                        if (state.data?.isEmpty ?? true) {
+                          return Text("No user found");
+                        }
+
+                        return Column(
+                          spacing: 4,
+                          children:
+                              (state.data ?? [])
+                                  .groupListsBy((m) => m.pubKey)
+                                  .entries
+                                  .map(
+                                    (m) => GestureDetector(
+                                      onTap: () {
+                                        // replace search string with npub
+                                        _controller
+                                            .text = _controller.text.replaceRange(
+                                          selectionStart,
+                                          _controller.text.length,
+                                          "nostr:${Nip19.encodePubKey(m.value.first.pubKey)}",
+                                        );
+                                        _entry!.remove();
+                                        _entry = null;
+                                      },
+                                      child: Row(
+                                        spacing: 4,
+                                        children: [
+                                          AvatarWidget(
+                                            profile: m.value.first,
+                                            size: 30,
+                                          ),
+                                          Expanded(
+                                            child: Text(
+                                              ProfileNameWidget.nameFromProfile(
+                                                m.value.first,
+                                              ),
+                                            ),
+                                          ),
+                                        ],
+                                      ),
+                                    ),
+                                  )
+                                  .toList(),
+                        );
+                      },
+                    ),
+                  ),
+                ),
+              ],
+            );
+          },
+        );
+      },
+    );
+    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 {
@@ -35,7 +194,7 @@ class __WriteMessageWidget extends State<WriteMessageWidget> {
       ],
     );
     _controller.clear();
-    FocusScope.of(context).unfocus();
+    _focusNode.unfocus();
     final res = ndk.broadcast.broadcast(nostrEvent: chatMsg);
     await res.broadcastDoneFuture;
   }
@@ -55,6 +214,9 @@ class __WriteMessageWidget extends State<WriteMessageWidget> {
                 children: [
                   Expanded(
                     child: TextField(
+                      maxLines: 3,
+                      minLines: 1,
+                      focusNode: _focusNode,
                       controller: _controller,
                       onSubmitted: (_) => _sendMessage(context),
                       decoration: InputDecoration(
@@ -65,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/custom_emoji.dart

@@ -0,0 +1,39 @@
+import 'package:cached_network_image/cached_network_image.dart';
+import 'package:collection/collection.dart';
+import 'package:flutter/widgets.dart';
+import 'package:zap_stream_flutter/imgproxy.dart';
+
+class CustomEmoji extends StatelessWidget {
+  final List<List<String>> tags;
+  final String emoji;
+  final double? size;
+
+  const CustomEmoji({
+    super.key,
+    required this.tags,
+    required this.emoji,
+    this.size,
+  });
+
+  @override
+  Widget build(BuildContext context) {
+    final cleanedEmojiName =
+        emoji.startsWith(":") && emoji.endsWith(":")
+            ? emoji.substring(1, emoji.length - 1)
+            : emoji;
+
+    final customEmoji =
+        tags.firstWhereOrNull(
+          (t) => t[0] == "emoji" && t[1] == cleanedEmojiName,
+        )?[2];
+    if (customEmoji != null) {
+      return CachedNetworkImage(
+        imageUrl: proxyImg(context, customEmoji),
+        height: size ?? 16,
+        width: size ?? 16,
+      );
+    } else {
+      return Text(emoji);
+    }
+  }
+}

lib/widgets/game_info.dart

@@ -0,0 +1,25 @@
+import 'package:flutter/widgets.dart';
+import 'package:go_router/go_router.dart';
+import 'package:zap_stream_flutter/theme.dart';
+import 'package:zap_stream_flutter/utils.dart';
+import 'package:zap_stream_flutter/widgets/pill.dart';
+
+class GameInfoWidget extends StatelessWidget {
+  final GameInfo info;
+
+  const GameInfoWidget({super.key, required this.info});
+
+  @override
+  Widget build(BuildContext context) {
+    return PillWidget(
+      color: LAYER_2,
+      onTap: () {
+        context.push("/category/${Uri.encodeComponent(info.id)}", extra: info);
+      },
+      child: Text(
+        info.name,
+        style: TextStyle(color: PRIMARY_1, fontWeight: FontWeight.bold),
+      ),
+    );
+  }
+}

lib/widgets/nostr_text.dart

@@ -6,6 +6,7 @@ import 'package:ndk/shared/nips/nip19/nip19.dart';
 import 'package:url_launcher/url_launcher.dart';
 import 'package:zap_stream_flutter/theme.dart';
 import 'package:zap_stream_flutter/utils.dart';
+import 'package:zap_stream_flutter/widgets/custom_emoji.dart';
 import 'package:zap_stream_flutter/widgets/profile.dart';
 
 class NoteText extends StatelessWidget {
@@ -30,12 +31,12 @@ List<InlineSpan> textToSpans(
   List<List<String>> tags,
   String pubkey,
 ) {
-  return _buildContentSpans(content);
+  return _buildContentSpans(content, tags);
 }
 
 /// Content parser from camelus
 /// https://github.com/leo-lox/camelus/blob/f58455a0ac07fcc780bdc69b8f4544fd5ea4a46d/lib/presentation_layer/components/note_card/note_card_build_split_content.dart#L262
-List<InlineSpan> _buildContentSpans(String content) {
+List<InlineSpan> _buildContentSpans(String content, List<List<String>> tags) {
   List<InlineSpan> spans = [];
   RegExp exp = RegExp(
     r'nostr:(nprofile|npub)[a-zA-Z0-9]+|'
@@ -62,7 +63,23 @@ List<InlineSpan> _buildContentSpans(String content) {
       return '';
     },
     onNonMatch: (String text) {
-      spans.add(TextSpan(text: text));
+      final textTrim = text.trim();
+      if (textTrim.startsWith(":") &&
+          textTrim.endsWith(":") &&
+          tags.any(
+            (t) =>
+                t[0] == "emoji" &&
+                t[1] == textTrim.substring(1, textTrim.length - 1),
+          )) {
+        spans.add(
+          WidgetSpan(
+            alignment: PlaceholderAlignment.middle,
+            child: CustomEmoji(emoji: textTrim, tags: tags, size: 24),
+          ),
+        );
+      } else {
+        spans.add(TextSpan(text: text));
+      }
       return '';
     },
   );

lib/widgets/pill.dart

@@ -3,12 +3,18 @@ import 'package:flutter/material.dart';
 class PillWidget extends StatelessWidget {
   final Widget child;
   final Color? color;
+  final void Function()? onTap;
 
-  const PillWidget({super.key, required this.child, required this.color});
+  const PillWidget({
+    super.key,
+    required this.child,
+    required this.color,
+    this.onTap,
+  });
 
   @override
   Widget build(BuildContext context) {
-    return Container(
+    final inner = Container(
       padding: EdgeInsets.symmetric(horizontal: 8, vertical: 4),
       decoration: BoxDecoration(
         borderRadius: BorderRadius.all(Radius.circular(8)),
@@ -16,5 +22,6 @@ class PillWidget extends StatelessWidget {
       ),
       child: child,
     );
+    return onTap != null ? GestureDetector(onTap: onTap, child: inner) : inner;
   }
 }

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(
-        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,
-        ),
-      ),
+      config: emojiPickerConfig,
     );
   }
 }

lib/widgets/stream_grid.dart

@@ -25,6 +25,11 @@ class StreamGrid extends StatelessWidget {
         events
             .map((e) => StreamEvent(e))
             .where((e) => e.info.stream?.contains(".m3u8") ?? false)
+            .where(
+              (e) =>
+                  (e.info.starts ?? e.event.createdAt) <=
+                  (DateTime.now().millisecondsSinceEpoch / 1000),
+            )
             .sortedBy((a) => a.info.starts ?? a.event.createdAt)
             .reversed;
     final live = streams.where((s) => s.info.status == StreamStatus.live);

lib/widgets/stream_info.dart

@@ -1,8 +1,12 @@
 import 'package:flutter/material.dart';
+import 'package:go_router/go_router.dart';
 import 'package:intl/intl.dart';
 import 'package:zap_stream_flutter/theme.dart';
 import 'package:zap_stream_flutter/utils.dart';
 import 'package:zap_stream_flutter/widgets/button_follow.dart';
+import 'package:zap_stream_flutter/widgets/game_info.dart';
+import 'package:zap_stream_flutter/widgets/nostr_text.dart';
+import 'package:zap_stream_flutter/widgets/pill.dart';
 import 'package:zap_stream_flutter/widgets/profile.dart';
 import 'package:zap_stream_flutter/widgets/stream_cards.dart';
 
@@ -45,7 +49,36 @@ class StreamInfoWidget extends StatelessWidget {
               ),
             ),
           if (stream.info.summary?.isNotEmpty ?? false)
-            Text(stream.info.summary!),
+            Text.rich(
+              TextSpan(
+                children: textToSpans(
+                  stream.info.summary!,
+                  [],
+                  stream.info.host,
+                ),
+              ),
+            ),
+
+          if (stream.info.tags.isNotEmpty || stream.info.gameInfo != null)
+            Row(
+              spacing: 2,
+              children: [
+                if (stream.info.gameInfo != null)
+                  GameInfoWidget(info: stream.info.gameInfo!),
+                ...stream.info.tags.map(
+                  (t) => PillWidget(
+                    color: LAYER_2,
+                    onTap: () {
+                      context.push("/t/${Uri.encodeComponent(t)}");
+                    },
+                    child: Text(
+                      t,
+                      style: TextStyle(fontWeight: FontWeight.bold),
+                    ),
+                  ),
+                ),
+              ],
+            ),
           StreamCardsWidget(stream: stream),
         ],
       ),

pubspec.yaml

@@ -1,7 +1,7 @@
 name: zap_stream_flutter
 description: "zap.stream"
 publish_to: 'none'
-version: 0.4.0+6
+version: 0.5.0+7
 
 environment:
   sdk: ^3.7.2
@@ -60,4 +60,5 @@ flutter:
   uses-material-design: true
   assets:
     - "assets/svg/"
-    - "assets/logo.png"
+    - "assets/logo.png"
+    - "assets/category/"