Files
buzz/mobile/lib/shared/widgets/ios_message_create_button.dart
klopez4212 39b8b2b6a6 feat(mobile): unify Messages navigation with Solo and Team filters (#8649)
## Summary

Unify mobile conversations in Messages with All / Solo / Team filters, a
collapsing header, and separate Search, New, and default-agent
shortcuts. Move workspace actions into the community menu and keep
collapsed sections intact across filters.

Align Inbox and list typography, spacing, and muted controls. Preserve
native glass layering through navigation and give every filtered list
enough clearance above the footer. The default-agent shortcut reads the
shared encrypted preference and opens an existing chat immediately. When
unset, it opens Agents; a star action selects the default through a
production signed, self-encrypted preference writer. Save failures
remain visible and retryable.

Android now uses rounded navigation controls and filters, optically
balanced search icons, and expanding New/community menus with leading
Tabler icons matching iOS. Preset avatars retain transparent WebM
animation through an Android WebView renderer, with lifecycle pausing
and poster fallback.

### Related issue

None found in searches for mobile navigation issues and open PRs.

### Testing

- Android follow-up: ARM64 debug build, Dart analysis, and emulator
checks passed for menu placement, selection, icon alignment, search, and
avatar playback/pause/resume. The avatar implementation passed 3,840
Flutter tests and native Android tests before subsequent styling
iterations. Automated tests for the later menu/icon iterations were
skipped at the author’s request; those earlier results do not cover the
final styling changes.

- Mobile formatting/analysis and full test suite (3,838 passed, 23
skipped, plus 4 push-configuration tests); regression journey covers
filtering, collapse retention, and scrolling the last Solo row above the
footer.
- iPhone 18 Pro simulator (Honeycomb): filters, menus, Inbox,
Invite/Back, Switch Community, and default-agent chat/Back exercised.
iOS release build and Pairing Preview install/launch passed during
iteration, preserving the saved profile.
- P1 follow-up: production writer-to-reader widget journey covers
selection, publish failure/retry, and the unset footer opening Agents.
Simulator Agents open/close passes; its saved community has no
selectable agents, so live selection was not verified there.
- Independent agent review completed; its Solo footer-clearance finding
is fixed. The final clearance adjustment is covered by widget tests;
physical-device acceptance of that adjustment and hosted CI remain
pending.

Final Messages layout:

![Messages with All, Solo and Team filters and separate bottom
shortcuts](https://github.com/user-attachments/assets/562ddc3e-945b-4945-bd58-217a2c62b570)

Switcher layering during iteration (before → after):

| Before: filter edge showing through | After: Home hidden behind
switcher |
| --- | --- |
| ![Filter edge visible beside Switch
Community](https://github.com/user-attachments/assets/b32a0157-8b17-4f01-9a23-29b12ce3b1af)
| ![Clean Switch Community
screen](https://github.com/user-attachments/assets/222956e4-9989-4c8f-a162-65de45029845)
|

---------

Signed-off-by: kenny lopez <klopez4212@gmail.com>
Co-authored-by: Terp <5856f6900e8e0a4e0ea1f4f8d2ee33e4753d2119bc122f94ecafc660b46c0511@buzz.block.builderlab.xyz>
2026-10-29 14:27:22 +00:00

160 lines
4.8 KiB
Dart

import 'dart:async';
import 'package:flutter/material.dart';
import 'package:flutter/foundation.dart';
import 'package:flutter/gestures.dart';
import 'package:flutter/services.dart';
import 'package:flutter_hooks/flutter_hooks.dart';
import '../theme/theme.dart';
import 'avatar_image.dart';
/// The four desktop creation destinations, presented by UIKit on iOS.
class IosMessageCreateButton extends HookWidget {
const IosMessageCreateButton({
super.key,
required this.actions,
this.label,
this.avatarUrl,
this.avatarInitial,
this.dividerBefore = const {},
this.icon = 'plus',
this.accessibilityLabel = 'Create',
this.width = 64,
this.height = 48,
this.plain = true,
this.showIconWithLabel = false,
});
final Set<int> dividerBefore;
final String? label;
final String? avatarUrl, avatarInitial;
final String icon;
final String accessibilityLabel;
final double width, height;
final bool plain;
final bool showIconWithLabel;
final List<({String label, String symbol, VoidCallback? onPressed})> actions;
@override
Widget build(BuildContext context) {
final route = ModalRoute.of(context);
final coveringProgress = useAnimation(
route?.secondaryAnimation ?? kAlwaysDismissedAnimation,
);
final nativeControlsVisible =
(route?.isCurrent ?? true) && coveringProgress == 0;
final brightness = context.theme.brightness;
final foreground = context.colors.onSurface.toARGB32();
final avatarFuture = useMemoized(
() => avatarInitial == null
? null
: nativeAvatarImage(
url: avatarUrl,
initial: avatarInitial!,
circular: true,
background: context.colors.primaryContainer,
foreground: context.colors.onPrimaryContainer,
networkImage: NetworkImage.new,
),
[
avatarUrl,
avatarInitial,
context.colors.primaryContainer,
context.colors.onPrimaryContainer,
],
);
final avatar = useFuture(avatarFuture, preserveState: false).data;
final channel = useState<MethodChannel?>(null);
final latest = useRef(actions)..value = actions;
final menu = [
for (var i = 0; i < actions.length; i++)
{
'id': i,
'dividerBefore': dividerBefore.contains(i),
'label': actions[i].label,
'symbol': actions[i].symbol,
'enabled': actions[i].onPressed != null,
},
];
final content = <String, Object>{
'icon': icon,
'imageBytes': ?avatar,
'label': ?label,
'showIconWithLabel': showIconWithLabel,
'accessibilityLabel': accessibilityLabel,
'menu': menu,
};
useEffect(() {
final current = channel.value;
if (current == null) return null;
current.setMethodCallHandler((call) async {
if (call.method != 'menuAction') return;
final index = call.arguments as int;
if (index >= 0 && index < latest.value.length) {
latest.value[index].onPressed?.call();
}
});
return () => current.setMethodCallHandler(null);
}, [channel.value]);
useEffect(
() {
final current = channel.value;
if (current != null) {
unawaited(current.invokeMethod<void>('setContent', content));
unawaited(
current.invokeMethod<void>('setAppearance', {
'brightness': brightness.name,
'foregroundColor': foreground,
'enabled': true,
}),
);
}
return null;
},
[
channel.value,
avatar,
icon,
label,
accessibilityLabel,
...actions.map((a) => a.onPressed != null),
brightness,
foreground,
],
);
// UIKit glass layers can float above the incoming Flutter route during
// its transition. Remove the covered route's platform view immediately.
if (!nativeControlsVisible) {
return SizedBox(width: width, height: height);
}
return SizedBox(
width: width,
height: height,
child: UiKitView(
viewType: 'buzz/navigation_glass',
gestureRecognizers: {
Factory<EagerGestureRecognizer>(EagerGestureRecognizer.new),
},
creationParams: {
...content,
'plain': plain,
'buttonCenterX': width / 2,
'controlWidth': width,
'controlSize': height,
'hitTargetWidth': width,
'hitTargetHeight': height,
'brightness': brightness.name,
'foregroundColor': foreground,
'enabled': true,
},
creationParamsCodec: const StandardMessageCodec(),
onPlatformViewCreated: (id) =>
channel.value = MethodChannel('buzz/navigation_glass/$id'),
),
);
}
}