1
0
mirror of https://github.com/immich-app/immich.git synced 2024-12-25 10:43:13 +02:00

refactor(mobile): refactor to use context helpers for consistency (#14235)

refactor to use context helpers for consistency

Co-authored-by: dvbthien <dvbthien@gmail.com>
This commit is contained in:
dvbthien 2024-11-21 22:35:58 +07:00 committed by GitHub
parent 45ba0cc3ac
commit e8da6604c9
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
28 changed files with 66 additions and 46 deletions

View File

@ -4,6 +4,9 @@ extension ContextHelper on BuildContext {
// Returns the current padding from MediaQuery
EdgeInsets get padding => MediaQuery.paddingOf(this);
// Returns the current view insets from MediaQuery
EdgeInsets get viewInsets => MediaQuery.viewInsetsOf(this);
// Returns the current width from MediaQuery
double get width => MediaQuery.sizeOf(this).width;
@ -13,6 +16,15 @@ extension ContextHelper on BuildContext {
// Returns true if the app is running on a mobile device (!tablets)
bool get isMobile => width < 550;
// Returns the current device pixel ratio from MediaQuery
double get devicePixelRatio => MediaQuery.devicePixelRatioOf(this);
// Returns the current orientation from MediaQuery
Orientation get orientation => MediaQuery.orientationOf(this);
// Returns the current platform brightness from MediaQuery
Brightness get platformBrightness => MediaQuery.platformBrightnessOf(this);
// Returns the current ThemeData
ThemeData get themeData => Theme.of(this);
@ -31,6 +43,15 @@ extension ContextHelper on BuildContext {
// Current ColorScheme used
ColorScheme get colorScheme => themeData.colorScheme;
// Navigate by pushing or popping routes from the current context
NavigatorState get navigator => Navigator.of(this);
// Showing material banners from the current context
ScaffoldMessengerState get scaffoldMessenger => ScaffoldMessenger.of(this);
// Pop-out from the current context with optional result
void pop<T>([T? result]) => Navigator.of(this).pop(result);
// Managing focus within the widget tree from the current context
FocusScopeNode get focusScope => FocusScope.of(this);
}

View File

@ -243,7 +243,7 @@ class AlbumViewerPage extends HookConsumerWidget {
AnimatedPositioned(
duration: const Duration(milliseconds: 300),
top: ref.watch(multiselectProvider)
? -(kToolbarHeight + MediaQuery.of(context).padding.top)
? -(kToolbarHeight + context.padding.top)
: 0,
left: 0,
right: 0,

View File

@ -37,7 +37,7 @@ class AppLogDetailPage extends HookConsumerWidget {
IconButton(
onPressed: () {
Clipboard.setData(ClipboardData(text: text)).then((_) {
ScaffoldMessenger.of(context).showSnackBar(
context.scaffoldMessenger.showSnackBar(
SnackBar(
content: Text(
"Copied to clipboard",

View File

@ -97,7 +97,7 @@ class DownloadTaskTile extends StatelessWidget {
return SizedBox(
key: const ValueKey('download_progress'),
width: MediaQuery.of(context).size.width - 32,
width: context.width - 32,
child: Card(
clipBehavior: Clip.antiAlias,
shape: RoundedRectangleBorder(

View File

@ -141,7 +141,7 @@ class GalleryViewerPage extends HookConsumerWidget {
heightFactor: 0.75,
child: Padding(
padding: EdgeInsets.only(
bottom: MediaQuery.viewInsetsOf(context).bottom,
bottom: context.viewInsets.bottom,
),
child: ref
.watch(appSettingsServiceProvider)

View File

@ -1,4 +1,5 @@
import 'package:flutter/material.dart';
import 'package:immich_mobile/extensions/build_context_extensions.dart';
class LargeLeadingTile extends StatelessWidget {
const LargeLeadingTile({
@ -37,7 +38,7 @@ class LargeLeadingTile extends StatelessWidget {
crossAxisAlignment: CrossAxisAlignment.start,
children: [
SizedBox(
width: MediaQuery.of(context).size.width * 0.6,
width: context.width * 0.6,
child: title,
),
subtitle ?? const SizedBox.shrink(),

View File

@ -2,6 +2,7 @@ import 'package:flutter/material.dart';
import 'package:flutter_hooks/flutter_hooks.dart';
import 'package:hooks_riverpod/hooks_riverpod.dart';
import 'package:immich_mobile/entities/asset.entity.dart';
import 'package:immich_mobile/extensions/build_context_extensions.dart';
import 'package:immich_mobile/providers/asset_viewer/show_controls.provider.dart';
import 'package:immich_mobile/providers/asset_viewer/video_player_controller_provider.dart';
import 'package:immich_mobile/providers/asset_viewer/video_player_controls_provider.dart';
@ -120,8 +121,6 @@ class VideoViewerPage extends HookConsumerWidget {
[controller],
);
final size = MediaQuery.sizeOf(context);
return PopScope(
onPopInvokedWithResult: (didPop, _) {
ref.read(videoPlaybackValueProvider.notifier).value =
@ -148,8 +147,8 @@ class VideoViewerPage extends HookConsumerWidget {
),
if (controller != null)
SizedBox(
height: size.height,
width: size.width,
height: context.height,
width: context.width,
child: VideoPlayerViewer(
controller: controller,
isMotionVideo: isMotionVideo,

View File

@ -92,7 +92,7 @@ class CropImagePage extends HookWidget {
IconButton(
icon: Icon(
Icons.rotate_left,
color: Theme.of(context).iconTheme.color,
color: context.themeData.iconTheme.color,
),
onPressed: () {
cropController.rotateLeft();
@ -101,7 +101,7 @@ class CropImagePage extends HookWidget {
IconButton(
icon: Icon(
Icons.rotate_right,
color: Theme.of(context).iconTheme.color,
color: context.themeData.iconTheme.color,
),
onPressed: () {
cropController.rotateRight();
@ -203,7 +203,7 @@ class _AspectRatioButton extends StatelessWidget {
iconData,
color: aspectRatio.value == ratio
? context.primaryColor
: Theme.of(context).iconTheme.color,
: context.themeData.iconTheme.color,
),
onPressed: () {
cropController.crop = const Rect.fromLTRB(0.1, 0.1, 0.9, 0.9);

View File

@ -70,7 +70,7 @@ class EditImagePage extends ConsumerWidget {
title: "${p.withoutExtension(asset.fileName)}_edited.jpg",
);
await ref.read(albumProvider.notifier).refreshDeviceAlbums();
Navigator.of(context).popUntil((route) => route.isFirst);
context.navigator.popUntil((route) => route.isFirst);
ImmichToast.show(
durationInSecond: 3,
context: context,
@ -99,8 +99,7 @@ class EditImagePage extends ConsumerWidget {
color: context.primaryColor,
size: 24,
),
onPressed: () =>
Navigator.of(context).popUntil((route) => route.isFirst),
onPressed: () => context.navigator.popUntil((route) => route.isFirst),
),
actions: <Widget>[
TextButton(
@ -120,8 +119,8 @@ class EditImagePage extends ConsumerWidget {
body: Center(
child: ConstrainedBox(
constraints: BoxConstraints(
maxHeight: MediaQuery.of(context).size.height * 0.7,
maxWidth: MediaQuery.of(context).size.width * 0.9,
maxHeight: context.height * 0.7,
maxWidth: context.width * 0.9,
),
child: Container(
decoration: BoxDecoration(
@ -161,7 +160,7 @@ class EditImagePage extends ConsumerWidget {
IconButton(
icon: Icon(
Icons.crop_rotate_rounded,
color: Theme.of(context).iconTheme.color,
color: context.themeData.iconTheme.color,
size: 25,
),
onPressed: () {
@ -179,7 +178,7 @@ class EditImagePage extends ConsumerWidget {
IconButton(
icon: Icon(
Icons.filter,
color: Theme.of(context).iconTheme.color,
color: context.themeData.iconTheme.color,
size: 25,
),
onPressed: () {

View File

@ -104,7 +104,7 @@ class FilterImagePage extends HookWidget {
body: Column(
children: [
SizedBox(
height: MediaQuery.of(context).size.height * 0.7,
height: context.height * 0.7,
child: Center(
child: ColorFiltered(
colorFilter: colorFilter.value,
@ -180,7 +180,7 @@ class _FilterButton extends StatelessWidget {
),
),
const SizedBox(height: 10),
Text(label, style: Theme.of(context).textTheme.bodyMedium),
Text(label, style: context.themeData.textTheme.bodyMedium),
],
);
}

View File

@ -202,7 +202,7 @@ class PeopleCollectionCard extends ConsumerWidget {
builder: (context, constraints) {
final isTablet = constraints.maxWidth > 600;
final widthFactor = isTablet ? 0.25 : 0.5;
final size = MediaQuery.of(context).size.width * widthFactor - 20.0;
final size = context.width * widthFactor - 20.0;
return GestureDetector(
onTap: () => context.pushRoute(const PeopleCollectionRoute()),
@ -272,7 +272,7 @@ class LocalAlbumsCollectionCard extends HookConsumerWidget {
builder: (context, constraints) {
final isTablet = constraints.maxWidth > 600;
final widthFactor = isTablet ? 0.25 : 0.5;
final size = MediaQuery.of(context).size.width * widthFactor - 20.0;
final size = context.width * widthFactor - 20.0;
return GestureDetector(
onTap: () => context.pushRoute(
@ -335,7 +335,7 @@ class PlacesCollectionCard extends StatelessWidget {
builder: (context, constraints) {
final isTablet = constraints.maxWidth > 600;
final widthFactor = isTablet ? 0.25 : 0.5;
final size = MediaQuery.of(context).size.width * widthFactor - 20.0;
final size = context.width * widthFactor - 20.0;
return GestureDetector(
onTap: () => context.pushRoute(const PlacesCollectionRoute()),

View File

@ -32,8 +32,7 @@ class PeopleCollectionPage extends HookConsumerWidget {
return LayoutBuilder(
builder: (context, constraints) {
final isTablet = constraints.maxWidth > 600;
final isPortrait =
MediaQuery.of(context).orientation == Orientation.portrait;
final isPortrait = context.orientation == Orientation.portrait;
return Scaffold(
appBar: AppBar(

View File

@ -279,7 +279,7 @@ class SharedLinkEditPage extends HookConsumerWidget {
void copyLinkToClipboard() {
Clipboard.setData(ClipboardData(text: newShareLink.value)).then((_) {
ScaffoldMessenger.of(context).showSnackBar(
context.scaffoldMessenger.showSnackBar(
SnackBar(
content: Text(
"shared_link_clipboard_copied_massage",

View File

@ -110,12 +110,12 @@ class PhotosPage extends HookConsumerWidget {
AnimatedPositioned(
duration: const Duration(milliseconds: 300),
top: ref.watch(multiselectProvider)
? -(kToolbarHeight + MediaQuery.of(context).padding.top)
? -(kToolbarHeight + context.padding.top)
: 0,
left: 0,
right: 0,
child: Container(
height: kToolbarHeight + MediaQuery.of(context).padding.top,
height: kToolbarHeight + context.padding.top,
color: context.themeData.appBarTheme.backgroundColor,
child: const ImmichAppBar(),
),

View File

@ -305,7 +305,7 @@ class MapPage extends HookConsumerWidget {
),
Positioned(
right: 0,
bottom: MediaQuery.paddingOf(context).bottom + 16,
bottom: context.padding.bottom + 16,
child: ElevatedButton(
onPressed: onZoomToLocation,
style: ElevatedButton.styleFrom(

View File

@ -196,7 +196,7 @@ class SearchPage extends HookConsumerWidget {
padding: const EdgeInsets.symmetric(vertical: 16.0),
child: Container(
padding: EdgeInsets.only(
bottom: MediaQuery.of(context).viewInsets.bottom,
bottom: context.viewInsets.bottom,
),
child: Padding(
padding: const EdgeInsets.symmetric(horizontal: 16.0),

View File

@ -49,7 +49,7 @@ class AlbumViewerEditableTitle extends HookConsumerWidget {
style: context.textTheme.headlineMedium,
controller: titleTextEditController,
onTap: () {
FocusScope.of(context).requestFocus(titleFocusNode);
context.focusScope.requestFocus(titleFocusNode);
ref.watch(albumViewerProvider.notifier).setEditTitleText(album.name);
ref.watch(albumViewerProvider.notifier).enableEditAlbum();

View File

@ -54,7 +54,7 @@ class AdvancedBottomSheet extends HookConsumerWidget {
text: assetDetail.toString(),
),
).then((_) {
ScaffoldMessenger.of(context).showSnackBar(
context.scaffoldMessenger.showSnackBar(
SnackBar(
content: Text(
"Copied to clipboard",

View File

@ -188,7 +188,7 @@ class BottomGalleryBar extends ConsumerWidget {
void handleEdit() async {
final image = Image(image: ImmichImage.imageProvider(asset: asset));
Navigator.of(context).push(
context.navigator.push(
MaterialPageRoute(
builder: (context) => EditImagePage(
asset: asset,

View File

@ -1,5 +1,6 @@
import 'package:flutter/material.dart';
import 'package:hooks_riverpod/hooks_riverpod.dart';
import 'package:immich_mobile/extensions/build_context_extensions.dart';
import 'package:immich_mobile/widgets/asset_viewer/video_position.dart';
/// The video controls for the [videoPlayerControlsProvider]
@ -8,8 +9,7 @@ class VideoControls extends ConsumerWidget {
@override
Widget build(BuildContext context, WidgetRef ref) {
final isPortrait =
MediaQuery.orientationOf(context) == Orientation.portrait;
final isPortrait = context.orientation == Orientation.portrait;
return isPortrait
? const VideoPosition()
: const Padding(

View File

@ -261,7 +261,7 @@ class ImmichAppBarDialog extends HookConsumerWidget {
return Dismissible(
behavior: HitTestBehavior.translucent,
direction: DismissDirection.down,
onDismissed: (_) => Navigator.of(context).pop(),
onDismissed: (_) => context.pop(),
key: const Key('app_bar_dialog'),
child: Dialog(
clipBehavior: Clip.hardEdge,

View File

@ -5,6 +5,7 @@ import 'package:flutter/material.dart';
import 'package:hooks_riverpod/hooks_riverpod.dart';
import 'package:immich_mobile/entities/store.entity.dart';
import 'package:immich_mobile/entities/user.entity.dart';
import 'package:immich_mobile/extensions/build_context_extensions.dart';
import 'package:immich_mobile/services/api.service.dart';
import 'package:immich_mobile/widgets/common/transparent_image.dart';
@ -23,7 +24,7 @@ class UserCircleAvatar extends ConsumerWidget {
@override
Widget build(BuildContext context, WidgetRef ref) {
bool isDarkTheme = Theme.of(context).brightness == Brightness.dark;
bool isDarkTheme = context.themeData.brightness == Brightness.dark;
final profileImageUrl =
'${Store.get(StoreKey.serverEndpoint)}/users/${user.id}/profile-image?d=${Random().nextInt(1024)}';

View File

@ -19,7 +19,7 @@ class MapAppBar extends HookWidget implements PreferredSizeWidget {
@override
Widget build(BuildContext context) {
return Padding(
padding: EdgeInsets.only(top: MediaQuery.paddingOf(context).top + 25),
padding: EdgeInsets.only(top: context.padding.top + 25),
child: ValueListenableBuilder(
valueListenable: selectedAssets,
builder: (ctx, value, child) => value.isNotEmpty

View File

@ -26,7 +26,7 @@ class PositionedAssetMarkerIcon extends StatelessWidget {
@override
Widget build(BuildContext context) {
final ratio = Platform.isIOS ? 1.0 : MediaQuery.devicePixelRatioOf(context);
final ratio = Platform.isIOS ? 1.0 : context.devicePixelRatio;
return AnimatedPositioned(
left: point.x / ratio - size / 2,
top: point.y / ratio - size,

View File

@ -47,7 +47,7 @@ class FilterBottomSheetScaffold extends StatelessWidget {
OutlinedButton(
onPressed: () {
onClear();
Navigator.of(context).pop();
context.pop();
},
child: const Text('action_common_clear').tr(),
),
@ -55,7 +55,7 @@ class FilterBottomSheetScaffold extends StatelessWidget {
ElevatedButton(
onPressed: () {
onSearch();
Navigator.of(context).pop();
context.pop();
},
child: const Text('search_filter_apply').tr(),
),

View File

@ -33,7 +33,7 @@ class BackgroundBackupSettings extends ConsumerWidget {
),
backgroundColor: Colors.red,
);
ScaffoldMessenger.of(context).showSnackBar(snackBar);
context.scaffoldMessenger.showSnackBar(snackBar);
}
void showBatteryOptimizationInfoToUser() {

View File

@ -2,6 +2,7 @@ import 'package:easy_localization/easy_localization.dart';
import 'package:flutter/material.dart';
import 'package:flutter_hooks/flutter_hooks.dart';
import 'package:hooks_riverpod/hooks_riverpod.dart';
import 'package:immich_mobile/extensions/build_context_extensions.dart';
import 'package:immich_mobile/services/app_settings.service.dart';
import 'package:immich_mobile/widgets/settings/preference_settings/primary_color_setting.dart';
import 'package:immich_mobile/widgets/settings/settings_sub_title.dart';
@ -58,8 +59,7 @@ class ThemeSetting extends HookConsumerWidget {
isSystemTheme.value = true;
ref.watch(immichThemeModeProvider.notifier).state = ThemeMode.system;
} else {
final currentSystemBrightness =
MediaQuery.platformBrightnessOf(context);
final currentSystemBrightness = context.platformBrightness;
isSystemTheme.value = false;
isDarkTheme.value = currentSystemBrightness == Brightness.dark;
if (currentSystemBrightness == Brightness.light) {

View File

@ -94,7 +94,7 @@ class SharedLinkItem extends ConsumerWidget {
Clipboard.setData(
ClipboardData(text: "${serverUrl}share/${sharedLink.key}"),
).then((_) {
ScaffoldMessenger.of(context).showSnackBar(
context.scaffoldMessenger.showSnackBar(
SnackBar(
content: Text(
"shared_link_clipboard_copied_massage",