Skip to content

Commit

Permalink
Update message_list.dart
Browse files Browse the repository at this point in the history
Add avatars to DM recipient headers.

Display user avatars alongside names in DM recipient headers, making conversations more visually identifiable. This matches the RN app's behavior

The changes:

- Add Avatar widgets in DM recipient headers
- Maintain consistent sizing and spacing (35px size, 8px right padding)
- Handle overflow gracefully for both avatars and names

Fixes #41
  • Loading branch information
shivanshsharma13 committed Dec 1, 2024
1 parent 347e19e commit 3b20b77
Showing 1 changed file with 17 additions and 2 deletions.
19 changes: 17 additions & 2 deletions lib/widgets/message_list.dart
Original file line number Diff line number Diff line change
Expand Up @@ -361,8 +361,23 @@ class MessageListAppBarTitle extends StatelessWidget {
if (otherRecipientIds.isEmpty) {
return const Text("DMs with yourself");
} else {
final names = otherRecipientIds.map((id) => store.users[id]?.fullName ?? '(unknown user)');
return Text("DMs with ${names.join(", ")}"); // TODO show avatars
return Row(
children: [
...otherRecipientIds.map((id) =>
Padding(
padding: const EdgeInsets.only(right: 8),
child: Avatar(size: 35, borderRadius: 32 / 8, userId: id),
)),
Expanded(
child: Text(
otherRecipientIds
.map((id) => store.users[id]?.fullName ?? '(unknown user)')
.join(", "),
overflow: TextOverflow.ellipsis,
),
)
]
);
}
}
}
Expand Down

0 comments on commit 3b20b77

Please sign in to comment.