🐛 Fixes

lib/widgets/app_notification.dart

@@ -11,6 +11,7 @@ import 'package:freezed_annotation/freezed_annotation.dart';
 import 'package:hooks_riverpod/hooks_riverpod.dart';
 import 'package:island/models/user.dart';
 import 'package:island/pods/websocket.dart';
+import 'package:island/widgets/content/cloud_files.dart';
 import 'package:material_symbols_icons/material_symbols_icons.dart';
 import 'package:riverpod_annotation/riverpod_annotation.dart';
 import 'package:styled_widget/styled_widget.dart';
@@ -25,12 +26,6 @@ class AppNotificationToast extends HookConsumerWidget {
   @override
   Widget build(BuildContext context, WidgetRef ref) {
     final notifications = ref.watch(appNotificationsProvider);
-    final isDesktop =
-        !kIsWeb && (Platform.isMacOS || Platform.isWindows || Platform.isLinux);
-
-    // Calculate position based on device type
-    final safeAreaTop = MediaQuery.of(context).padding.top;
-    final notificationTop = safeAreaTop + (isDesktop ? 30 : 10);
 
     // Create a global key for AnimatedList
     final listKey = useMemoized(() => GlobalKey<AnimatedListState>());
@@ -69,43 +64,11 @@ class AppNotificationToast extends HookConsumerWidget {
     }, [notifications]);
 
     return Positioned(
-      top: notificationTop,
+      top: MediaQuery.of(context).padding.top + 50,
       left: 16,
       right: 16,
-      bottom: 16, // Add bottom constraint to make it take full height
+      child: SizedBox(
-      child: Column(
+        height: notifications.length * 80,
-        children: [
-          // Test button for development
-          if (kDebugMode)
-            ElevatedButton(
-              onPressed: () {
-                ref
-                    .read(appNotificationsProvider.notifier)
-                    .addNotification(
-                      AppNotification(
-                        data: SnNotification(
-                          createdAt: DateTime.now(),
-                          updatedAt: DateTime.now(),
-                          deletedAt: null,
-                          id:
-                              'test-notification-${DateTime.now().millisecondsSinceEpoch}',
-                          topic: 'test',
-                          title: 'Test Notification',
-                          content: 'This is a test notification content',
-                          priority: 1,
-                          viewedAt: null,
-                          accountId: 'test-account-123',
-                        ),
-                        icon: Symbols.info,
-                        createdAt: DateTime.now(),
-                        duration: const Duration(seconds: 5),
-                      ),
-                    );
-              },
-              child: Text('test notification'),
-            ),
-          // Use AnimatedList for notifications with Expanded to take full height
-          Expanded(
         child: AnimatedList(
           physics: NeverScrollableScrollPhysics(),
           padding: EdgeInsets.zero,
@@ -126,8 +89,10 @@ class AppNotificationToast extends HookConsumerWidget {
             final remainingTime = duration - elapsedTime;
             final progress =
                 1.0 -
-                    (remainingTime.inMilliseconds / duration.inMilliseconds)
+                (remainingTime.inMilliseconds / duration.inMilliseconds).clamp(
-                        .clamp(0.0, 1.0); // Ensure progress is clamped
+                  0.0,
+                  1.0,
+                ); // Ensure progress is clamped
 
             return SizeTransition(
               sizeFactor: animation.drive(
@@ -152,9 +117,7 @@ class AppNotificationToast extends HookConsumerWidget {
                         currentIndex,
                         (context, animation) => SizeTransition(
                           sizeFactor: animation.drive(
-                                CurveTween(
+                            CurveTween(curve: Curves.fastLinearToSlowEaseIn),
-                                  curve: Curves.fastLinearToSlowEaseIn,
-                                ),
                           ),
                           child: _NotificationCard(
                             notification: notification,
@@ -183,8 +146,6 @@ class AppNotificationToast extends HookConsumerWidget {
           },
         ),
       ),
-        ],
-      ),
     );
   }
 }
@@ -235,7 +196,9 @@ class _NotificationCard extends HookConsumerWidget {
     return Card(
       elevation: 4,
       margin: const EdgeInsets.only(bottom: 8),
-      shape: RoundedRectangleBorder(borderRadius: BorderRadius.circular(12)),
+      shape: RoundedRectangleBorder(
+        borderRadius: BorderRadius.vertical(bottom: Radius.circular(8)),
+      ),
       child: InkWell(
         borderRadius: const BorderRadius.all(Radius.circular(8)),
         onTap: () {
@@ -265,9 +228,7 @@ class _NotificationCard extends HookConsumerWidget {
                     ),
                     value: 1.0 - progressState.value,
                     backgroundColor: Colors.transparent,
-                    color: Theme.of(
+                    color: Theme.of(context).colorScheme.secondary,
-                      context,
-                    ).colorScheme.primary.withOpacity(0.5),
                     minHeight: 3,
                     stopIndicatorColor: Colors.transparent,
                     stopIndicatorRadius: 0,
@@ -279,7 +240,12 @@ class _NotificationCard extends HookConsumerWidget {
               child: Row(
                 crossAxisAlignment: CrossAxisAlignment.start,
                 children: [
-                  if (notification.icon != null)
+                  if (notification.data.meta['avatar'] != null)
+                    ProfilePictureWidget(
+                      fileId: notification.data.meta['avatar'],
+                      radius: 12,
+                    ).padding(right: 12, top: 2)
+                  else if (notification.icon != null)
                     Icon(
                       notification.icon,
                       color: Theme.of(context).colorScheme.primary,
@@ -298,12 +264,12 @@ class _NotificationCard extends HookConsumerWidget {
                           Text(
                             notification.data.content,
                             style: Theme.of(context).textTheme.bodyMedium,
-                          ).padding(top: 4),
+                          ),
                         if (notification.data.subtitle.isNotEmpty)
                           Text(
                             notification.data.subtitle,
                             style: Theme.of(context).textTheme.bodySmall,
-                          ).padding(top: 2),
+                          ),
                       ],
                     ),
                   ),