[Feature] Replace go_router with auto_route

This commit is contained in:
PartyDonut 2024-10-05 16:29:51 +02:00
parent b31cc86ae8
commit 144c8faf70
42 changed files with 1181 additions and 980 deletions

View file

@ -1,11 +1,11 @@
import 'package:flutter/foundation.dart';
import 'package:flutter/material.dart';
import 'package:auto_route/auto_route.dart';
import 'package:ficonsax/ficonsax.dart';
import 'package:file_picker/file_picker.dart';
import 'package:flutter_gen/gen_l10n/app_localizations.dart';
import 'package:flutter_riverpod/flutter_riverpod.dart';
import 'package:go_router/go_router.dart';
import 'package:fladder/models/settings/home_settings_model.dart';
import 'package:fladder/providers/settings/client_settings_provider.dart';
@ -13,7 +13,7 @@ import 'package:fladder/providers/settings/home_settings_provider.dart';
import 'package:fladder/providers/shared_provider.dart';
import 'package:fladder/providers/sync_provider.dart';
import 'package:fladder/providers/user_provider.dart';
import 'package:fladder/routes/build_routes/route_builder.dart';
import 'package:fladder/routes/auto_router.gr.dart';
import 'package:fladder/screens/settings/settings_list_tile.dart';
import 'package:fladder/screens/settings/settings_scaffold.dart';
import 'package:fladder/screens/settings/widgets/settings_label_divider.dart';
@ -30,6 +30,7 @@ import 'package:fladder/util/theme_mode_extension.dart';
import 'package:fladder/widgets/shared/enum_selection.dart';
import 'package:fladder/widgets/shared/fladder_slider.dart';
@RoutePage()
class ClientSettingsPage extends ConsumerStatefulWidget {
const ClientSettingsPage({super.key});
@ -38,16 +39,17 @@ class ClientSettingsPage extends ConsumerStatefulWidget {
}
class _ClientSettingsPageState extends ConsumerState<ClientSettingsPage> {
late final nextUpDaysEditor =
TextEditingController(text: ref.read(clientSettingsProvider.select((value) => value.nextUpDateCutoff?.inDays ?? 14)).toString());
late final nextUpDaysEditor = TextEditingController(
text: ref.read(clientSettingsProvider.select((value) => value.nextUpDateCutoff?.inDays ?? 14)).toString());
late final libraryPageSizeController =
TextEditingController(text: ref.read(clientSettingsProvider.select((value) => value.libraryPageSize))?.toString() ?? "");
late final libraryPageSizeController = TextEditingController(
text: ref.read(clientSettingsProvider.select((value) => value.libraryPageSize))?.toString() ?? "");
@override
Widget build(BuildContext context) {
final clientSettings = ref.watch(clientSettingsProvider);
final showBackground = AdaptiveLayout.of(context).layout != LayoutState.phone && AdaptiveLayout.of(context).size != ScreenLayout.single;
final showBackground = AdaptiveLayout.of(context).layout != LayoutState.phone &&
AdaptiveLayout.of(context).size != ScreenLayout.single;
final currentFolder = ref.watch(syncProvider.notifier).savePath;
Locale currentLocale = WidgetsBinding.instance.platformDispatcher.locale;
@ -72,8 +74,8 @@ class _ClientSettingsPageState extends ConsumerState<ClientSettingsPage> {
actions: [
ElevatedButton(
onPressed: () async {
String? selectedDirectory = await FilePicker.platform
.getDirectoryPath(dialogTitle: context.localized.pathEditSelect, initialDirectory: currentFolder);
String? selectedDirectory = await FilePicker.platform.getDirectoryPath(
dialogTitle: context.localized.pathEditSelect, initialDirectory: currentFolder);
if (selectedDirectory != null) {
ref.read(clientSettingsProvider.notifier).setSyncPath(selectedDirectory);
}
@ -85,8 +87,8 @@ class _ClientSettingsPageState extends ConsumerState<ClientSettingsPage> {
),
)
: () async {
String? selectedDirectory = await FilePicker.platform
.getDirectoryPath(dialogTitle: context.localized.pathEditSelect, initialDirectory: currentFolder);
String? selectedDirectory = await FilePicker.platform.getDirectoryPath(
dialogTitle: context.localized.pathEditSelect, initialDirectory: currentFolder);
if (selectedDirectory != null) {
ref.read(clientSettingsProvider.notifier).setSyncPath(selectedDirectory);
}
@ -131,10 +133,10 @@ class _ClientSettingsPageState extends ConsumerState<ClientSettingsPage> {
(context) async {
await ref.read(syncProvider.notifier).clear();
setState(() {});
context.pop();
context.router.maybePop();
},
context.localized.clear,
(context) => context.pop(),
(context) => context.router.maybePop(),
context.localized.cancel,
);
},
@ -155,9 +157,9 @@ class _ClientSettingsPageState extends ConsumerState<ClientSettingsPage> {
initialValue: clientSettings.timeOut ?? const Duration(),
);
ref
.read(clientSettingsProvider.notifier)
.setTimeOut(timePicker != null ? Duration(minutes: timePicker.inMinutes, seconds: timePicker.inSeconds % 60) : null);
ref.read(clientSettingsProvider.notifier).setTimeOut(timePicker != null
? Duration(minutes: timePicker.inMinutes, seconds: timePicker.inSeconds % 60)
: null);
},
),
const Divider(),
@ -176,7 +178,9 @@ class _ClientSettingsPageState extends ConsumerState<ClientSettingsPage> {
(entry) => PopupMenuItem(
value: entry,
child: Text(entry.label(context)),
onTap: () => ref.read(homeSettingsProvider.notifier).update((context) => context.copyWith(carouselSettings: entry)),
onTap: () => ref
.read(homeSettingsProvider.notifier)
.update((context) => context.copyWith(carouselSettings: entry)),
),
)
.toList(),
@ -196,7 +200,8 @@ class _ClientSettingsPageState extends ConsumerState<ClientSettingsPage> {
(entry) => PopupMenuItem(
value: entry,
child: Text(entry.label(context)),
onTap: () => ref.read(homeSettingsProvider.notifier).update((context) => context.copyWith(nextUp: entry)),
onTap: () =>
ref.read(homeSettingsProvider.notifier).update((context) => context.copyWith(nextUp: entry)),
),
)
.toList(),
@ -223,7 +228,9 @@ class _ClientSettingsPageState extends ConsumerState<ClientSettingsPage> {
fontWeight: currentLocale.languageCode == entry.languageCode ? FontWeight.bold : null,
),
),
onTap: () => ref.read(clientSettingsProvider.notifier).update((state) => state.copyWith(selectedLocale: entry)),
onTap: () => ref
.read(clientSettingsProvider.notifier)
.update((state) => state.copyWith(selectedLocale: entry)),
),
)
];
@ -233,7 +240,8 @@ class _ClientSettingsPageState extends ConsumerState<ClientSettingsPage> {
SettingsListTile(
label: Text(context.localized.settingsBlurredPlaceholderTitle),
subLabel: Text(context.localized.settingsBlurredPlaceholderDesc),
onTap: () => ref.read(clientSettingsProvider.notifier).setBlurPlaceholders(!clientSettings.blurPlaceHolders),
onTap: () =>
ref.read(clientSettingsProvider.notifier).setBlurPlaceholders(!clientSettings.blurPlaceHolders),
trailing: Switch(
value: clientSettings.blurPlaceHolders,
onChanged: (value) => ref.read(clientSettingsProvider.notifier).setBlurPlaceholders(value),
@ -242,7 +250,8 @@ class _ClientSettingsPageState extends ConsumerState<ClientSettingsPage> {
SettingsListTile(
label: Text(context.localized.settingsBlurEpisodesTitle),
subLabel: Text(context.localized.settingsBlurEpisodesDesc),
onTap: () => ref.read(clientSettingsProvider.notifier).setBlurEpisodes(!clientSettings.blurUpcomingEpisodes),
onTap: () =>
ref.read(clientSettingsProvider.notifier).setBlurEpisodes(!clientSettings.blurUpcomingEpisodes),
trailing: Switch(
value: clientSettings.blurUpcomingEpisodes,
onChanged: (value) => ref.read(clientSettingsProvider.notifier).setBlurEpisodes(value),
@ -286,8 +295,9 @@ class _ClientSettingsPageState extends ConsumerState<ClientSettingsPage> {
)),
),
SettingsListTile(
label: Text(
AdaptiveLayout.of(context).isDesktop ? context.localized.settingsShowScaleSlider : context.localized.settingsPosterPinch),
label: Text(AdaptiveLayout.of(context).isDesktop
? context.localized.settingsShowScaleSlider
: context.localized.settingsPosterPinch),
onTap: () => ref.read(clientSettingsProvider.notifier).update(
(current) => current.copyWith(pinchPosterZoom: !current.pinchPosterZoom),
),
@ -314,7 +324,9 @@ class _ClientSettingsPageState extends ConsumerState<ClientSettingsPage> {
max: 1.5,
value: clientSettings.posterSize,
divisions: 20,
onChanged: (value) => ref.read(clientSettingsProvider.notifier).update((current) => current.copyWith(posterSize: value)),
onChanged: (value) => ref
.read(clientSettingsProvider.notifier)
.update((current) => current.copyWith(posterSize: value)),
),
),
const Divider(),
@ -439,14 +451,14 @@ class _ClientSettingsPageState extends ConsumerState<ClientSettingsPage> {
mainAxisSize: MainAxisSize.min,
children: [
FilledButton(
onPressed: () => context.pop(),
onPressed: () => context.router.maybePop(),
child: Text(context.localized.cancel),
),
const SizedBox(width: 8),
ElevatedButton(
onPressed: () async {
await ref.read(sharedPreferencesProvider).clear();
context.routeGo(LoginRoute());
context.router.push(const LoginRoute());
},
child: Text(context.localized.clear),
)

View file

@ -1,3 +1,4 @@
import 'package:auto_route/auto_route.dart';
import 'package:fladder/providers/settings/video_player_settings_provider.dart';
import 'package:fladder/screens/settings/settings_list_tile.dart';
import 'package:fladder/screens/settings/settings_scaffold.dart';
@ -14,6 +15,7 @@ import 'package:flutter/material.dart';
import 'package:flutter_riverpod/flutter_riverpod.dart';
import 'dart:io' show Platform;
@RoutePage()
class PlayerSettingsPage extends ConsumerStatefulWidget {
const PlayerSettingsPage({super.key});

View file

@ -1,3 +1,4 @@
import 'package:auto_route/auto_route.dart';
import 'package:fladder/providers/user_provider.dart';
import 'package:fladder/screens/settings/settings_list_tile.dart';
import 'package:fladder/screens/settings/settings_scaffold.dart';
@ -8,6 +9,7 @@ import 'package:fladder/util/localization_helper.dart';
import 'package:flutter/material.dart';
import 'package:flutter_riverpod/flutter_riverpod.dart';
@RoutePage()
class SecuritySettingsPage extends ConsumerStatefulWidget {
const SecuritySettingsPage({super.key});

View file

@ -1,8 +1,10 @@
import 'package:flutter/material.dart';
import 'package:flutter_riverpod/flutter_riverpod.dart';
import 'package:fladder/providers/user_provider.dart';
import 'package:fladder/screens/shared/user_icon.dart';
import 'package:fladder/util/adaptive_layout.dart';
import 'package:flutter/material.dart';
import 'package:flutter_riverpod/flutter_riverpod.dart';
class SettingsScaffold extends ConsumerWidget {
final String label;
@ -36,7 +38,6 @@ class SettingsScaffold extends ConsumerWidget {
slivers: [
if (AdaptiveLayout.of(context).size == ScreenLayout.single)
SliverAppBar.large(
titleSpacing: 20,
backgroundColor: Theme.of(context).scaffoldBackgroundColor,
flexibleSpace: FlexibleSpaceBar(
titlePadding: const EdgeInsets.symmetric(horizontal: 16, vertical: 16)
@ -54,10 +55,10 @@ class SettingsScaffold extends ConsumerWidget {
))
],
),
expandedTitleScale: 2,
expandedTitleScale: 1.2,
),
expandedHeight: 175,
collapsedHeight: 100,
expandedHeight: 100,
collapsedHeight: 80,
pinned: false,
floating: true,
)

View file

@ -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(),
),
);
},
);
},
),
),
);
}