improve bottom sheet handling

This commit is contained in:
Fabian Freund
2025-10-03 12:15:53 +02:00
parent 59c567d495
commit 805d39e300
10 changed files with 352 additions and 324 deletions
@@ -85,7 +85,7 @@ class SiteSearch extends HookConsumerWidget {
.read(tabSessionProvider(tabId: null).notifier) .read(tabSessionProvider(tabId: null).notifier)
.loadUrl(url: newUrl); .loadUrl(url: newUrl);
ref.read(bottomSheetControllerProvider.notifier).dismiss(); ref.read(bottomSheetControllerProvider.notifier).requestDismiss();
} else if (bang != null) { } else if (bang != null) {
final isPrivate = final isPrivate =
ref.read(selectedTabStateProvider)?.isPrivate ?? ref.read(selectedTabStateProvider)?.isPrivate ??
@@ -112,7 +112,7 @@ class SiteSearch extends HookConsumerWidget {
.loadUrl(url: searchUri); .loadUrl(url: searchUri);
} }
ref.read(bottomSheetControllerProvider.notifier).dismiss(); ref.read(bottomSheetControllerProvider.notifier).requestDismiss();
} }
} }
} }
@@ -30,12 +30,19 @@ class BottomSheetController extends _$BottomSheetController {
return null; return null;
} }
///We depend on a listener that updates/syncs UI to open the sheet
// ignore: use_setters_to_change_properties api decision // ignore: use_setters_to_change_properties api decision
void show(Sheet sheet) { void show(Sheet sheet) {
state = sheet; state = sheet;
} }
void dismiss() { ///We depend on a listener that updates/syncs UI to close the sheet
void requestDismiss() {
state = null;
}
///This is called by UI when the sheet gets closed
void closed() {
state = null; state = null;
} }
} }
@@ -42,7 +42,7 @@ final class BottomSheetControllerProvider
} }
String _$bottomSheetControllerHash() => String _$bottomSheetControllerHash() =>
r'94b9467731de45d4edd24028d76279e17fc26d02'; r'21c353d433c8a964d63915cc4ebf5767e16210b1';
abstract class _$BottomSheetController extends $Notifier<Sheet?> { abstract class _$BottomSheetController extends $Notifier<Sheet?> {
Sheet? build(); Sheet? build();
@@ -190,7 +190,7 @@ class TabTreeDialog extends HookConsumerWidget {
context.pop(); context.pop();
ref ref
.read(bottomSheetControllerProvider.notifier) .read(bottomSheetControllerProvider.notifier)
.dismiss(); .requestDismiss();
}, },
sourceSearchQuery: null, sourceSearchQuery: null,
), ),
@@ -17,6 +17,7 @@
* You should have received a copy of the GNU Affero General Public License * You should have received a copy of the GNU Affero General Public License
* along with this program. If not, see <http://www.gnu.org/licenses/>. * along with this program. If not, see <http://www.gnu.org/licenses/>.
*/ */
import 'dart:async';
import 'dart:math' as math; import 'dart:math' as math;
import 'package:flutter/material.dart'; import 'package:flutter/material.dart';
@@ -59,9 +60,6 @@ class BrowserScreen extends HookConsumerWidget {
Widget build(BuildContext context, WidgetRef ref) { Widget build(BuildContext context, WidgetRef ref) {
final eventService = ref.watch(eventServiceProvider); final eventService = ref.watch(eventServiceProvider);
final sheetDisplayed = ref.watch(
bottomSheetControllerProvider.select((value) => value != null),
);
final overlayBuilder = ref.watch(overlayControllerProvider); final overlayBuilder = ref.watch(overlayControllerProvider);
final tabInFullScreen = ref.watch( final tabInFullScreen = ref.watch(
@@ -107,10 +105,7 @@ class BrowserScreen extends HookConsumerWidget {
final sheetController = useRef<PersistentBottomSheetController?>(null); final sheetController = useRef<PersistentBottomSheetController?>(null);
return TickerMode( return PopScope(
//Lets not pause riverpod subscriptions for nnow
enabled: true,
child: PopScope(
//We need this for BackButtonListener to work downstream //We need this for BackButtonListener to work downstream
//No direct pop result will be handled here //No direct pop result will be handled here
canPop: false, canPop: false,
@@ -118,6 +113,10 @@ class BrowserScreen extends HookConsumerWidget {
data: themeData, data: themeData,
child: Scaffold( child: Scaffold(
extendBodyBehindAppBar: tabInFullScreen, extendBodyBehindAppBar: tabInFullScreen,
bottomSheetScrimBuilder: (_, _) {
//This causes issues with a non dismissable barrier pushed, we ahve our own barrier and this does seem to have issues when dismissing, so disable it completely
return null;
},
bottomNavigationBar: HookConsumer( bottomNavigationBar: HookConsumer(
builder: (context, ref, child) { builder: (context, ref, child) {
final tabId = ref.watch(selectedTabProvider); final tabId = ref.watch(selectedTabProvider);
@@ -174,9 +173,7 @@ class BrowserScreen extends HookConsumerWidget {
); );
ref.listen( ref.listen(
tabStateProvider( tabStateProvider(tabId).select((value) => value?.historyState),
tabId,
).select((value) => value?.historyState),
(previous, next) { (previous, next) {
if (next != null && previous != null) { if (next != null && previous != null) {
if (previous != next) { if (previous != next) {
@@ -250,11 +247,11 @@ class BrowserScreen extends HookConsumerWidget {
return overlayBuilder!.call(context); return overlayBuilder!.call(context);
}, },
child: Listener( child: Listener(
onPointerDown: sheetDisplayed onPointerDown: sheetController.value != null
? (_) { ? (_) {
ref ref
.read(bottomSheetControllerProvider.notifier) .read(bottomSheetControllerProvider.notifier)
.dismiss(); .requestDismiss();
} }
: null, : null,
child: BackButtonListener( child: BackButtonListener(
@@ -271,10 +268,10 @@ class BrowserScreen extends HookConsumerWidget {
return false; return false;
} }
if (sheetDisplayed) { if (ref.read(bottomSheetControllerProvider) != null) {
ref ref
.read(bottomSheetControllerProvider.notifier) .read(bottomSheetControllerProvider.notifier)
.dismiss(); .requestDismiss();
return true; return true;
} }
@@ -308,9 +305,7 @@ class BrowserScreen extends HookConsumerWidget {
lastBackButtonPress.value = null; lastBackButtonPress.value = null;
await ref await ref
.read( .read(readerableScreenControllerProvider.notifier)
readerableScreenControllerProvider.notifier,
)
.toggleReaderView(false); .toggleReaderView(false);
return true; return true;
@@ -377,7 +372,7 @@ class BrowserScreen extends HookConsumerWidget {
} }
}, },
child: _BrowserView( child: _BrowserView(
sheetDisplayed: sheetDisplayed, sheetDisplayed: sheetController.value != null,
isFullscreen: tabInFullScreen, isFullscreen: tabInFullScreen,
), ),
), ),
@@ -396,8 +391,7 @@ class BrowserScreen extends HookConsumerWidget {
final relativeSafeArea = MediaQuery.of( final relativeSafeArea = MediaQuery.of(
context, context,
).relativeSafeArea(); ).relativeSafeArea();
sheetController final controller = Scaffold.of(context).showBottomSheet((
.value = Scaffold.of(context).showBottomSheet((
context, context,
) { ) {
bool dismissOnThreshold( bool dismissOnThreshold(
@@ -406,7 +400,7 @@ class BrowserScreen extends HookConsumerWidget {
if (notification.extent <= 0.1) { if (notification.extent <= 0.1) {
ref ref
.read(bottomSheetControllerProvider.notifier) .read(bottomSheetControllerProvider.notifier)
.dismiss(); .requestDismiss();
return true; return true;
} }
@@ -418,9 +412,7 @@ class BrowserScreen extends HookConsumerWidget {
NotificationListener<DraggableScrollableNotification>( NotificationListener<DraggableScrollableNotification>(
key: ValueKey(next), key: ValueKey(next),
onNotification: dismissOnThreshold, onNotification: dismissOnThreshold,
child: _ViewTabsSheet( child: _ViewTabsSheet(maxChildSize: relativeSafeArea),
maxChildSize: relativeSafeArea,
),
), ),
final EditUrlSheet parameter => final EditUrlSheet parameter =>
NotificationListener<DraggableScrollableNotification>( NotificationListener<DraggableScrollableNotification>(
@@ -435,6 +427,14 @@ class BrowserScreen extends HookConsumerWidget {
return sheet; return sheet;
}); });
unawaited(
controller.closed.whenComplete(() {
ref.read(bottomSheetControllerProvider.notifier).closed();
}),
);
sheetController.value = controller;
} }
}); });
@@ -444,7 +444,6 @@ class BrowserScreen extends HookConsumerWidget {
floatingActionButton: ReaderAppearanceButton(), floatingActionButton: ReaderAppearanceButton(),
), ),
), ),
),
); );
} }
} }
@@ -563,7 +562,7 @@ class _ViewUrlSheet extends HookConsumerWidget {
sheetScrollController: scrollController, sheetScrollController: scrollController,
draggableScrollableController: draggableScrollableController, draggableScrollableController: draggableScrollableController,
onClose: () { onClose: () {
ref.read(bottomSheetControllerProvider.notifier).dismiss(); ref.read(bottomSheetControllerProvider.notifier).requestDismiss();
}, },
initialHeight: initialHeight, initialHeight: initialHeight,
), ),
@@ -599,14 +598,18 @@ class _ViewTabsSheet extends HookConsumerWidget {
? ViewTabTreesSheetWidget( ? ViewTabTreesSheetWidget(
sheetScrollController: scrollController, sheetScrollController: scrollController,
onClose: () { onClose: () {
ref.read(bottomSheetControllerProvider.notifier).dismiss(); ref
.read(bottomSheetControllerProvider.notifier)
.requestDismiss();
}, },
) )
: ViewTabsSheetWidget( : ViewTabsSheetWidget(
sheetScrollController: scrollController, sheetScrollController: scrollController,
draggableScrollableController: draggableScrollableController, draggableScrollableController: draggableScrollableController,
onClose: () { onClose: () {
ref.read(bottomSheetControllerProvider.notifier).dismiss(); ref
.read(bottomSheetControllerProvider.notifier)
.requestDismiss();
}, },
), ),
); );
@@ -154,7 +154,9 @@ class BrowserBottomAppBar extends HookConsumerWidget {
isActive: displayedSheet is ViewTabsSheet, isActive: displayedSheet is ViewTabsSheet,
onTap: () { onTap: () {
if (displayedSheet case ViewTabsSheet()) { if (displayedSheet case ViewTabsSheet()) {
ref.read(bottomSheetControllerProvider.notifier).dismiss(); ref
.read(bottomSheetControllerProvider.notifier)
.requestDismiss();
} else { } else {
ref ref
.read(bottomSheetControllerProvider.notifier) .read(bottomSheetControllerProvider.notifier)
@@ -228,7 +228,9 @@ class ViewTabSheetWidget extends HookConsumerWidget {
ClipboardData(text: initialTabState.url.toString()), ClipboardData(text: initialTabState.url.toString()),
); );
ref.read(bottomSheetControllerProvider.notifier).dismiss(); ref
.read(bottomSheetControllerProvider.notifier)
.requestDismiss();
}, },
), ),
ListTile( ListTile(
@@ -260,7 +262,9 @@ class ViewTabSheetWidget extends HookConsumerWidget {
}, },
); );
ref.read(bottomSheetControllerProvider.notifier).dismiss(); ref
.read(bottomSheetControllerProvider.notifier)
.requestDismiss();
} }
}, },
), ),
@@ -283,7 +287,9 @@ class ViewTabSheetWidget extends HookConsumerWidget {
}, },
); );
ref.read(bottomSheetControllerProvider.notifier).dismiss(); ref
.read(bottomSheetControllerProvider.notifier)
.requestDismiss();
} }
}, },
), ),
@@ -306,7 +312,9 @@ class ViewTabSheetWidget extends HookConsumerWidget {
} }
} }
ref.read(bottomSheetControllerProvider.notifier).dismiss(); ref
.read(bottomSheetControllerProvider.notifier)
.requestDismiss();
}, },
), ),
Consumer( Consumer(
@@ -318,7 +326,9 @@ class ViewTabSheetWidget extends HookConsumerWidget {
.read(tabDataRepositoryProvider.notifier) .read(tabDataRepositoryProvider.notifier)
.unassignContainer(initialTabState.id); .unassignContainer(initialTabState.id);
ref.read(bottomSheetControllerProvider.notifier).dismiss(); ref
.read(bottomSheetControllerProvider.notifier)
.requestDismiss();
}, },
), ),
builder: (context, ref, child) { builder: (context, ref, child) {
@@ -340,7 +350,9 @@ class ViewTabSheetWidget extends HookConsumerWidget {
ShareParams(uri: initialTabState.url), ShareParams(uri: initialTabState.url),
); );
ref.read(bottomSheetControllerProvider.notifier).dismiss(); ref
.read(bottomSheetControllerProvider.notifier)
.requestDismiss();
}, },
onTapQr: () async { onTapQr: () async {
await showQrCode(context, initialTabState.url.toString()); await showQrCode(context, initialTabState.url.toString());
@@ -376,7 +388,9 @@ class ViewTabSheetWidget extends HookConsumerWidget {
}); });
} }
ref.read(bottomSheetControllerProvider.notifier).dismiss(); ref
.read(bottomSheetControllerProvider.notifier)
.requestDismiss();
}, },
), ),
WebsiteFeedTile(initialTabState), WebsiteFeedTile(initialTabState),
@@ -118,7 +118,7 @@ class SearchScreen extends HookConsumerWidget {
); );
if (context.mounted) { if (context.mounted) {
ref.read(bottomSheetControllerProvider.notifier).dismiss(); ref.read(bottomSheetControllerProvider.notifier).requestDismiss();
context.pop(); context.pop();
} }
@@ -224,7 +224,7 @@ class SearchScreen extends HookConsumerWidget {
if (context.mounted) { if (context.mounted) {
ref ref
.read(bottomSheetControllerProvider.notifier) .read(bottomSheetControllerProvider.notifier)
.dismiss(); .requestDismiss();
context.pop(); context.pop();
} }
@@ -127,7 +127,7 @@ class HistorySuggestions extends HookConsumerWidget {
.read( .read(
bottomSheetControllerProvider.notifier, bottomSheetControllerProvider.notifier,
) )
.dismiss(); .requestDismiss();
context.pop(); context.pop();
} }
@@ -171,7 +171,9 @@ class TabSearch extends HookConsumerWidget {
} }
if (context.mounted) { if (context.mounted) {
ref.read(bottomSheetControllerProvider.notifier).dismiss(); ref
.read(bottomSheetControllerProvider.notifier)
.requestDismiss();
context.pop(); context.pop();
} }