mirror of
https://github.com/immich-app/immich.git
synced 2024-12-28 06:31:58 +00: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:
parent
45ba0cc3ac
commit
e8da6604c9
28 changed files with 66 additions and 46 deletions
|
@ -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);
|
||||
}
|
||||
|
|
|
@ -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,
|
||||
|
|
|
@ -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",
|
||||
|
|
|
@ -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(
|
||||
|
|
|
@ -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)
|
||||
|
|
|
@ -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(),
|
||||
|
|
|
@ -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,
|
||||
|
|
|
@ -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);
|
||||
|
|
|
@ -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: () {
|
||||
|
|
|
@ -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),
|
||||
],
|
||||
);
|
||||
}
|
||||
|
|
|
@ -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()),
|
||||
|
|
|
@ -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(
|
||||
|
|
|
@ -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",
|
||||
|
|
|
@ -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(),
|
||||
),
|
||||
|
|
|
@ -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(
|
||||
|
|
|
@ -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),
|
||||
|
|
|
@ -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();
|
||||
|
|
|
@ -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",
|
||||
|
|
|
@ -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,
|
||||
|
|
|
@ -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(
|
||||
|
|
|
@ -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,
|
||||
|
|
|
@ -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)}';
|
||||
|
||||
|
|
|
@ -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
|
||||
|
|
|
@ -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,
|
||||
|
|
|
@ -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(),
|
||||
),
|
||||
|
|
|
@ -33,7 +33,7 @@ class BackgroundBackupSettings extends ConsumerWidget {
|
|||
),
|
||||
backgroundColor: Colors.red,
|
||||
);
|
||||
ScaffoldMessenger.of(context).showSnackBar(snackBar);
|
||||
context.scaffoldMessenger.showSnackBar(snackBar);
|
||||
}
|
||||
|
||||
void showBatteryOptimizationInfoToUser() {
|
||||
|
|
|
@ -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) {
|
||||
|
|
|
@ -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",
|
||||
|
|
Loading…
Reference in a new issue