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>
122 lines
3.3 KiB
Dart
122 lines
3.3 KiB
Dart
import 'dart:async';
|
|
|
|
import 'package:flutter/material.dart';
|
|
import 'package:flutter/services.dart';
|
|
import 'package:lucide_icons_flutter/lucide_icons.dart';
|
|
|
|
import '../theme/theme.dart';
|
|
|
|
/// A titled sheet header with balanced actions and an exactly centered title.
|
|
class BuzzSheetHeader extends StatelessWidget {
|
|
const BuzzSheetHeader({
|
|
super.key,
|
|
this.title,
|
|
this.titleKey,
|
|
this.leading,
|
|
this.trailing,
|
|
this.showDragHandle = false,
|
|
});
|
|
|
|
final String? title;
|
|
final Key? titleKey;
|
|
final Widget? leading;
|
|
final Widget? trailing;
|
|
final bool showDragHandle;
|
|
|
|
@override
|
|
Widget build(BuildContext context) {
|
|
return Padding(
|
|
padding: const EdgeInsets.only(
|
|
top: Grid.xxs,
|
|
left: Grid.gutter,
|
|
right: Grid.gutter,
|
|
bottom: Grid.xs,
|
|
),
|
|
child: SizedBox(
|
|
height: 56,
|
|
child: Stack(
|
|
alignment: Alignment.topCenter,
|
|
children: [
|
|
if (showDragHandle) const _SheetDragHandle(),
|
|
if (title case final title?)
|
|
Positioned(
|
|
left: 64,
|
|
right: 64,
|
|
bottom: 0,
|
|
height: 44,
|
|
child: Center(
|
|
child: Text(
|
|
title,
|
|
key: titleKey ?? const ValueKey('buzz-sheet-title'),
|
|
maxLines: 1,
|
|
overflow: TextOverflow.ellipsis,
|
|
textAlign: TextAlign.center,
|
|
style: context.textTheme.titleSmall?.copyWith(
|
|
fontWeight: FontWeight.w600,
|
|
),
|
|
),
|
|
),
|
|
),
|
|
Align(
|
|
alignment: Alignment.bottomRight,
|
|
child: trailing ?? const _SheetCloseButton(),
|
|
),
|
|
if (leading case final leading?)
|
|
Align(alignment: Alignment.bottomLeft, child: leading),
|
|
],
|
|
),
|
|
),
|
|
);
|
|
}
|
|
}
|
|
|
|
class _SheetCloseButton extends StatelessWidget {
|
|
const _SheetCloseButton();
|
|
|
|
@override
|
|
Widget build(BuildContext context) {
|
|
return SizedBox.square(
|
|
dimension: 44,
|
|
child: IconButton(
|
|
tooltip: 'Close sheet',
|
|
onPressed: () {
|
|
unawaited(HapticFeedback.lightImpact());
|
|
Navigator.of(context).pop();
|
|
},
|
|
style: IconButton.styleFrom(
|
|
padding: EdgeInsets.zero,
|
|
backgroundColor: context.colors.surfaceContainerHighest,
|
|
foregroundColor: context.colors.onSurface,
|
|
shape: RoundedRectangleBorder(
|
|
borderRadius: BorderRadius.circular(Radii.dialog),
|
|
),
|
|
),
|
|
icon: const Icon(LucideIcons.x, size: 22),
|
|
),
|
|
);
|
|
}
|
|
}
|
|
|
|
class _SheetDragHandle extends StatelessWidget {
|
|
const _SheetDragHandle();
|
|
|
|
@override
|
|
Widget build(BuildContext context) {
|
|
return Semantics(
|
|
label: MaterialLocalizations.of(context).modalBarrierDismissLabel,
|
|
container: true,
|
|
button: true,
|
|
onTap: () => Navigator.of(context).pop(),
|
|
child: Container(
|
|
key: const ValueKey('buzz-sheet-drag-handle'),
|
|
width: 32,
|
|
height: 4,
|
|
decoration: BoxDecoration(
|
|
color: context.colors.onSurfaceVariant.withValues(alpha: 0.4),
|
|
borderRadius: BorderRadius.circular(Radii.full),
|
|
),
|
|
),
|
|
);
|
|
}
|
|
}
|