chore: bump version

closes #22

lib/pages/profile.dart

@@ -10,6 +10,7 @@ import 'package:zap_stream_flutter/utils.dart';
 import 'package:zap_stream_flutter/widgets/avatar.dart';
 import 'package:zap_stream_flutter/widgets/button.dart';
 import 'package:zap_stream_flutter/widgets/header.dart';
+import 'package:zap_stream_flutter/widgets/nostr_text.dart';
 import 'package:zap_stream_flutter/widgets/profile.dart';
 import 'package:zap_stream_flutter/widgets/stream_grid.dart';
 
@@ -53,9 +54,15 @@ class ProfilePage extends StatelessWidget {
                           fontWeight: FontWeight.w600,
                         ),
                       ),
-                      Text(
+                      Text.rich(
-                        profile.about ?? "",
+                        TextSpan(
-                        style: TextStyle(color: LAYER_5),
+                          style: TextStyle(color: LAYER_5),
+                          children: textToSpans(
+                            profile.about ?? "",
+                            [],
+                            profile.pubKey,
+                          ),
+                        ),
                       ),
                     ],
                   ),

lib/pages/stream.dart

@@ -13,6 +13,7 @@ import 'package:zap_stream_flutter/widgets/button.dart';
 import 'package:zap_stream_flutter/widgets/chat.dart';
 import 'package:zap_stream_flutter/widgets/pill.dart';
 import 'package:zap_stream_flutter/widgets/profile.dart';
+import 'package:zap_stream_flutter/widgets/stream_info.dart';
 import 'package:zap_stream_flutter/widgets/zap.dart';
 
 class StreamPage extends StatefulWidget {
@@ -100,7 +101,10 @@ class _StreamPage extends State<StreamPage> {
           aspectRatio: 16 / 9,
           child:
               _chewieController != null
-                  ? Chewie(controller: _chewieController!)
+                  ? Chewie(
+                    key: Key("stream:player:${stream.aTag}"),
+                    controller: _chewieController!,
+                  )
                   : Container(
                     color: LAYER_1,
                     child:
@@ -160,6 +164,15 @@ class _StreamPage extends State<StreamPage> {
                       ),
                     ),
                   ),
+                GestureDetector(
+                  onTap: () {
+                    showBottomSheet(
+                      context: context,
+                      builder: (context) => StreamInfoWidget(stream: stream),
+                    );
+                  },
+                  child: Icon(Icons.info),
+                ),
               ],
             ),
           ],

lib/rx_filter.dart

@@ -1,3 +1,4 @@
+import 'dart:async';
 import 'dart:collection';
 import 'dart:developer' as developer;
 
@@ -29,6 +30,7 @@ class RxFilter<T> extends StatefulWidget {
 
 class _RxFilter<T> extends State<RxFilter<T>> {
   late NdkResponse _response;
+  late StreamSubscription _listener;
   HashMap<String, (int, T)>? _events;
 
   @override
@@ -45,19 +47,21 @@ class _RxFilter<T> extends State<RxFilter<T>> {
         ndk.requests.closeSubscription(_response.requestId);
       });
     }
-    _response.stream
+    _listener = _response.stream
         .bufferTime(const Duration(milliseconds: 500))
         .where((events) => events.isNotEmpty)
         .handleError((e) {
           developer.log("RX:ERROR $e");
         })
         .listen((events) {
-          setState(() {
+          if (context.mounted) {
-            developer.log(
+            setState(() {
-              "RX:GOT ${events.length} events for ${widget.filters}",
+              developer.log(
-            );
+                "RX:GOT ${events.length} events for ${widget.filters}",
-            events.forEach(_replaceInto);
+              );
-          });
+              events.forEach(_replaceInto);
+            });
+          }
         });
   }
 
@@ -88,6 +92,7 @@ class _RxFilter<T> extends State<RxFilter<T>> {
     super.dispose();
 
     developer.log("RX:CLOSING ${widget.filters}");
+    _listener.cancel();
     ndk.requests.closeSubscription(_response.requestId);
   }
 

lib/utils.dart

@@ -1,3 +1,5 @@
+import 'dart:convert';
+
 import 'package:bech32/bech32.dart';
 import 'package:collection/collection.dart';
 import 'package:convert/convert.dart';
@@ -15,6 +17,23 @@ class StreamEvent {
     return "${event.kind}:${event.pubKey}:${info.id}";
   }
 
+  /// Get the naddr for this stream
+  String get link {
+    final k = event.kind & 0xFFFFFFFF;
+    final idData = utf8.encode(info.id!);
+    final tlv = [
+      TLV(0, idData.length, idData),
+      TLV(2, 32, hex.decode(event.pubKey)),
+      TLV(3, 4, [
+        (k >> 24) & 0xFF,
+        (k >> 16) & 0xFF,
+        (k >> 8) & 0xFF,
+        k & 0xFF,
+      ]),
+    ];
+    return encodeBech32TLV("naddr", tlv);
+  }
+
   StreamEvent(this.event) {
     info = extractStreamInfo(event);
   }
@@ -269,6 +288,25 @@ class TLV {
   final List<int> value;
 
   TLV(this.type, this.length, this.value);
+
+  void validate() {
+    if (type < 0 || type > 255) {
+      throw ArgumentError('Type must be 0-255 (1 byte)');
+    }
+    if (length < 0 || length > 255) {
+      throw ArgumentError('Length must be 0-255 (1 byte)');
+    }
+    if (length != value.length) {
+      throw ArgumentError(
+        'Length ($length) does not match value length (${value.length})',
+      );
+    }
+    for (var byte in value) {
+      if (byte < 0 || byte > 255) {
+        throw ArgumentError('Value bytes must be 0-255');
+      }
+    }
+  }
 }
 
 List<TLV> parseTLV(List<int> data) {
@@ -303,3 +341,28 @@ List<TLV> parseTLV(List<int> data) {
 
   return result;
 }
+
+List<int> serializeTLV(List<TLV> tlvs) {
+  List<int> result = [];
+
+  for (var tlv in tlvs) {
+    tlv.validate();
+    result.add(tlv.type);
+    result.add(tlv.length);
+    result.addAll(tlv.value);
+  }
+
+  return result;
+}
+
+/// Encodes TLV data into a Bech32 string
+String encodeBech32TLV(String hrp, List<TLV> tlvs) {
+  try {
+    final data8bit = serializeTLV(tlvs);
+    final data5bit = Nip19.convertBits(data8bit, 8, 5, true);
+    final bech32Data = Bech32(hrp, data5bit);
+    return bech32.encode(bech32Data, 10_000);
+  } catch (e) {
+    throw FormatException('Failed to encode Bech32 or TLV: $e');
+  }
+}

lib/widgets/button_follow.dart

@@ -0,0 +1,69 @@
+import 'package:flutter/material.dart';
+import 'package:zap_stream_flutter/main.dart';
+import 'package:zap_stream_flutter/theme.dart';
+import 'package:zap_stream_flutter/widgets/button.dart';
+
+class FollowButton extends StatelessWidget {
+  final String pubkey;
+  final void Function()? onTap;
+  final void Function()? onFollow;
+  final void Function()? onUnfollow;
+
+  const FollowButton({
+    super.key,
+    required this.pubkey,
+    this.onTap,
+    this.onFollow,
+    this.onUnfollow,
+  });
+
+  @override
+  Widget build(BuildContext context) {
+    final signer = ndk.accounts.getLoggedAccount()?.signer;
+    if (signer == null || signer.getPublicKey() == pubkey) {
+      return SizedBox.shrink();
+    }
+
+    return FutureBuilder(
+      future: ndk.follows.getContactList(signer.getPublicKey()),
+      builder: (context, state) {
+        final follows = state.data?.contacts ?? [];
+        final isFollowing = follows.contains(pubkey);
+        return BasicButton(
+          Row(
+            mainAxisAlignment: MainAxisAlignment.center,
+            spacing: 4,
+            children: [
+              Icon(isFollowing ? Icons.person_remove : Icons.person_add, size: 16),
+              Text(
+                isFollowing ? "Unfollow" : "Follow",
+                style: TextStyle(fontWeight: FontWeight.bold),
+              ),
+            ],
+          ),
+          padding: EdgeInsets.symmetric(vertical: 4, horizontal: 12),
+          decoration: BoxDecoration(
+            borderRadius: DEFAULT_BR,
+            color: LAYER_2,
+          ),
+          onTap: () async {
+            if (onTap != null) {
+              onTap!();
+            }
+            if (isFollowing) {
+              await ndk.follows.broadcastRemoveContact(pubkey);
+              if (onUnfollow != null) {
+                onUnfollow!();
+              }
+            } else {
+              await ndk.follows.broadcastAddContact(pubkey);
+              if (onFollow != null) {
+                onFollow!();
+              }
+            }
+          },
+        );
+      },
+    );
+  }
+}

lib/widgets/chat.dart

@@ -5,9 +5,11 @@ 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/chat_message.dart';
+import 'package:zap_stream_flutter/widgets/chat_raid.dart';
 import 'package:zap_stream_flutter/widgets/chat_write.dart';
+import 'package:zap_stream_flutter/widgets/chat_zap.dart';
+import 'package:zap_stream_flutter/widgets/goal.dart';
 import 'package:zap_stream_flutter/widgets/profile.dart';
 
 class ChatWidget extends StatelessWidget {
@@ -23,6 +25,7 @@ class ChatWidget extends StatelessWidget {
 
     var filters = [
       Filter(kinds: [1311, 9735], limit: 200, aTags: [stream.aTag]),
+      Filter(kinds: [1312], limit: 200, aTags: [stream.aTag]),
       Filter(kinds: [Nip51List.kMute], authors: muteLists),
     ];
     return RxFilter<Nip01Event>(
@@ -64,8 +67,7 @@ class ChatWidget extends StatelessWidget {
           crossAxisAlignment: CrossAxisAlignment.start,
           children: [
             if (zaps.isNotEmpty) _TopZappersWidget(events: zaps),
-            if (stream.info.goal != null)
+            if (stream.info.goal != null) GoalWidget.id(stream.info.goal!),
-              _StreamGoalWidget.id(stream.info.goal!),
             Expanded(
               child: ListView.builder(
                 reverse: true,
@@ -78,12 +80,16 @@ class ChatWidget extends StatelessWidget {
                         stream: stream,
                         msg: filteredChat[idx],
                       ),
-                      9735 => _ChatZapWidget(
+                      1312 => ChatRaidMessage(
+                        event: filteredChat[idx],
+                        stream: stream,
+                      ),
+                      9735 => ChatZapWidget(
                         key: Key("chat:${filteredChat[idx].id}"),
                         stream: stream,
                         zap: filteredChat[idx],
                       ),
-                      _ => SizedBox.shrink(),
+                      _ => SizedBox(),
                     },
               ),
             ),
@@ -92,10 +98,13 @@ class ChatWidget extends StatelessWidget {
             if (stream.info.status == StreamStatus.ended)
               Container(
                 padding: EdgeInsets.all(8),
-                margin: EdgeInsets.symmetric(vertical: 8),
+                margin: EdgeInsets.only(bottom: 8, top: 4),
                 width: double.maxFinite,
                 alignment: Alignment.center,
-                decoration: BoxDecoration(borderRadius: DEFAULT_BR),
+                decoration: BoxDecoration(
+                  borderRadius: DEFAULT_BR,
+                  color: PRIMARY_1,
+                ),
                 child: Text(
                   "STREAM ENDED",
                   style: TextStyle(fontWeight: FontWeight.bold),
@@ -108,106 +117,6 @@ class ChatWidget extends StatelessWidget {
   }
 }
 
-class _StreamGoalWidget extends StatelessWidget {
-  final Nip01Event goal;
-
-  const _StreamGoalWidget({required this.goal});
-
-  static Widget id(String id) {
-    return RxFilter<Nip01Event>(
-      Key("stream:goal:$id"),
-      leaveOpen: false,
-      filters: [
-        Filter(kinds: [9041], ids: [id]),
-      ],
-      builder: (ctx, state) {
-        final goal = state?.firstOrNull;
-        return goal != null ? _StreamGoalWidget(goal: goal) : SizedBox.shrink();
-      },
-    );
-  }
-
-  @override
-  Widget build(BuildContext context) {
-    final max = int.parse(goal.getFirstTag("amount") ?? "1");
-    return Container(
-      padding: EdgeInsets.symmetric(horizontal: 4, vertical: 4),
-      child: RxFilter<Nip01Event>(
-        Key("stream:goal:$id:zaps"),
-        filters: [
-          Filter(kinds: [9735], eTags: [goal.id]),
-        ],
-        builder: (ctx, state) {
-          final zaps = (state ?? []).map((e) => ZapReceipt.fromEvent(e));
-          final totalZaps =
-              zaps.fold(0, (acc, v) => acc + (v.amountSats ?? 0)) * 1000;
-          final progress = totalZaps / max;
-          final remaining = ((max - totalZaps).clamp(0, max) / 1000).toInt();
-
-          final q = MediaQuery.of(ctx);
-          return Column(
-            spacing: 4,
-            crossAxisAlignment: CrossAxisAlignment.start,
-            children: [
-              Row(
-                children: [
-                  Expanded(child: Text(goal.content)),
-                  if (remaining > 0)
-                    Text(
-                      "Remaining: ${formatSats(remaining)}",
-                      style: TextStyle(fontSize: 10, color: LAYER_5),
-                    ),
-                ],
-              ),
-              Stack(
-                children: [
-                  Container(
-                    height: 10,
-                    decoration: BoxDecoration(
-                      color: LAYER_2,
-                      borderRadius: DEFAULT_BR,
-                    ),
-                  ),
-                  Container(
-                    height: 10,
-                    width: (q.size.width * progress).clamp(1, q.size.width),
-                    decoration: BoxDecoration(
-                      color: ZAP_1,
-                      borderRadius: DEFAULT_BR,
-                    ),
-                  ),
-                  if (remaining > 0)
-                    Positioned(
-                      right: 2,
-                      child: Text(
-                        "Goal: ${formatSats((max / 1000).toInt())}",
-                        style: TextStyle(
-                          fontSize: 8,
-                          fontWeight: FontWeight.bold,
-                        ),
-                      ),
-                    ),
-                  if (remaining == 0)
-                    Center(
-                      child: Text(
-                        "COMPLETE",
-                        style: TextStyle(
-                          color: LAYER_0,
-                          fontSize: 8,
-                          fontWeight: FontWeight.bold,
-                        ),
-                      ),
-                    ),
-                ],
-              ),
-            ],
-          );
-        },
-      ),
-    );
-  }
-}
-
 class _TopZappersWidget extends StatelessWidget {
   final List<ZapReceipt> events;
 
@@ -260,74 +169,3 @@ class _TopZappersWidget extends StatelessWidget {
     );
   }
 }
-
-class _ChatZapWidget extends StatelessWidget {
-  final StreamEvent stream;
-  final Nip01Event zap;
-
-  const _ChatZapWidget({required this.stream, required this.zap, super.key});
-
-  @override
-  Widget build(BuildContext context) {
-    final parsed = ZapReceipt.fromEvent(zap);
-    return Container(
-      margin: EdgeInsets.symmetric(vertical: 4),
-      padding: EdgeInsets.all(8),
-      decoration: BoxDecoration(
-        border: Border.all(color: ZAP_1),
-        borderRadius: DEFAULT_BR,
-      ),
-      child: Column(
-        crossAxisAlignment: CrossAxisAlignment.start,
-        children: [
-          _zapperRowZap(parsed),
-          if (parsed.comment?.isNotEmpty ?? false) Text(parsed.comment!),
-        ],
-      ),
-    );
-  }
-
-  Widget _zapperRowZap(ZapReceipt parsed) {
-    if (parsed.sender != null) {
-      return ProfileLoaderWidget(parsed.sender!, (ctx, state) {
-        final name = ProfileNameWidget.nameFromProfile(
-          state.data ?? Metadata(pubKey: parsed.sender!),
-        );
-        return _zapperRow(name, parsed.amountSats ?? 0, state.data);
-      });
-    } else {
-      return _zapperRow("Anon", parsed.amountSats ?? 0, null);
-    }
-  }
-
-  Widget _zapperRow(String name, int amount, Metadata? profile) {
-    return Row(
-      crossAxisAlignment: CrossAxisAlignment.end,
-      children: [
-        RichText(
-          text: TextSpan(
-            style: TextStyle(color: ZAP_1),
-            children: [
-              WidgetSpan(
-                child: Icon(Icons.bolt, color: ZAP_1),
-                alignment: PlaceholderAlignment.middle,
-              ),
-              if (profile != null)
-                WidgetSpan(
-                  child: Padding(
-                    padding: EdgeInsets.only(right: 8),
-                    child: AvatarWidget(profile: profile, size: 20),
-                  ),
-                  alignment: PlaceholderAlignment.middle,
-                ),
-              TextSpan(text: name),
-              TextSpan(text: " zapped ", style: TextStyle(color: FONT_COLOR)),
-              TextSpan(text: formatSats(amount)),
-              TextSpan(text: " sats", style: TextStyle(color: FONT_COLOR)),
-            ],
-          ),
-        ),
-      ],
-    );
-  }
-}

lib/widgets/chat_modal.dart

@@ -1,6 +1,7 @@
 import 'package:flutter/material.dart';
 import 'package:ndk/ndk.dart';
 import 'package:zap_stream_flutter/theme.dart';
+import 'package:zap_stream_flutter/widgets/button_follow.dart';
 import 'package:zap_stream_flutter/widgets/mute_button.dart';
 import 'package:zap_stream_flutter/widgets/nostr_text.dart';
 import 'package:zap_stream_flutter/widgets/profile.dart';
@@ -75,6 +76,12 @@ class _ChatModalWidget extends State<ChatModalWidget> {
             ],
           ),
           if (_showEmojiPicker) ReactionWidget(event: widget.event),
+          FollowButton(
+            pubkey: widget.event.pubKey,
+            onTap: () {
+              Navigator.pop(context);
+            },
+          ),
           MuteButton(
             pubkey: widget.event.pubKey,
             onTap: () {

lib/widgets/chat_raid.dart

@@ -0,0 +1,216 @@
+import 'package:collection/collection.dart';
+import 'package:flutter/material.dart';
+import 'package:go_router/go_router.dart';
+import 'package:ndk/ndk.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/profile.dart';
+
+class ChatRaidMessage extends StatefulWidget {
+  final StreamEvent stream;
+  final Nip01Event event;
+
+  const ChatRaidMessage({super.key, required this.stream, required this.event});
+
+  @override
+  State<StatefulWidget> createState() => __ChatRaidMessage();
+}
+
+class __ChatRaidMessage extends State<ChatRaidMessage>
+    with SingleTickerProviderStateMixin {
+  late final String? _from;
+  late final String? _to;
+  late final bool _isRaiding;
+
+  DateTime? _raidingAt;
+
+  @override
+  void initState() {
+    super.initState();
+
+    _from =
+        widget.event.tags.firstWhereOrNull(
+          (t) => t[0] == "a" && (t[3] == "from" || t[3] == "root"),
+        )?[1];
+    _to =
+        widget.event.tags.firstWhereOrNull(
+          (t) => t[0] == "a" && (t[3] == "to" || t[3] == "mention"),
+        )?[1];
+    _isRaiding = _from == widget.stream.aTag;
+    final isAutoRaid =
+        ((DateTime.now().millisecondsSinceEpoch / 1000) -
+                widget.event.createdAt)
+            .abs() <
+        60;
+    if (isAutoRaid) {
+      final autoRaidDelay = Duration(seconds: 5);
+      _raidingAt = DateTime.now().add(autoRaidDelay);
+    }
+  }
+
+  @override
+  Widget build(BuildContext context) {
+    if (_from == null || _to == null) return SizedBox.shrink();
+
+    final otherLink = (_isRaiding ? _to : _from).split(":");
+    final otherEvent = ndk.requests.query(
+      filters: [
+        Filter(
+          kinds: [int.parse(otherLink[0])],
+          authors: [otherLink[1]],
+          dTags: [otherLink[2]],
+        ),
+      ],
+    );
+
+    return Container(
+      padding: EdgeInsets.all(8),
+      margin: EdgeInsets.symmetric(vertical: 4),
+      width: double.maxFinite,
+      alignment: Alignment.center,
+      decoration: BoxDecoration(borderRadius: DEFAULT_BR, color: PRIMARY_1),
+      child: FutureBuilder(
+        future: otherEvent.future,
+        builder: (ctx, state) {
+          final otherStream = state.data?.firstWhereOrNull(
+            (e) => e.getDtag() == otherLink[2] && e.pubKey == otherLink[1],
+          );
+          if (otherStream == null) return SizedBox.shrink();
+          final otherStreamEvent = StreamEvent(otherStream);
+          return Column(
+            children: [
+              RichText(
+                text: TextSpan(
+                  style: TextStyle(fontWeight: FontWeight.bold),
+                  children: [
+                    TextSpan(text: _isRaiding ? "RAIDING " : "RAID FROM "),
+                    WidgetSpan(
+                      alignment: PlaceholderAlignment.middle,
+                      child: ProfileLoaderWidget(otherStreamEvent.info.host, (
+                        ctx,
+                        profile,
+                      ) {
+                        return Text(
+                          ProfileNameWidget.nameFromProfile(
+                            profile.data ??
+                                Metadata(pubKey: otherStreamEvent.info.host),
+                          ).toUpperCase(),
+                          style: TextStyle(fontWeight: FontWeight.bold),
+                        );
+                      }),
+                    ),
+                    if (_raidingAt == null)
+                      WidgetSpan(
+                        alignment: PlaceholderAlignment.middle,
+                        child: GestureDetector(
+                          onTap: () {
+                            context.go(
+                              "/e/${otherStreamEvent.link}",
+                              extra: otherStreamEvent,
+                            );
+                          },
+                          child: Padding(
+                            padding: EdgeInsets.symmetric(horizontal: 8),
+                            child: Icon(Icons.open_in_new, size: 15),
+                          ),
+                        ),
+                      ),
+                  ],
+                ),
+              ),
+              if (_raidingAt != null)
+                RichText(
+                  text: TextSpan(
+                    children: [
+                      TextSpan(text: "Raiding in "),
+                      WidgetSpan(
+                        alignment: PlaceholderAlignment.middle,
+                        child: CountdownTimer(
+                          triggerAt: _raidingAt!,
+                          onTrigger: () {
+                            context.go(
+                              "/e/${otherStreamEvent.link}",
+                              extra: otherStreamEvent,
+                            );
+                          },
+                        ),
+                      ),
+                    ],
+                  ),
+                ),
+            ],
+          );
+        },
+      ),
+    );
+  }
+}
+
+class CountdownTimer extends StatefulWidget {
+  final void Function() onTrigger;
+  final TextStyle? style;
+  final DateTime triggerAt;
+
+  const CountdownTimer({
+    super.key,
+    required this.onTrigger,
+    this.style,
+    required this.triggerAt,
+  });
+
+  @override
+  createState() => _CountdownTimerState();
+}
+
+class _CountdownTimerState extends State<CountdownTimer>
+    with SingleTickerProviderStateMixin {
+  late AnimationController _controller;
+  late Animation<double> _animation;
+  bool _actionTriggered = false;
+
+  @override
+  void initState() {
+    super.initState();
+    final now = DateTime.now();
+    final countdown =
+        widget.triggerAt.isBefore(now)
+            ? Duration()
+            : widget.triggerAt.difference(now);
+
+    _controller = AnimationController(vsync: this, duration: countdown);
+
+    // Create animation to track progress from 5 to 0
+    _animation = Tween<double>(
+      begin: countdown.inSeconds.toDouble(),
+      end: 0,
+    ).animate(_controller)..addStatusListener((status) {
+      if (status == AnimationStatus.completed && !_actionTriggered) {
+        setState(() {
+          _actionTriggered = true;
+          widget.onTrigger();
+        });
+      }
+    });
+
+    // Start the countdown immediately when widget is mounted
+    _controller.forward();
+  }
+
+  @override
+  void dispose() {
+    _controller.dispose(); // Clean up the controller
+    super.dispose();
+  }
+
+  @override
+  Widget build(BuildContext context) {
+    return AnimatedBuilder(
+      animation: _animation,
+      builder: (context, child) {
+        final secondsLeft = _animation.value.ceil();
+        return Text(secondsLeft.toString(), style: widget.style);
+      },
+    );
+  }
+}

lib/widgets/chat_write.dart

@@ -22,19 +22,20 @@ class __WriteMessageWidget extends State<WriteMessageWidget> {
     _controller = TextEditingController();
   }
 
-  Future<void> _sendMessage() async {
+  Future<void> _sendMessage(BuildContext context) async {
     final login = ndk.accounts.getLoggedAccount();
-    if (login == null) return;
+    if (login == null || _controller.text.isEmpty) return;
 
     final chatMsg = Nip01Event(
       pubKey: login.pubkey,
       kind: 1311,
-      content: _controller.text,
+      content: _controller.text.toString(),
       tags: [
         ["a", widget.stream.aTag],
       ],
     );
-    _controller.text = "";
+    _controller.clear();
+    FocusScope.of(context).unfocus();
     final res = ndk.broadcast.broadcast(nostrEvent: chatMsg);
     await res.broadcastDoneFuture;
   }
@@ -55,7 +56,7 @@ class __WriteMessageWidget extends State<WriteMessageWidget> {
                   Expanded(
                     child: TextField(
                       controller: _controller,
-                      onSubmitted: (_) => _sendMessage(),
+                      onSubmitted: (_) => _sendMessage(context),
                       decoration: InputDecoration(
                         labelText: "Write message",
                         contentPadding: EdgeInsets.symmetric(vertical: 4),
@@ -67,7 +68,7 @@ class __WriteMessageWidget extends State<WriteMessageWidget> {
                   //IconButton(onPressed: () {}, icon: Icon(Icons.mood)),
                   IconButton(
                     onPressed: () {
-                      _sendMessage();
+                      _sendMessage(context);
                     },
                     icon: Icon(Icons.send),
                   ),

lib/widgets/chat_zap.dart

@@ -0,0 +1,77 @@
+import 'package:flutter/material.dart';
+import 'package:ndk/ndk.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 ChatZapWidget extends StatelessWidget {
+  final StreamEvent stream;
+  final Nip01Event zap;
+
+  const ChatZapWidget({required this.stream, required this.zap, super.key});
+
+  @override
+  Widget build(BuildContext context) {
+    final parsed = ZapReceipt.fromEvent(zap);
+    return Container(
+      margin: EdgeInsets.symmetric(vertical: 4),
+      padding: EdgeInsets.all(8),
+      decoration: BoxDecoration(
+        border: Border.all(color: ZAP_1),
+        borderRadius: DEFAULT_BR,
+      ),
+      child: Column(
+        crossAxisAlignment: CrossAxisAlignment.start,
+        children: [
+          _zapperRowZap(parsed),
+          if (parsed.comment?.isNotEmpty ?? false) Text(parsed.comment!),
+        ],
+      ),
+    );
+  }
+
+  Widget _zapperRowZap(ZapReceipt parsed) {
+    if (parsed.sender != null) {
+      return ProfileLoaderWidget(parsed.sender!, (ctx, state) {
+        final name = ProfileNameWidget.nameFromProfile(
+          state.data ?? Metadata(pubKey: parsed.sender!),
+        );
+        return _zapperRow(name, parsed.amountSats ?? 0, state.data);
+      });
+    } else {
+      return _zapperRow("Anon", parsed.amountSats ?? 0, null);
+    }
+  }
+
+  Widget _zapperRow(String name, int amount, Metadata? profile) {
+    return Row(
+      crossAxisAlignment: CrossAxisAlignment.end,
+      children: [
+        RichText(
+          text: TextSpan(
+            style: TextStyle(color: ZAP_1),
+            children: [
+              WidgetSpan(
+                child: Icon(Icons.bolt, color: ZAP_1),
+                alignment: PlaceholderAlignment.middle,
+              ),
+              if (profile != null)
+                WidgetSpan(
+                  child: Padding(
+                    padding: EdgeInsets.only(right: 8),
+                    child: AvatarWidget(profile: profile, size: 20),
+                  ),
+                  alignment: PlaceholderAlignment.middle,
+                ),
+              TextSpan(text: name),
+              TextSpan(text: " zapped ", style: TextStyle(color: FONT_COLOR)),
+              TextSpan(text: formatSats(amount)),
+              TextSpan(text: " sats", style: TextStyle(color: FONT_COLOR)),
+            ],
+          ),
+        ),
+      ],
+    );
+  }
+}

lib/widgets/goal.dart

@@ -0,0 +1,105 @@
+import 'package:flutter/material.dart';
+import 'package:ndk/ndk.dart';
+import 'package:zap_stream_flutter/rx_filter.dart';
+import 'package:zap_stream_flutter/theme.dart';
+import 'package:zap_stream_flutter/utils.dart';
+
+class GoalWidget extends StatelessWidget {
+  final Nip01Event goal;
+
+  const GoalWidget({super.key, required this.goal});
+
+  static Widget id(String id) {
+    return RxFilter<Nip01Event>(
+      Key("stream:goal:$id"),
+      leaveOpen: false,
+      filters: [
+        Filter(kinds: [9041], ids: [id]),
+      ],
+      builder: (ctx, state) {
+        final goal = state?.firstOrNull;
+        return goal != null ? GoalWidget(goal: goal) : SizedBox.shrink();
+      },
+    );
+  }
+
+  @override
+  Widget build(BuildContext context) {
+    final max = int.parse(goal.getFirstTag("amount") ?? "1");
+    return Container(
+      padding: EdgeInsets.symmetric(horizontal: 4, vertical: 4),
+      child: RxFilter<Nip01Event>(
+        Key("goal:$id:zaps"),
+        filters: [
+          Filter(kinds: [9735], eTags: [goal.id]),
+        ],
+        builder: (ctx, state) {
+          final zaps = (state ?? []).map((e) => ZapReceipt.fromEvent(e));
+          final totalZaps =
+              zaps.fold(0, (acc, v) => acc + (v.amountSats ?? 0)) * 1000;
+          final progress = totalZaps / max;
+          final remaining = ((max - totalZaps).clamp(0, max) / 1000).toInt();
+
+          final q = MediaQuery.of(ctx);
+          return Column(
+            spacing: 4,
+            crossAxisAlignment: CrossAxisAlignment.start,
+            children: [
+              Row(
+                children: [
+                  Expanded(child: Text(goal.content)),
+                  if (remaining > 0)
+                    Text(
+                      "Remaining: ${formatSats(remaining)}",
+                      style: TextStyle(fontSize: 10, color: LAYER_5),
+                    ),
+                ],
+              ),
+              Stack(
+                children: [
+                  Container(
+                    height: 10,
+                    decoration: BoxDecoration(
+                      color: LAYER_2,
+                      borderRadius: DEFAULT_BR,
+                    ),
+                  ),
+                  Container(
+                    height: 10,
+                    width: (q.size.width * progress).clamp(1, q.size.width),
+                    decoration: BoxDecoration(
+                      color: ZAP_1,
+                      borderRadius: DEFAULT_BR,
+                    ),
+                  ),
+                  if (remaining > 0)
+                    Positioned(
+                      right: 2,
+                      child: Text(
+                        "Goal: ${formatSats((max / 1000).toInt())}",
+                        style: TextStyle(
+                          fontSize: 8,
+                          fontWeight: FontWeight.bold,
+                        ),
+                      ),
+                    ),
+                  if (remaining == 0)
+                    Center(
+                      child: Text(
+                        "COMPLETE",
+                        style: TextStyle(
+                          color: LAYER_0,
+                          fontSize: 8,
+                          fontWeight: FontWeight.bold,
+                        ),
+                      ),
+                    ),
+                ],
+              ),
+            ],
+          );
+        },
+      ),
+    );
+  }
+}

lib/widgets/mute_button.dart

@@ -39,7 +39,10 @@ class MuteButton extends StatelessWidget {
             ),
           ),
           padding: EdgeInsets.symmetric(vertical: 4, horizontal: 12),
-          decoration: BoxDecoration(color: WARNING, borderRadius: DEFAULT_BR),
+          decoration: BoxDecoration(
+            color: isMuted ? LAYER_2 : WARNING,
+            borderRadius: DEFAULT_BR,
+          ),
           onTap: () async {
             if (onTap != null) {
               onTap!();

lib/widgets/profile.dart

@@ -38,7 +38,7 @@ class ProfileNameWidget extends StatelessWidget {
     );
   }
 
-  static nameFromProfile(Metadata profile) {
+  static String nameFromProfile(Metadata profile) {
     if ((profile.displayName?.length ?? 0) > 0) {
       return profile.displayName!;
     }

lib/widgets/stream_cards.dart

@@ -0,0 +1,103 @@
+import 'package:cached_network_image/cached_network_image.dart';
+import 'package:flutter/material.dart';
+import 'package:flutter_markdown_plus/flutter_markdown_plus.dart';
+import 'package:flutter_svg/svg.dart';
+import 'package:ndk/ndk.dart';
+import 'package:url_launcher/url_launcher.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/nostr_text.dart';
+
+class StreamCardsWidget extends StatelessWidget {
+  final StreamEvent stream;
+
+  const StreamCardsWidget({super.key, required this.stream});
+
+  @override
+  Widget build(BuildContext context) {
+    return RxFilter<Nip01Event>(
+      Key("stream:cards:${stream.aTag}"),
+      filters: [
+        Filter(kinds: [17_777], authors: [stream.info.host], limit: 1),
+      ],
+      builder: (context, state) {
+        final cardList = state?.firstOrNull;
+        if (cardList == null) return SizedBox();
+
+        final cardIds = cardList.getTags("a");
+        return RxFilter<Nip01Event>(
+          Key("stream:cards:${stream.aTag}:cards"),
+          filters: [
+            Filter(
+              kinds: [37_777],
+              authors: [stream.info.host],
+              dTags: cardIds.map((i) => i.split(":").last).toList(),
+            ),
+          ],
+          builder: (context, state) {
+            final cards = state ?? [];
+
+            return Column(
+              spacing: 8,
+              children: cards.map((c) => _streamCard(context, c)).toList(),
+            );
+          },
+        );
+      },
+    );
+  }
+
+  Widget _streamCard(BuildContext context, Nip01Event card) {
+    final title = card.getFirstTag("title") ?? card.getFirstTag("subject");
+    final image = card.getFirstTag("image");
+    final link = card.getFirstTag("r");
+
+    return Container(
+      padding: EdgeInsets.all(8),
+      width: double.maxFinite,
+      decoration: BoxDecoration(color: LAYER_2, borderRadius: DEFAULT_BR),
+      child: Column(
+        spacing: 8,
+        crossAxisAlignment: CrossAxisAlignment.start,
+        children: [
+          if (title?.isNotEmpty ?? false)
+            Center(
+              child: Text(
+                title!,
+                style: TextStyle(fontSize: 20, fontWeight: FontWeight.bold),
+              ),
+            ),
+          if (image?.isNotEmpty ?? false)
+            Center(
+              child:
+                  link != null
+                      ? GestureDetector(
+                        onTap: () {
+                          launchUrl(Uri.parse(link));
+                        },
+                        child: CachedNetworkImage(
+                          imageUrl: proxyImg(context, image!),
+                          errorWidget:
+                              (_, _, _) => SvgPicture.asset(
+                                "assets/svg/logo.svg",
+                                height: 40,
+                              ),
+                        ),
+                      )
+                      : CachedNetworkImage(imageUrl: proxyImg(context, image!)),
+            ),
+          MarkdownBody(
+            data: card.content,
+            onTapLink: (text, href, title) {
+              if (href != null) {
+                launchUrl(Uri.parse(href));
+              }
+            },
+          ),
+        ],
+      ),
+    );
+  }
+}

lib/widgets/stream_grid.dart

@@ -24,6 +24,7 @@ class StreamGrid extends StatelessWidget {
     final streams =
         events
             .map((e) => StreamEvent(e))
+            .where((e) => e.info.stream?.contains(".m3u8") ?? false)
             .sortedBy((a) => a.info.starts ?? a.event.createdAt)
             .reversed;
     final live = streams.where((s) => s.info.status == StreamStatus.live);
@@ -32,11 +33,12 @@ class StreamGrid extends StatelessWidget {
     return Column(
       spacing: 16,
       children: [
-        if (showLive && live.isNotEmpty) _streamGroup(context, "Live", live),
+        if (showLive && live.isNotEmpty)
+          _streamGroup(context, "Live", live.toList()),
         if (showPlanned && planned.isNotEmpty)
-          _streamGroup(context, "Planned", planned),
+          _streamGroup(context, "Planned", planned.toList()),
         if (showEnded && ended.isNotEmpty)
-          _streamGroup(context, "Ended", ended),
+          _streamGroup(context, "Ended", ended.toList()),
       ],
     );
   }
@@ -64,22 +66,18 @@ class StreamGrid extends StatelessWidget {
   Widget _streamGroup(
     BuildContext context,
     String title,
-    Iterable<StreamEvent> events,
+    List<StreamEvent> events,
   ) {
-    final eventList = events.toList();
-
-    // profide fixed item size for performance
-    final q = MediaQuery.of(context);
     return Column(
       spacing: 16,
       children: [
         _streamTitle(title),
         ListView.builder(
-          itemCount: eventList.length,
+          itemCount: events.length,
           primary: false,
           shrinkWrap: true,
           itemBuilder: (ctx, idx) {
-            final stream = eventList[idx];
+            final stream = events[idx];
             return Padding(
               padding: EdgeInsets.symmetric(vertical: 8),
               child: StreamTileWidget(stream),

lib/widgets/stream_info.dart

@@ -0,0 +1,54 @@
+import 'package:flutter/material.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/profile.dart';
+import 'package:zap_stream_flutter/widgets/stream_cards.dart';
+
+class StreamInfoWidget extends StatelessWidget {
+  final StreamEvent stream;
+
+  const StreamInfoWidget({super.key, required this.stream});
+
+  @override
+  Widget build(BuildContext context) {
+    final startedDate =
+        stream.info.starts != null
+            ? DateTime.fromMillisecondsSinceEpoch(stream.info.starts! * 1000)
+            : null;
+    return Padding(
+      padding: EdgeInsets.all(10),
+      child: Column(
+        spacing: 8,
+        crossAxisAlignment: CrossAxisAlignment.start,
+        children: [
+          ProfileWidget.pubkey(stream.info.host),
+          FollowButton(
+            pubkey: stream.info.host,
+            onTap: () {
+              Navigator.pop(context);
+            },
+          ),
+          Text(
+            stream.info.title ?? "",
+            style: TextStyle(fontSize: 20, fontWeight: FontWeight.bold),
+          ),
+          if (startedDate != null)
+            RichText(
+              text: TextSpan(
+                style: TextStyle(color: LAYER_5, fontSize: 14),
+                children: [
+                  TextSpan(text: "Started "),
+                  TextSpan(text: DateFormat().format(startedDate)),
+                ],
+              ),
+            ),
+          if (stream.info.summary?.isNotEmpty ?? false)
+            Text(stream.info.summary!),
+          StreamCardsWidget(stream: stream),
+        ],
+      ),
+    );
+  }
+}

lib/widgets/stream_tile.dart

@@ -2,7 +2,6 @@ import 'package:cached_network_image/cached_network_image.dart';
 import 'package:flutter/material.dart';
 import 'package:flutter_svg/flutter_svg.dart';
 import 'package:go_router/go_router.dart';
-import 'package:ndk/shared/nips/nip19/nip19.dart';
 import 'package:zap_stream_flutter/imgproxy.dart';
 import 'package:zap_stream_flutter/theme.dart';
 import 'package:zap_stream_flutter/utils.dart';
@@ -19,10 +18,7 @@ class StreamTileWidget extends StatelessWidget {
   Widget build(BuildContext context) {
     return GestureDetector(
       onTap: () {
-        context.push(
+        context.push("/e/${stream.link}", extra: stream);
-          "/e/${Nip19.encodeNoteId(stream.event.id)}",
-          extra: stream,
-        );
       },
       child: Column(
         crossAxisAlignment: CrossAxisAlignment.start,

pubspec.lock

@@ -294,6 +294,14 @@ packages:
       url: "https://pub.dev"
     source: hosted
     version: "5.0.0"
+  flutter_markdown_plus:
+    dependency: "direct main"
+    description:
+      name: flutter_markdown_plus
+      sha256: fe74214c5ac2f850d93efda290dcde3f18006e90a87caa9e3e6c13222a5db4de
+      url: "https://pub.dev"
+    source: hosted
+    version: "1.0.3"
   flutter_plugin_android_lifecycle:
     dependency: transitive
     description:
@@ -544,6 +552,14 @@ packages:
       url: "https://pub.dev"
     source: hosted
     version: "1.3.0"
+  markdown:
+    dependency: transitive
+    description:
+      name: markdown
+      sha256: "935e23e1ff3bc02d390bad4d4be001208ee92cc217cb5b5a6c19bc14aaa318c1"
+      url: "https://pub.dev"
+    source: hosted
+    version: "7.3.0"
   matcher:
     dependency: transitive
     description:
@@ -1210,4 +1226,4 @@ packages:
     version: "1.2.0"
 sdks:
   dart: ">=3.7.2 <4.0.0"
-  flutter: ">=3.27.0"
+  flutter: ">=3.27.1"

pubspec.yaml

@@ -1,7 +1,7 @@
 name: zap_stream_flutter
 description: "zap.stream"
 publish_to: 'none'
-version: 0.3.0+5
+version: 0.4.0+6
 
 environment:
   sdk: ^3.7.2
@@ -32,6 +32,7 @@ dependencies:
   emoji_picker_flutter: ^4.3.0
   bech32: ^0.2.2
   intl: ^0.20.2
+  flutter_markdown_plus: ^1.0.3
 
 dependency_overrides:
   ndk: