mirror of
https://github.com/gabehf/Fladder.git
synced 2026-03-10 16:00:28 -07:00
[Feature] Replace go_router with auto_route
This commit is contained in:
parent
b31cc86ae8
commit
144c8faf70
42 changed files with 1181 additions and 980 deletions
|
|
@ -1,27 +1,26 @@
|
|||
import 'package:flutter/material.dart';
|
||||
|
||||
import 'package:auto_route/auto_route.dart';
|
||||
import 'package:ficonsax/ficonsax.dart';
|
||||
import 'package:flutter_riverpod/flutter_riverpod.dart';
|
||||
|
||||
import 'package:fladder/providers/auth_provider.dart';
|
||||
import 'package:fladder/providers/user_provider.dart';
|
||||
import 'package:fladder/routes/build_routes/route_builder.dart';
|
||||
import 'package:fladder/routes/build_routes/settings_routes.dart';
|
||||
import 'package:fladder/routes/auto_router.gr.dart';
|
||||
import 'package:fladder/screens/settings/quick_connect_window.dart';
|
||||
import 'package:fladder/screens/settings/settings_list_tile.dart';
|
||||
import 'package:fladder/screens/settings/settings_scaffold.dart';
|
||||
import 'package:fladder/screens/shared/animated_fade_size.dart';
|
||||
import 'package:fladder/screens/shared/fladder_icon.dart';
|
||||
import 'package:fladder/util/adaptive_layout.dart';
|
||||
import 'package:fladder/util/application_info.dart';
|
||||
import 'package:fladder/util/localization_helper.dart';
|
||||
import 'package:fladder/util/theme_extensions.dart';
|
||||
import 'package:fladder/widgets/shared/hide_on_scroll.dart';
|
||||
import 'package:flutter/material.dart';
|
||||
import 'package:flutter_riverpod/flutter_riverpod.dart';
|
||||
|
||||
import 'package:fladder/providers/auth_provider.dart';
|
||||
import 'package:fladder/util/application_info.dart';
|
||||
import 'package:go_router/go_router.dart';
|
||||
|
||||
@RoutePage()
|
||||
class SettingsScreen extends ConsumerStatefulWidget {
|
||||
final Widget? child;
|
||||
final String? location;
|
||||
const SettingsScreen({this.child, this.location, super.key});
|
||||
const SettingsScreen({super.key});
|
||||
|
||||
@override
|
||||
ConsumerState<ConsumerStatefulWidget> createState() => _SettingsScreenState();
|
||||
|
|
@ -29,27 +28,30 @@ class SettingsScreen extends ConsumerStatefulWidget {
|
|||
|
||||
class _SettingsScreenState extends ConsumerState<SettingsScreen> {
|
||||
final scrollController = ScrollController();
|
||||
late final singlePane = widget.child == null;
|
||||
final minVerticalPadding = 20.0;
|
||||
|
||||
@override
|
||||
Widget build(BuildContext context) {
|
||||
if (singlePane) {
|
||||
if (AdaptiveLayout.of(context).size == ScreenLayout.single) {
|
||||
return Card(
|
||||
elevation: 0,
|
||||
child: _leftPane(context),
|
||||
);
|
||||
} else {
|
||||
return Row(
|
||||
mainAxisSize: MainAxisSize.max,
|
||||
crossAxisAlignment: CrossAxisAlignment.stretch,
|
||||
children: [
|
||||
Expanded(flex: 1, child: _leftPane(context)),
|
||||
Expanded(
|
||||
flex: 2,
|
||||
child: widget.child ?? Container(),
|
||||
),
|
||||
],
|
||||
return AutoRouter(
|
||||
builder: (context, content) {
|
||||
return Row(
|
||||
mainAxisSize: MainAxisSize.max,
|
||||
crossAxisAlignment: CrossAxisAlignment.stretch,
|
||||
children: [
|
||||
Expanded(flex: 1, child: _leftPane(context)),
|
||||
Expanded(
|
||||
flex: 2,
|
||||
child: content,
|
||||
),
|
||||
],
|
||||
);
|
||||
},
|
||||
);
|
||||
}
|
||||
}
|
||||
|
|
@ -68,152 +70,165 @@ class _SettingsScreenState extends ConsumerState<SettingsScreen> {
|
|||
}
|
||||
}
|
||||
|
||||
bool containsRoute(CustomRoute route) => widget.location == route.route;
|
||||
|
||||
Widget _leftPane(BuildContext context) {
|
||||
final quickConnectAvailable = ref.watch(userProvider.select((value) => value?.serverConfiguration?.quickConnectAvailable ?? false));
|
||||
return SettingsScaffold(
|
||||
label: context.localized.settings,
|
||||
scrollController: scrollController,
|
||||
showUserIcon: true,
|
||||
items: [
|
||||
if (context.canPop() && AdaptiveLayout.of(context).isDesktop)
|
||||
Align(
|
||||
alignment: Alignment.centerLeft,
|
||||
child: Padding(
|
||||
padding: const EdgeInsets.all(16.0),
|
||||
child: IconButton.filledTonal(
|
||||
style: IconButton.styleFrom(
|
||||
backgroundColor: Theme.of(context).colorScheme.surface.withOpacity(0.8),
|
||||
),
|
||||
onPressed: () {
|
||||
context.pop();
|
||||
},
|
||||
icon: Padding(
|
||||
padding: EdgeInsets.all(AdaptiveLayout.of(context).inputDevice == InputDevice.pointer ? 0 : 4),
|
||||
child: const Icon(IconsaxOutline.arrow_left_2),
|
||||
void navigateTo(PageRouteInfo route) {
|
||||
AdaptiveLayout.of(context).size == ScreenLayout.single
|
||||
? context.router.navigate(route)
|
||||
: context.router.replace(route);
|
||||
}
|
||||
|
||||
bool containsRoute(PageRouteInfo route) {
|
||||
return context.router.current.name == route.routeName;
|
||||
}
|
||||
|
||||
final quickConnectAvailable =
|
||||
ref.watch(userProvider.select((value) => value?.serverConfiguration?.quickConnectAvailable ?? false));
|
||||
return Container(
|
||||
color: context.colors.surface,
|
||||
child: SettingsScaffold(
|
||||
label: context.localized.settings,
|
||||
scrollController: scrollController,
|
||||
showUserIcon: true,
|
||||
items: [
|
||||
if (context.router.canPop() && AdaptiveLayout.of(context).size == ScreenLayout.single)
|
||||
Align(
|
||||
alignment: Alignment.centerLeft,
|
||||
child: Padding(
|
||||
padding: const EdgeInsets.all(16.0),
|
||||
child: IconButton.filledTonal(
|
||||
style: IconButton.styleFrom(
|
||||
backgroundColor: Theme.of(context).colorScheme.surface.withOpacity(0.8),
|
||||
),
|
||||
onPressed: () => context.router.maybePop(),
|
||||
icon: Padding(
|
||||
padding: EdgeInsets.all(AdaptiveLayout.of(context).inputDevice == InputDevice.pointer ? 0 : 4),
|
||||
child: const Icon(IconsaxOutline.arrow_left_2),
|
||||
),
|
||||
),
|
||||
),
|
||||
),
|
||||
),
|
||||
SettingsListTile(
|
||||
label: Text(context.localized.settingsClientTitle),
|
||||
subLabel: Text(context.localized.settingsClientDesc),
|
||||
selected: containsRoute(ClientSettingsRoute()),
|
||||
icon: deviceIcon,
|
||||
onTap: () => context.routeReplaceOrPush(ClientSettingsRoute()),
|
||||
),
|
||||
if (quickConnectAvailable)
|
||||
SettingsListTile(
|
||||
label: Text(context.localized.settingsQuickConnectTitle),
|
||||
icon: IconsaxOutline.password_check,
|
||||
onTap: () => openQuickConnectDialog(context),
|
||||
label: Text(context.localized.settingsClientTitle),
|
||||
subLabel: Text(context.localized.settingsClientDesc),
|
||||
selected: containsRoute(const ClientSettingsRoute()),
|
||||
icon: deviceIcon,
|
||||
onTap: () => navigateTo(const ClientSettingsRoute()),
|
||||
),
|
||||
SettingsListTile(
|
||||
label: Text(context.localized.settingsProfileTitle),
|
||||
subLabel: Text(context.localized.settingsProfileDesc),
|
||||
selected: containsRoute(SecuritySettingsRoute()),
|
||||
icon: IconsaxOutline.security_user,
|
||||
onTap: () => context.routeReplaceOrPush(SecuritySettingsRoute()),
|
||||
),
|
||||
SettingsListTile(
|
||||
label: Text(context.localized.settingsPlayerTitle),
|
||||
subLabel: Text(context.localized.settingsPlayerDesc),
|
||||
selected: containsRoute(PlayerSettingsRoute()),
|
||||
icon: IconsaxOutline.video_play,
|
||||
onTap: () => context.routeReplaceOrPush(PlayerSettingsRoute()),
|
||||
),
|
||||
SettingsListTile(
|
||||
label: Text(context.localized.about),
|
||||
subLabel: const Text("Fladder"),
|
||||
suffix: Opacity(
|
||||
opacity: 1,
|
||||
child: FladderIconOutlined(
|
||||
size: 24,
|
||||
color: context.colors.onSurfaceVariant,
|
||||
)),
|
||||
onTap: () => showAboutDialog(
|
||||
context: context,
|
||||
applicationIcon: const FladderIcon(size: 85),
|
||||
applicationVersion: ref.watch(applicationInfoProvider).versionAndPlatform,
|
||||
applicationLegalese: "Donut Factory",
|
||||
if (quickConnectAvailable)
|
||||
SettingsListTile(
|
||||
label: Text(context.localized.settingsQuickConnectTitle),
|
||||
icon: IconsaxOutline.password_check,
|
||||
onTap: () => openQuickConnectDialog(context),
|
||||
),
|
||||
SettingsListTile(
|
||||
label: Text(context.localized.settingsProfileTitle),
|
||||
subLabel: Text(context.localized.settingsProfileDesc),
|
||||
selected: containsRoute(const SecuritySettingsRoute()),
|
||||
icon: IconsaxOutline.security_user,
|
||||
onTap: () => navigateTo(const SecuritySettingsRoute()),
|
||||
),
|
||||
),
|
||||
],
|
||||
floatingActionButton: HideOnScroll(
|
||||
controller: scrollController,
|
||||
visibleBuilder: (visible) {
|
||||
return AnimatedFadeSize(
|
||||
child: visible
|
||||
? Padding(
|
||||
padding: EdgeInsets.symmetric(horizontal: MediaQuery.paddingOf(context).horizontal),
|
||||
child: Padding(
|
||||
padding: const EdgeInsets.symmetric(horizontal: 16),
|
||||
child: Row(
|
||||
mainAxisAlignment: MainAxisAlignment.end,
|
||||
children: [
|
||||
const Spacer(),
|
||||
FloatingActionButton(
|
||||
key: Key(context.localized.switchUser),
|
||||
tooltip: context.localized.switchUser,
|
||||
onPressed: () {
|
||||
ref.read(userProvider.notifier).logoutUser();
|
||||
context.routeGo(LoginRoute());
|
||||
},
|
||||
child: const Icon(
|
||||
IconsaxOutline.arrow_swap_horizontal,
|
||||
SettingsListTile(
|
||||
label: Text(context.localized.settingsPlayerTitle),
|
||||
subLabel: Text(context.localized.settingsPlayerDesc),
|
||||
selected: containsRoute(const PlayerSettingsRoute()),
|
||||
icon: IconsaxOutline.video_play,
|
||||
onTap: () => navigateTo(const PlayerSettingsRoute()),
|
||||
),
|
||||
SettingsListTile(
|
||||
label: Text(context.localized.about),
|
||||
subLabel: const Text("Fladder"),
|
||||
suffix: Opacity(
|
||||
opacity: 1,
|
||||
child: FladderIconOutlined(
|
||||
size: 24,
|
||||
color: context.colors.onSurfaceVariant,
|
||||
)),
|
||||
onTap: () => showAboutDialog(
|
||||
context: context,
|
||||
applicationIcon: const FladderIcon(size: 85),
|
||||
applicationVersion: ref.watch(applicationInfoProvider).versionAndPlatform,
|
||||
applicationLegalese: "Donut Factory",
|
||||
),
|
||||
),
|
||||
],
|
||||
floatingActionButton: HideOnScroll(
|
||||
controller: scrollController,
|
||||
visibleBuilder: (visible) {
|
||||
return AnimatedFadeSize(
|
||||
child: visible
|
||||
? Padding(
|
||||
padding: EdgeInsets.symmetric(horizontal: MediaQuery.paddingOf(context).horizontal),
|
||||
child: Padding(
|
||||
padding: const EdgeInsets.symmetric(horizontal: 16),
|
||||
child: Row(
|
||||
mainAxisAlignment: MainAxisAlignment.end,
|
||||
children: [
|
||||
const Spacer(),
|
||||
FloatingActionButton(
|
||||
key: Key(context.localized.switchUser),
|
||||
tooltip: context.localized.switchUser,
|
||||
onPressed: () async {
|
||||
await ref.read(userProvider.notifier).logoutUser();
|
||||
context.router.navigate(const LoginRoute());
|
||||
},
|
||||
child: const Icon(
|
||||
IconsaxOutline.arrow_swap_horizontal,
|
||||
),
|
||||
),
|
||||
),
|
||||
const SizedBox(width: 16),
|
||||
FloatingActionButton(
|
||||
key: Key(context.localized.logout),
|
||||
tooltip: context.localized.logout,
|
||||
backgroundColor: Theme.of(context).colorScheme.errorContainer,
|
||||
onPressed: () {
|
||||
final user = ref.read(userProvider);
|
||||
showDialog(
|
||||
context: context,
|
||||
builder: (context) => AlertDialog(
|
||||
title: Text(context.localized.logoutUserPopupTitle(user?.name ?? "")),
|
||||
scrollable: true,
|
||||
content: Text(
|
||||
context.localized.logoutUserPopupContent(user?.name ?? "", user?.server ?? ""),
|
||||
),
|
||||
actions: [
|
||||
ElevatedButton(
|
||||
onPressed: () => Navigator.pop(context),
|
||||
child: Text(context.localized.cancel),
|
||||
const SizedBox(width: 16),
|
||||
FloatingActionButton(
|
||||
heroTag: context.localized.logout,
|
||||
key: Key(context.localized.logout),
|
||||
tooltip: context.localized.logout,
|
||||
backgroundColor: Theme.of(context).colorScheme.errorContainer,
|
||||
onPressed: () {
|
||||
final user = ref.read(userProvider);
|
||||
showDialog(
|
||||
context: context,
|
||||
builder: (context) => AlertDialog(
|
||||
title: Text(context.localized.logoutUserPopupTitle(user?.name ?? "")),
|
||||
scrollable: true,
|
||||
content: Text(
|
||||
context.localized.logoutUserPopupContent(user?.name ?? "", user?.server ?? ""),
|
||||
),
|
||||
ElevatedButton(
|
||||
style: ElevatedButton.styleFrom().copyWith(
|
||||
foregroundColor: WidgetStatePropertyAll(Theme.of(context).colorScheme.onErrorContainer),
|
||||
backgroundColor: WidgetStatePropertyAll(Theme.of(context).colorScheme.errorContainer),
|
||||
actions: [
|
||||
ElevatedButton(
|
||||
onPressed: () => Navigator.pop(context),
|
||||
child: Text(context.localized.cancel),
|
||||
),
|
||||
onPressed: () async {
|
||||
await ref.read(authProvider.notifier).logOutUser();
|
||||
if (context.mounted) context.routeGo(SplashRoute());
|
||||
},
|
||||
child: Text(context.localized.logout),
|
||||
),
|
||||
],
|
||||
),
|
||||
);
|
||||
},
|
||||
child: Icon(
|
||||
IconsaxOutline.logout,
|
||||
color: Theme.of(context).colorScheme.onErrorContainer,
|
||||
ElevatedButton(
|
||||
style: ElevatedButton.styleFrom().copyWith(
|
||||
foregroundColor:
|
||||
WidgetStatePropertyAll(Theme.of(context).colorScheme.onErrorContainer),
|
||||
backgroundColor:
|
||||
WidgetStatePropertyAll(Theme.of(context).colorScheme.errorContainer),
|
||||
),
|
||||
onPressed: () async {
|
||||
await ref.read(authProvider.notifier).logOutUser();
|
||||
if (context.mounted) context.router.navigate(const LoginRoute());
|
||||
},
|
||||
child: Text(context.localized.logout),
|
||||
),
|
||||
],
|
||||
),
|
||||
);
|
||||
},
|
||||
child: Icon(
|
||||
IconsaxOutline.logout,
|
||||
color: Theme.of(context).colorScheme.onErrorContainer,
|
||||
),
|
||||
),
|
||||
),
|
||||
],
|
||||
],
|
||||
),
|
||||
),
|
||||
)
|
||||
: Container(
|
||||
height: 0,
|
||||
key: UniqueKey(),
|
||||
),
|
||||
)
|
||||
: Container(
|
||||
height: 0,
|
||||
key: UniqueKey(),
|
||||
),
|
||||
);
|
||||
},
|
||||
);
|
||||
},
|
||||
),
|
||||
),
|
||||
);
|
||||
}
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue