From f746e06f658adb22b115e4e2f5499213b50f460c Mon Sep 17 00:00:00 2001
From: LittleSheep <littlesheep.code@hotmail.com>
Date: Wed, 26 Feb 2025 00:25:42 +0800
Subject: [PATCH] :alembic: Experimental user first badge showing on chat

---
 lib/widgets/account/account_image.dart | 52 ++++++++++++++++----------
 lib/widgets/chat/chat_message.dart     | 17 +++++++++
 2 files changed, 49 insertions(+), 20 deletions(-)

diff --git a/lib/widgets/account/account_image.dart b/lib/widgets/account/account_image.dart
index 5b1c948..c9f989b 100644
--- a/lib/widgets/account/account_image.dart
+++ b/lib/widgets/account/account_image.dart
@@ -10,6 +10,7 @@ class AccountImage extends StatelessWidget {
   final Color? foregroundColor;
   final double? radius;
   final Widget? fallbackWidget;
+  final Widget? badge;
 
   const AccountImage({
     super.key,
@@ -18,6 +19,7 @@ class AccountImage extends StatelessWidget {
     this.foregroundColor,
     this.radius,
     this.fallbackWidget,
+    this.badge,
   });
 
   @override
@@ -26,26 +28,36 @@ class AccountImage extends StatelessWidget {
     final url = sn.getAttachmentUrl(content ?? '');
 
     final devicePixelRatio = MediaQuery.of(context).devicePixelRatio;
-    return CircleAvatar(
-      key: Key('attachment-${content.hashCode}'),
-      radius: radius,
-      backgroundColor: backgroundColor,
-      backgroundImage: (content?.isNotEmpty ?? false)
-          ? ResizeImage(
-              UniversalImage.provider(url),
-              width: ((radius ?? 20) * devicePixelRatio * 2).round(),
-              height: ((radius ?? 20) * devicePixelRatio * 2).round(),
-              policy: ResizeImagePolicy.fit,
-            )
-          : null,
-      child: (content?.isEmpty ?? true)
-          ? (fallbackWidget ??
-              Icon(
-                Symbols.account_circle,
-                size: radius != null ? radius! * 1.2 : 24,
-                color: foregroundColor,
-              ))
-          : null,
+    return Stack(
+      children: [
+        CircleAvatar(
+          key: Key('attachment-${content.hashCode}'),
+          radius: radius,
+          backgroundColor: backgroundColor,
+          backgroundImage: (content?.isNotEmpty ?? false)
+              ? ResizeImage(
+                  UniversalImage.provider(url),
+                  width: ((radius ?? 20) * devicePixelRatio * 2).round(),
+                  height: ((radius ?? 20) * devicePixelRatio * 2).round(),
+                  policy: ResizeImagePolicy.fit,
+                )
+              : null,
+          child: (content?.isEmpty ?? true)
+              ? (fallbackWidget ??
+                  Icon(
+                    Symbols.account_circle,
+                    size: radius != null ? radius! * 1.2 : 24,
+                    color: foregroundColor,
+                  ))
+              : null,
+        ),
+        if (badge != null)
+          Positioned(
+            right: -4,
+            bottom: -4,
+            child: badge!,
+          ),
+      ],
     );
   }
 }
diff --git a/lib/widgets/chat/chat_message.dart b/lib/widgets/chat/chat_message.dart
index 58fc431..2653461 100644
--- a/lib/widgets/chat/chat_message.dart
+++ b/lib/widgets/chat/chat_message.dart
@@ -11,6 +11,7 @@ import 'package:styled_widget/styled_widget.dart';
 import 'package:surface/providers/config.dart';
 import 'package:surface/providers/user_directory.dart';
 import 'package:surface/providers/userinfo.dart';
+import 'package:surface/screens/account/profile_page.dart';
 import 'package:surface/types/chat.dart';
 import 'package:surface/widgets/account/account_image.dart';
 import 'package:surface/widgets/account/account_popover.dart';
@@ -105,6 +106,22 @@ class ChatMessage extends StatelessWidget {
                     GestureDetector(
                       child: AccountImage(
                         content: user?.avatar,
+                        badge: (user?.badges.isNotEmpty ?? false)
+                            ? Icon(
+                                kBadgesMeta[user!.badges.first.type]?.$2 ??
+                                    Symbols.question_mark,
+                                color: kBadgesMeta[user!.badges.first.type]?.$3,
+                                fill: 1,
+                                size: 18,
+                                shadows: [
+                                  Shadow(
+                                    offset: Offset(1, 1),
+                                    blurRadius: 5.0,
+                                    color: Color.fromARGB(150, 0, 0, 0),
+                                  ),
+                                ],
+                              )
+                            : null,
                       ),
                       onTap: () {
                         if (user == null) return;