Files
buzz/mobile/lib/shared/widgets/buzz_sheet_header.dart
klopez4212 ffb12d3b05 Fix mobile thread tail and iOS channel header (#6399)
## Summary

- Hide the thread Latest control once the lazy tail is fully reached.
- Polish the mobile channel header and use native iOS liquid glass for
Back.
- Keep the two-line header aligned and safe at larger text sizes.

## Validation

- `just mobile-check`
- `flutter test` (1,553 tests)
- Signed iPhone build installed and launched

---------

Signed-off-by: kenny lopez <klopez4212@gmail.com>
Co-authored-by: Carl <3c4caeafb646d23867f1c4832e68211d77e2561946171625f75c3ce1a3f2670f@buzz.block.builderlab.xyz>
2026-08-21 15:27:30 +01:00

136 lines
3.7 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';
import 'ios_glass_navigation_button.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) {
void closeSheet() {
unawaited(HapticFeedback.lightImpact());
Navigator.of(context).pop();
}
if (Theme.of(context).platform == TargetPlatform.iOS) {
return IosGlassNavigationButton(
key: const ValueKey('buzz-sheet-ios-glass-close'),
icon: IosGlassNavigationIcon.close,
semanticLabel: 'Close sheet',
onPressed: closeSheet,
width: 44,
height: 44,
);
}
return SizedBox.square(
dimension: 44,
child: IconButton(
tooltip: 'Close sheet',
onPressed: closeSheet,
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),
),
),
);
}
}