Make displayname colors based off of power level

Fixes #128

lib/helpers/extensions/displayname_color.dart

@@ -0,0 +1,13 @@
+import "package:flutter_riverpod/flutter_riverpod.dart";
+import "package:material_ui/material_ui.dart";
+import "package:nexus/controllers/room_power_levels.dart";
+import "package:nexus/helpers/extensions/string_to_color.dart";
+
+extension DisplaynameColor on WidgetRef {
+  /// The color of [userId]'s name in [roomId], hashed from their power level,
+  /// so everyone with the same level shares one.
+  Color displaynameColor(String roomId, String userId) => watch(
+    RoomPowerLevelsController.provider(roomId)
+        .select((levels) => levels.levelOf(userId)),
+  ).toString().colorHash;
+}

lib/widgets/lazy_loading/message_displayname.dart

@@ -3,7 +3,7 @@ import "package:flutter_riverpod/flutter_riverpod.dart";
 import "package:nexus/controllers/author.dart";
 import "package:nexus/helpers/extensions/get_localpart.dart";
 import "package:nexus/helpers/extensions/show_user_popover.dart";
-import "package:nexus/helpers/extensions/string_to_color.dart";
+import "package:nexus/helpers/extensions/displayname_color.dart";
 import "package:nexus/models/event.dart";
 import "package:nexus/models/content/membership.dart";
 
@@ -15,9 +15,10 @@ class const MessageDisplayname(
   super.key,
 }) extends ConsumerWidget {
   @override
-  Widget build(BuildContext context, WidgetRef ref) => switch (ref.watch(
+  Widget build(BuildContext context, WidgetRef ref) {
-    AuthorController.provider(event),
+    final color = ref.displaynameColor(event.roomId, event.sender);
-  )) {
+
+    return switch (ref.watch(AuthorController.provider(event))) {
       AsyncData(:final MembershipContent? value) ||
       AsyncLoading(:final value) ||
       AsyncError(:final value) => InkWell(
@@ -27,8 +28,7 @@ class const MessageDisplayname(
         child: switch ([
           Text(
             value?.displayName ?? event.sender.localpart,
-          style:
+            style: style ?? .new(color: color, fontWeight: .bold),
-              style ?? .new(color: event.sender.colorHash, fontWeight: .bold),
             maxLines: 1,
             overflow: .ellipsis,
           ),
@@ -36,7 +36,7 @@ class const MessageDisplayname(
             Text(
               "(via ${event.sender})",
               style: Theme.of(context).textTheme.labelSmall
-                ?.copyWith(color: event.sender.colorHash, fontWeight: .bold),
+                  ?.copyWith(color: color, fontWeight: .bold),
               maxLines: 1,
               overflow: .ellipsis,
             ),
@@ -54,4 +54,5 @@ class const MessageDisplayname(
         },
       ),
     };
+  }
 }

lib/widgets/member_list.dart

@@ -8,7 +8,7 @@ import "package:nexus/controllers/members_by_status.dart";
 import "package:nexus/controllers/members_grouped.dart";
 import "package:nexus/helpers/extensions/get_localpart.dart";
 import "package:nexus/helpers/extensions/show_user_popover.dart";
-import "package:nexus/helpers/extensions/string_to_color.dart";
+import "package:nexus/helpers/extensions/displayname_color.dart";
 import "package:nexus/models/content/membership.dart";
 import "package:nexus/models/membership_status.dart";
 import "package:nexus/widgets/avatar_or_hash.dart";
@@ -108,8 +108,9 @@ class const MemberList(final String roomId, {super.key})
                                         :final avatarUrl,
                                         :final displayName,
                                       ) =>
-                                        Builder(
+                                        Consumer(
-                                          builder: (context) => ListTile(
+                                          builder: (context, ref, _) =>
+                                              ListTile(
                                                 onTap: () =>
                                                     context.showUserPopover(
                                                       members[index].stateKey!,
@@ -122,9 +123,10 @@ class const MemberList(final String roomId, {super.key})
                                                           .localpart,
                                                   overflow: .ellipsis,
                                                   style: .new(
-                                                color: members[index]
+                                                    color: ref.displaynameColor(
-                                                    .stateKey!
+                                                      roomId,
-                                                    .colorHash,
+                                                      members[index].stateKey!,
+                                                    ),
                                                     fontWeight: .bold,
                                                   ),
                                                 ),

lib/widgets/renderers/membership.dart

@@ -1,7 +1,8 @@
 import "package:material_ui/material_ui.dart";
 import "package:nexus/helpers/extensions/get_localpart.dart";
 import "package:nexus/helpers/extensions/show_user_popover.dart";
-import "package:nexus/helpers/extensions/string_to_color.dart";
+import "package:flutter_riverpod/flutter_riverpod.dart";
+import "package:nexus/helpers/extensions/displayname_color.dart";
 import "package:nexus/models/content/membership.dart";
 import "package:nexus/models/event.dart";
 import "package:nexus/widgets/lazy_loading/message_displayname.dart";
@@ -11,9 +12,9 @@ class const MembershipRenderer(
   final Event event, {
   final int? maxLines,
   super.key,
-}) extends StatelessWidget {
+}) extends ConsumerWidget {
   @override
-  Widget build(BuildContext context) {
+  Widget build(BuildContext context, WidgetRef ref) {
     assert(
       event.content is MembershipContent,
       "Make sure to only pass membership events to MembershipRenderer",
@@ -40,7 +41,10 @@ class const MembershipRenderer(
                 overflow: .ellipsis,
                 content.displayName ?? event.stateKey!.localpart,
                 maxLines: 1,
-                style: .new(color: event.sender.colorHash, fontWeight: .bold),
+                style: .new(
+                  color: ref.displaynameColor(event.roomId, event.stateKey!),
+                  fontWeight: .bold,
+                ),
               ),
             ),
           ),