mirror of
https://github.com/block/buzz.git
synced 2026-08-18 06:50:31 +02:00
## Summary
- add poster-first, tap-to-toggle animated avatars on profile surfaces
while preserving transparent/static behavior elsewhere
- align mobile DM headers, membership actions, and invisible agent
recipient addressing with established desktop semantics
- polish titled sheets and status editing, preserve native iOS sheet
corners, and batch relay reads to improve review-build responsiveness
## Snapshots
<table>
<tr>
<th>Profile avatar</th>
<th>Agent DM header and composer</th>
</tr>
<tr>
<td><img
src="https://raw.githubusercontent.com/block/buzz/e8de7495451dbe1a393ab43c5e204ca7425f2ba5/pr-5401--profile-avatar.png"
width="360" alt="Mobile profile settings with animated avatar
surface"></td>
<td><img
src="https://raw.githubusercontent.com/block/buzz/e8de7495451dbe1a393ab43c5e204ca7425f2ba5/pr-5401--agent-dm.png"
width="360" alt="Agent direct message with masked presence and normal
composer"></td>
</tr>
<tr>
<th>Members sheet</th>
<th>Status editor</th>
</tr>
<tr>
<td><img
src="https://raw.githubusercontent.com/block/buzz/e8de7495451dbe1a393ab43c5e204ca7425f2ba5/pr-5401--members-sheet.png"
width="360" alt="Members bottom sheet with centered title and padded
content"></td>
<td><img
src="https://raw.githubusercontent.com/block/buzz/e8de7495451dbe1a393ab43c5e204ca7425f2ba5/pr-5401--status-sheet.png"
width="360" alt="Status editor bottom sheet with duration and quick
statuses"></td>
</tr>
<tr>
<th colspan="2">Switch Community</th>
</tr>
<tr>
<td colspan="2" align="center"><img
src="https://raw.githubusercontent.com/block/buzz/e8de7495451dbe1a393ab43c5e204ca7425f2ba5/pr-5401--switch-community.png"
width="720" alt="Switch Community bottom sheet with centered title and
aligned Edit action"></td>
</tr>
</table>
## Validation
- `just mobile-check`
- `just mobile-test` (1,283 tests)
- installed and reviewed isolated debug builds on iPhone and Pixel
---------
Signed-off-by: kenny lopez <klopez4212@gmail.com>
Signed-off-by: Princess Donut <b238ea756dee4d98afa5883fc7f1de61eeabe65bf700e3a5a5a80db5e42e2c2b@buzz.block.builderlab.xyz>
Signed-off-by: Kenny Lopez <klopez4212@gmail.com>
Signed-off-by: Wes <wesbillman@users.noreply.github.com>
Co-authored-by: Princess Donut <b238ea756dee4d98afa5883fc7f1de61eeabe65bf700e3a5a5a80db5e42e2c2b@buzz.block.builderlab.xyz>
Co-authored-by: Wes <wesbillman@users.noreply.github.com>
Co-authored-by: Carl <c7ebe626f000404285d3686e1dc74cc07cc60a9754a150041ba132e14bd3e2ec@buzz.block.builderlab.xyz>
295 lines
9.0 KiB
Dart
295 lines
9.0 KiB
Dart
import 'dart:async';
|
|
import 'dart:convert';
|
|
|
|
import 'package:buzz/features/profile/profile_provider.dart';
|
|
import 'package:buzz/features/profile/settings_profile_header.dart';
|
|
import 'package:buzz/features/profile/user_profile.dart';
|
|
import 'package:buzz/features/profile/user_status.dart';
|
|
import 'package:buzz/features/profile/user_status_provider.dart';
|
|
import 'package:buzz/shared/custom_emoji/custom_emoji_provider.dart';
|
|
import 'package:buzz/shared/relay/media_auth.dart';
|
|
import 'package:buzz/shared/relay/media_image.dart';
|
|
import 'package:buzz/shared/theme/theme.dart';
|
|
import 'package:buzz/shared/widgets/masked_avatar_badge.dart';
|
|
import 'package:flutter/material.dart';
|
|
import 'package:flutter_test/flutter_test.dart';
|
|
import 'package:http/http.dart' as http;
|
|
import 'package:http/testing.dart' as http_testing;
|
|
import 'package:lucide_icons_flutter/lucide_icons.dart';
|
|
|
|
import '../../helpers/widget_helpers.dart';
|
|
|
|
void main() {
|
|
testWidgets('shows the poster until the animated avatar is ready', (
|
|
tester,
|
|
) async {
|
|
const posterUrl = 'https://relay.example/media/poster.png';
|
|
const animationUrl = 'https://relay.example/media/animation.png';
|
|
final profileUrl =
|
|
'$posterUrl#buzz-anim=${Uri.encodeComponent(animationUrl)}';
|
|
final animationResponse = Completer<http.Response>();
|
|
final client = http_testing.MockClient(
|
|
(request) => request.url.toString() == animationUrl
|
|
? animationResponse.future
|
|
: Future.value(http.Response.bytes(_transparentPng, 200)),
|
|
);
|
|
addTearDown(client.close);
|
|
|
|
await tester.pumpWidget(
|
|
WidgetHelpers.testable(
|
|
overrides: [
|
|
profileProvider.overrideWith(
|
|
() => _FakeProfileNotifier(avatarUrl: profileUrl),
|
|
),
|
|
presenceProvider.overrideWith(() => _FakePresenceNotifier('online')),
|
|
userStatusProvider.overrideWith(() => _FakeUserStatusNotifier(null)),
|
|
customEmojiListProvider.overrideWithValue(const []),
|
|
mediaGetAuthServiceProvider.overrideWithValue(
|
|
MediaGetAuthService(baseUrl: 'https://relay.example', nsec: null),
|
|
),
|
|
mediaHttpClientProvider.overrideWithValue(client),
|
|
],
|
|
child: const SettingsProfileHeader(),
|
|
),
|
|
);
|
|
await tester.pump();
|
|
await tester.pump();
|
|
|
|
expect(
|
|
find.byKey(const ValueKey('progressive-animated-avatar-poster')),
|
|
findsOneWidget,
|
|
);
|
|
expect(
|
|
tester
|
|
.widget<ColoredBox>(
|
|
find.byKey(const ValueKey('settings-profile-avatar-background')),
|
|
)
|
|
.color,
|
|
Colors.transparent,
|
|
);
|
|
expect(
|
|
find.byKey(
|
|
const ValueKey('progressive-animated-avatar-animation-loading'),
|
|
),
|
|
findsOneWidget,
|
|
);
|
|
expect(
|
|
tester
|
|
.widgetList<MediaImage>(find.byType(MediaImage, skipOffstage: false))
|
|
.map((image) => image.url),
|
|
containsAll([posterUrl, animationUrl]),
|
|
);
|
|
|
|
animationResponse.complete(http.Response.bytes(_transparentPng, 200));
|
|
await tester.runAsync(
|
|
() => Future<void>.delayed(const Duration(milliseconds: 50)),
|
|
);
|
|
await tester.pumpAndSettle();
|
|
|
|
expect(
|
|
find.byKey(const ValueKey('progressive-animated-avatar-animation-ready')),
|
|
findsOneWidget,
|
|
);
|
|
expect(
|
|
find.byKey(const ValueKey('progressive-animated-avatar-poster')),
|
|
findsNothing,
|
|
);
|
|
expect(
|
|
tester
|
|
.widgetList<MediaImage>(find.byType(MediaImage))
|
|
.map((image) => image.url),
|
|
[animationUrl],
|
|
);
|
|
|
|
await tester.tap(find.byKey(const ValueKey('settings-profile-avatar')));
|
|
await tester.pumpAndSettle();
|
|
|
|
expect(
|
|
find.byKey(const ValueKey('progressive-animated-avatar-animation')),
|
|
findsNothing,
|
|
);
|
|
expect(tester.widget<MediaImage>(find.byType(MediaImage)).url, posterUrl);
|
|
|
|
await tester.tap(find.byKey(const ValueKey('settings-profile-avatar')));
|
|
await tester.pumpAndSettle();
|
|
|
|
expect(
|
|
find.byKey(const ValueKey('progressive-animated-avatar-animation')),
|
|
findsOneWidget,
|
|
);
|
|
expect(
|
|
find.byKey(const ValueKey('progressive-animated-avatar-poster')),
|
|
findsNothing,
|
|
);
|
|
});
|
|
|
|
testWidgets('uses a bounded icon for an unresolved status shortcode', (
|
|
tester,
|
|
) async {
|
|
const missingShortcode = ':very_long_missing_custom_emoji:';
|
|
await tester.pumpWidget(
|
|
WidgetHelpers.testable(
|
|
overrides: [
|
|
profileProvider.overrideWith(_FakeProfileNotifier.new),
|
|
presenceProvider.overrideWith(() => _FakePresenceNotifier('online')),
|
|
userStatusProvider.overrideWith(
|
|
() => _FakeUserStatusNotifier(
|
|
const UserStatus(
|
|
text: 'Focusing',
|
|
emoji: missingShortcode,
|
|
updatedAt: 1,
|
|
),
|
|
),
|
|
),
|
|
customEmojiListProvider.overrideWithValue(const []),
|
|
],
|
|
child: const SettingsProfileHeader(),
|
|
),
|
|
);
|
|
await tester.pumpAndSettle();
|
|
|
|
expect(find.byType(Hero), findsNothing);
|
|
final badge = find.byType(MaskedAvatarBadge);
|
|
expect(
|
|
find.descendant(of: badge, matching: find.text(missingShortcode)),
|
|
findsNothing,
|
|
);
|
|
expect(
|
|
find.descendant(of: badge, matching: find.byIcon(LucideIcons.smile)),
|
|
findsOneWidget,
|
|
);
|
|
});
|
|
|
|
testWidgets(
|
|
'keeps text-only status visible beside a changeable presence pill',
|
|
(tester) async {
|
|
final presenceNotifier = _FakePresenceNotifier('away');
|
|
await tester.pumpWidget(
|
|
WidgetHelpers.testable(
|
|
overrides: [
|
|
profileProvider.overrideWith(_FakeProfileNotifier.new),
|
|
presenceProvider.overrideWith(() => presenceNotifier),
|
|
userStatusProvider.overrideWith(
|
|
() => _FakeUserStatusNotifier(
|
|
const UserStatus(text: 'Focusing', emoji: '', updatedAt: 1),
|
|
),
|
|
),
|
|
customEmojiListProvider.overrideWithValue(const []),
|
|
],
|
|
child: const SettingsProfileHeader(),
|
|
),
|
|
);
|
|
await tester.pumpAndSettle();
|
|
|
|
expect(find.text('Focusing'), findsOneWidget);
|
|
await tester.tap(find.text('Focusing'));
|
|
await tester.pumpAndSettle();
|
|
expect(find.text('Set a status'), findsOneWidget);
|
|
expect(
|
|
tester.widget<TextField>(find.byType(TextField)).controller?.text,
|
|
'Focusing',
|
|
);
|
|
await tester.binding.handlePopRoute();
|
|
await tester.pumpAndSettle();
|
|
|
|
expect(
|
|
find.byKey(const ValueKey('settings-presence-label')),
|
|
findsOneWidget,
|
|
);
|
|
expect(find.text('Away'), findsOneWidget);
|
|
expect(
|
|
tester
|
|
.widget<Text>(find.byKey(const ValueKey('settings-presence-label')))
|
|
.style
|
|
?.fontSize,
|
|
filterChipTextStyle.fontSize,
|
|
);
|
|
expect(
|
|
tester
|
|
.getSize(find.byKey(const ValueKey('settings-presence-target')))
|
|
.height,
|
|
48,
|
|
);
|
|
expect(
|
|
tester
|
|
.getSize(find.byKey(const ValueKey('settings-presence-pill')))
|
|
.height,
|
|
greaterThanOrEqualTo(31),
|
|
);
|
|
|
|
final presenceTarget = find.byKey(
|
|
const ValueKey('settings-presence-target'),
|
|
);
|
|
final targetRect = tester.getRect(presenceTarget);
|
|
await tester.tapAt(Offset(targetRect.center.dx, targetRect.bottom - 1));
|
|
await tester.pump();
|
|
|
|
final scale = tester.widget<ScaleTransition>(
|
|
find.byKey(const ValueKey('activity-popover-scale')),
|
|
);
|
|
expect(scale.alignment, Alignment.topCenter);
|
|
expect(
|
|
find.byKey(const ValueKey('settings-presence-popover')),
|
|
findsOneWidget,
|
|
);
|
|
await tester.pumpAndSettle();
|
|
|
|
expect(
|
|
find.byKey(const ValueKey('settings-presence-online')),
|
|
findsOneWidget,
|
|
);
|
|
expect(
|
|
find.byKey(const ValueKey('settings-presence-away')),
|
|
findsOneWidget,
|
|
);
|
|
expect(
|
|
find.byKey(const ValueKey('settings-presence-offline')),
|
|
findsOneWidget,
|
|
);
|
|
|
|
await tester.tap(find.byKey(const ValueKey('settings-presence-offline')));
|
|
await tester.pumpAndSettle();
|
|
expect(presenceNotifier.selected, ['offline']);
|
|
},
|
|
);
|
|
}
|
|
|
|
class _FakeProfileNotifier extends ProfileNotifier {
|
|
_FakeProfileNotifier({this.avatarUrl});
|
|
|
|
final String? avatarUrl;
|
|
|
|
@override
|
|
Future<UserProfile?> build() async =>
|
|
UserProfile(pubkey: 'aabb', displayName: 'Test', avatarUrl: avatarUrl);
|
|
}
|
|
|
|
class _FakeUserStatusNotifier extends UserStatusNotifier {
|
|
_FakeUserStatusNotifier(this._status);
|
|
|
|
final UserStatus? _status;
|
|
|
|
@override
|
|
Future<UserStatus?> build() async => _status;
|
|
}
|
|
|
|
class _FakePresenceNotifier extends PresenceNotifier {
|
|
_FakePresenceNotifier(this._presence);
|
|
|
|
final String _presence;
|
|
final List<String> selected = [];
|
|
|
|
@override
|
|
Future<String> build() async => _presence;
|
|
|
|
@override
|
|
Future<void> setPresence(String status) async {
|
|
selected.add(status);
|
|
}
|
|
}
|
|
|
|
final _transparentPng = base64Decode(
|
|
'iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAQAAAC1HAwCAAAAC0lEQVR42mNkYAAA'
|
|
'AAYAAjCB0C8AAAAASUVORK5CYII=',
|
|
);
|