refactor(mobile): build context extensions (#4923)

* refactor: move all extensions to separate package * refactor(mobile): add BuildContext extension * refactor(mobile): use theme getters from context * refactor(mobile): use media query size from context * refactor(mobile): use auto router methods from context * refactor(mobile): use navigator methods from context --------- Co-authored-by: shalong-tanwen <139912620+shalong-tanwen@users.noreply.github.com>
2025-12-17 01:11:13 +03:00 · 2023-11-09 16:19:53 +00:00
parent a147dee4b6
commit bffc2cdf60
106 changed files with 660 additions and 628 deletions
--- a/mobile/lib/modules/backup/ui/album_info_card.dart
+++ b/mobile/lib/modules/backup/ui/album_info_card.dart
@@ -1,9 +1,9 @@
-import 'package:auto_route/auto_route.dart';
 import 'package:easy_localization/easy_localization.dart';
 import 'package:flutter/material.dart';
 import 'package:flutter/services.dart';
 import 'package:fluttertoast/fluttertoast.dart';
 import 'package:hooks_riverpod/hooks_riverpod.dart';
+import 'package:immich_mobile/extensions/build_context_extensions.dart';
 import 'package:immich_mobile/modules/backup/models/available_album.model.dart';
 import 'package:immich_mobile/modules/backup/providers/backup.provider.dart';
 import 'package:immich_mobile/routing/router.dart';
@@ -22,10 +22,10 @@ class AlbumInfoCard extends HookConsumerWidget {
        ref.watch(backupProvider).selectedBackupAlbums.contains(albumInfo);
    final bool isExcluded =
        ref.watch(backupProvider).excludedBackupAlbums.contains(albumInfo);
-    final isDarkTheme = Theme.of(context).brightness == Brightness.dark;
+    final isDarkTheme = context.isDarkTheme;

    ColorFilter selectedFilter = ColorFilter.mode(
-      Theme.of(context).primaryColor.withAlpha(100),
+      context.primaryColor.withAlpha(100),
      BlendMode.darken,
    );
    ColorFilter excludedFilter =
@@ -46,7 +46,7 @@ class AlbumInfoCard extends HookConsumerWidget {
              fontWeight: FontWeight.bold,
            ),
          ).tr(),
-          backgroundColor: Theme.of(context).primaryColor,
+          backgroundColor: context.primaryColor,
        );
      } else if (isExcluded) {
        return Chip(
@@ -194,7 +194,7 @@ class AlbumInfoCard extends HookConsumerWidget {
                          albumInfo.name,
                          style: TextStyle(
                            fontSize: 14,
-                            color: Theme.of(context).primaryColor,
+                            color: context.primaryColor,
                            fontWeight: FontWeight.bold,
                          ),
                        ),
@@ -224,13 +224,13 @@ class AlbumInfoCard extends HookConsumerWidget {
                  ),
                  IconButton(
                    onPressed: () {
-                      AutoRouter.of(context).push(
+                      context.autoPush(
                        AlbumPreviewRoute(album: albumInfo.albumEntity),
                      );
                    },
                    icon: Icon(
                      Icons.image_outlined,
-                      color: Theme.of(context).primaryColor,
+                      color: context.primaryColor,
                      size: 24,
                    ),
                    splashRadius: 25,
--- a/mobile/lib/modules/backup/ui/album_info_list_tile.dart
+++ b/mobile/lib/modules/backup/ui/album_info_list_tile.dart
@@ -1,10 +1,10 @@
-import 'package:auto_route/auto_route.dart';
 import 'package:easy_localization/easy_localization.dart';
 import 'package:flutter/material.dart';
 import 'package:flutter/services.dart';
 import 'package:flutter_hooks/flutter_hooks.dart';
 import 'package:fluttertoast/fluttertoast.dart';
 import 'package:hooks_riverpod/hooks_riverpod.dart';
+import 'package:immich_mobile/extensions/build_context_extensions.dart';
 import 'package:immich_mobile/modules/backup/models/available_album.model.dart';
 import 'package:immich_mobile/modules/backup/providers/backup.provider.dart';
 import 'package:immich_mobile/routing/router.dart';
@@ -25,14 +25,13 @@ class AlbumInfoListTile extends HookConsumerWidget {
        ref.watch(backupProvider).excludedBackupAlbums.contains(albumInfo);

    ColorFilter selectedFilter = ColorFilter.mode(
-      Theme.of(context).primaryColor.withAlpha(100),
+      context.primaryColor.withAlpha(100),
      BlendMode.darken,
    );
    ColorFilter excludedFilter =
        ColorFilter.mode(Colors.red.withAlpha(75), BlendMode.darken);
    ColorFilter unselectedFilter =
        const ColorFilter.mode(Colors.black, BlendMode.color);
-    var isDarkTheme = Theme.of(context).brightness == Brightness.dark;

    var assetCount = useState(0);

@@ -56,11 +55,11 @@ class AlbumInfoListTile extends HookConsumerWidget {

    buildTileColor() {
      if (isSelected) {
-        return isDarkTheme
-            ? Theme.of(context).primaryColor.withAlpha(100)
-            : Theme.of(context).primaryColor.withAlpha(25);
+        return context.isDarkTheme
+            ? context.primaryColor.withAlpha(100)
+            : context.primaryColor.withAlpha(25);
      } else if (isExcluded) {
-        return isDarkTheme
+        return context.isDarkTheme
            ? Colors.red[300]?.withAlpha(150)
            : Colors.red[100]?.withAlpha(150);
      } else {
@@ -159,13 +158,13 @@ class AlbumInfoListTile extends HookConsumerWidget {
        subtitle: Text(assetCount.value.toString()),
        trailing: IconButton(
          onPressed: () {
-            AutoRouter.of(context).push(
+            context.autoPush(
              AlbumPreviewRoute(album: albumInfo.albumEntity),
            );
          },
          icon: Icon(
            Icons.image_outlined,
-            color: Theme.of(context).primaryColor,
+            color: context.primaryColor,
            size: 24,
          ),
          splashRadius: 25,
--- a/mobile/lib/modules/backup/ui/backup_info_card.dart
+++ b/mobile/lib/modules/backup/ui/backup_info_card.dart
@@ -1,5 +1,6 @@
 import 'package:easy_localization/easy_localization.dart';
 import 'package:flutter/material.dart';
+import 'package:immich_mobile/extensions/build_context_extensions.dart';

 class BackupInfoCard extends StatelessWidget {
  final String title;
@@ -14,13 +15,11 @@ class BackupInfoCard extends StatelessWidget {

  @override
  Widget build(BuildContext context) {
-    var isDarkMode = Theme.of(context).brightness == Brightness.dark;
-
    return Card(
      shape: RoundedRectangleBorder(
        borderRadius: BorderRadius.circular(20), // if you need this
        side: BorderSide(
-          color: isDarkMode
+          color: context.isDarkTheme
              ? const Color.fromARGB(255, 56, 56, 56)
              : Colors.black12,
          width: 1,
--- a/mobile/lib/modules/backup/ui/current_backup_asset_info_box.dart
+++ b/mobile/lib/modules/backup/ui/current_backup_asset_info_box.dart
@@ -1,9 +1,9 @@
-import 'package:auto_route/auto_route.dart';
 import 'package:easy_localization/easy_localization.dart';
 import 'package:flutter/foundation.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/modules/backup/models/backup_state.model.dart';
 import 'package:immich_mobile/modules/backup/providers/backup.provider.dart';
 import 'package:immich_mobile/modules/backup/providers/error_backup_list.provider.dart';
@@ -53,7 +53,7 @@ class CurrentUploadingAssetInfoBox extends HookConsumerWidget {
        ),
        backgroundColor: Colors.white,
        onPressed: () {
-          AutoRouter.of(context).push(const FailedBackupStatusRoute());
+          context.autoPush(const FailedBackupStatusRoute());
        },
      );
    }
@@ -61,7 +61,7 @@ class CurrentUploadingAssetInfoBox extends HookConsumerWidget {
    Widget buildAssetInfoTable() {
      return Table(
        border: TableBorder.all(
-          color: Theme.of(context).primaryColorLight,
+          color: context.themeData.primaryColorLight,
          width: 1,
        ),
        children: [
@@ -176,7 +176,7 @@ class CurrentUploadingAssetInfoBox extends HookConsumerWidget {
            onTap: () => isShowThumbnail.value = true,
            child: Icon(
              Icons.image_outlined,
-              color: Theme.of(context).primaryColor,
+              color: context.primaryColor,
              size: 30,
            ),
          ),
@@ -206,7 +206,7 @@ class CurrentUploadingAssetInfoBox extends HookConsumerWidget {
                      minHeight: 10.0,
                      value: uploadProgress / 100.0,
                      backgroundColor: Colors.grey,
-                      color: Theme.of(context).primaryColor,
+                      color: context.primaryColor,
                    ),
                  ),
                  Text(
--- a/mobile/lib/modules/backup/ui/ios_debug_info_tile.dart
+++ b/mobile/lib/modules/backup/ui/ios_debug_info_tile.dart
@@ -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/modules/backup/providers/ios_background_settings.provider.dart';
 import 'package:intl/intl.dart';

@@ -43,7 +44,7 @@ class IosDebugInfoTile extends HookConsumerWidget {
        style: TextStyle(
          fontWeight: FontWeight.bold,
          fontSize: 14,
-          color: Theme.of(context).primaryColor,
+          color: context.primaryColor,
        ),
      ),
      subtitle: Text(
@@ -54,7 +55,7 @@ class IosDebugInfoTile extends HookConsumerWidget {
      ),
      leading: Icon(
        Icons.bug_report,
-        color: Theme.of(context).primaryColor,
+        color: context.primaryColor,
      ),
    );
  }
--- a/mobile/lib/modules/backup/views/album_preview_page.dart
+++ b/mobile/lib/modules/backup/views/album_preview_page.dart
@@ -1,9 +1,9 @@
 import 'dart:typed_data';

-import 'package:auto_route/auto_route.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/shared/ui/immich_loading_indicator.dart';
 import 'package:photo_manager/photo_manager.dart';

@@ -53,7 +53,7 @@ class AlbumPreviewPage extends HookConsumerWidget {
          ],
        ),
        leading: IconButton(
-          onPressed: () => AutoRouter.of(context).pop(),
+          onPressed: () => context.autoPop(),
          icon: const Icon(Icons.arrow_back_ios_new_rounded),
        ),
      ),
--- a/mobile/lib/modules/backup/views/backup_album_selection_page.dart
+++ b/mobile/lib/modules/backup/views/backup_album_selection_page.dart
@@ -1,10 +1,10 @@
-import 'package:auto_route/auto_route.dart';
 import 'package:easy_localization/easy_localization.dart';
 import 'package:flutter/material.dart';
 import 'package:flutter_hooks/flutter_hooks.dart';
 import 'package:fluttertoast/fluttertoast.dart';
 import 'package:hooks_riverpod/hooks_riverpod.dart';
 import 'package:immich_mobile/constants/immich_colors.dart';
+import 'package:immich_mobile/extensions/build_context_extensions.dart';
 import 'package:immich_mobile/modules/backup/providers/backup.provider.dart';
 import 'package:immich_mobile/modules/backup/ui/album_info_card.dart';
 import 'package:immich_mobile/modules/backup/ui/album_info_list_tile.dart';
@@ -18,7 +18,7 @@ class BackupAlbumSelectionPage extends HookConsumerWidget {
    // final availableAlbums = ref.watch(backupProvider).availableAlbums;
    final selectedBackupAlbums = ref.watch(backupProvider).selectedBackupAlbums;
    final excludedBackupAlbums = ref.watch(backupProvider).excludedBackupAlbums;
-    final isDarkTheme = Theme.of(context).brightness == Brightness.dark;
+    final isDarkTheme = context.isDarkTheme;
    final allAlbums = ref.watch(backupProvider).availableAlbums;

    // Albums which are displayed to the user
@@ -118,7 +118,7 @@ class BackupAlbumSelectionPage extends HookConsumerWidget {
                  fontWeight: FontWeight.bold,
                ),
              ),
-              backgroundColor: Theme.of(context).primaryColor,
+              backgroundColor: context.primaryColor,
              deleteIconColor: isDarkTheme ? Colors.black : Colors.white,
              deleteIcon: const Icon(
                Icons.cancel_rounded,
@@ -211,7 +211,7 @@ class BackupAlbumSelectionPage extends HookConsumerWidget {
    return Scaffold(
      appBar: AppBar(
        leading: IconButton(
-          onPressed: () => AutoRouter.of(context).pop(),
+          onPressed: () => context.autoPop(),
          icon: const Icon(Icons.arrow_back_ios_rounded),
        ),
        title: const Text(
@@ -315,7 +315,7 @@ class BackupAlbumSelectionPage extends HookConsumerWidget {
                      "backup_album_selection_page_albums_tap",
                      style: TextStyle(
                        fontSize: 12,
-                        color: Theme.of(context).primaryColor,
+                        color: context.primaryColor,
                        fontWeight: FontWeight.bold,
                      ),
                    ).tr(),
@@ -325,7 +325,7 @@ class BackupAlbumSelectionPage extends HookConsumerWidget {
                    icon: Icon(
                      Icons.info,
                      size: 20,
-                      color: Theme.of(context).primaryColor,
+                      color: context.primaryColor,
                    ),
                    onPressed: () {
                      // show the dialog
@@ -342,7 +342,7 @@ class BackupAlbumSelectionPage extends HookConsumerWidget {
                              style: TextStyle(
                                fontSize: 16,
                                fontWeight: FontWeight.bold,
-                                color: Theme.of(context).primaryColor,
+                                color: context.primaryColor,
                              ),
                            ).tr(),
                            content: SingleChildScrollView(
--- a/mobile/lib/modules/backup/views/backup_controller_page.dart
+++ b/mobile/lib/modules/backup/views/backup_controller_page.dart
@@ -1,11 +1,11 @@
 import 'dart:io';

-import 'package:auto_route/auto_route.dart';
 import 'package:connectivity_plus/connectivity_plus.dart';
 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/modules/backup/background_service/background.service.dart';
 import 'package:immich_mobile/modules/backup/providers/error_backup_list.provider.dart';
 import 'package:immich_mobile/modules/backup/providers/ios_background_settings.provider.dart';
@@ -49,7 +49,6 @@ class BackupControllerPage extends HookConsumerWidget {
            !hasExclusiveAccess
        ? false
        : true;
-    var isDarkMode = Theme.of(context).brightness == Brightness.dark;
    final checkInProgress = useState(false);

    useEffect(
@@ -151,7 +150,7 @@ class BackupControllerPage extends HookConsumerWidget {
      return ListTile(
        leading: Icon(
          Icons.warning_rounded,
-          color: Theme.of(context).primaryColor,
+          color: context.primaryColor,
        ),
        title: const Text(
          "Check for corrupt asset backups",
@@ -187,7 +186,7 @@ class BackupControllerPage extends HookConsumerWidget {
        leading: isAutoBackup
            ? Icon(
                Icons.cloud_done_rounded,
-                color: Theme.of(context).primaryColor,
+                color: context.primaryColor,
              )
            : const Icon(Icons.cloud_off_rounded),
        title: Text(
@@ -266,7 +265,7 @@ class BackupControllerPage extends HookConsumerWidget {
                  style: TextStyle(fontWeight: FontWeight.bold, fontSize: 12),
                ).tr(),
                onPressed: () {
-                  Navigator.of(context).pop();
+                  context.pop();
                },
              ),
            ],
@@ -279,7 +278,7 @@ class BackupControllerPage extends HookConsumerWidget {
      final bool isBackgroundEnabled = backupState.backgroundBackup;
      final bool isWifiRequired = backupState.backupRequireWifi;
      final bool isChargingRequired = backupState.backupRequireCharging;
-      final Color activeColor = Theme.of(context).primaryColor;
+      final Color activeColor = context.primaryColor;

      String formatBackupDelaySliderValue(double v) {
        if (v == 0.0) {
@@ -410,7 +409,7 @@ class BackupControllerPage extends HookConsumerWidget {
                      max: 3.0,
                      divisions: 3,
                      label: formatBackupDelaySliderValue(triggerDelay.value),
-                      activeColor: Theme.of(context).primaryColor,
+                      activeColor: context.primaryColor,
                    ),
                  ),
                ElevatedButton(
@@ -511,7 +510,7 @@ class BackupControllerPage extends HookConsumerWidget {
          child: Text(
            text.trim().substring(0, text.length - 2),
            style: TextStyle(
-              color: Theme.of(context).primaryColor,
+              color: context.primaryColor,
              fontSize: 12,
              fontWeight: FontWeight.bold,
            ),
@@ -523,7 +522,7 @@ class BackupControllerPage extends HookConsumerWidget {
          child: Text(
            "backup_controller_page_none_selected".tr(),
            style: TextStyle(
-              color: Theme.of(context).primaryColor,
+              color: context.primaryColor,
              fontSize: 12,
              fontWeight: FontWeight.bold,
            ),
@@ -562,7 +561,7 @@ class BackupControllerPage extends HookConsumerWidget {
        shape: RoundedRectangleBorder(
          borderRadius: BorderRadius.circular(20),
          side: BorderSide(
-            color: isDarkMode
+            color: context.isDarkTheme
                ? const Color.fromARGB(255, 56, 56, 56)
                : Colors.black12,
            width: 1,
@@ -592,7 +591,7 @@ class BackupControllerPage extends HookConsumerWidget {
          ),
          trailing: ElevatedButton(
            onPressed: () {
-              AutoRouter.of(context).push(const BackupAlbumSelectionRoute());
+              context.autoPush(const BackupAlbumSelectionRoute());
            },
            child: const Text(
              "backup_controller_page_select",
@@ -678,7 +677,7 @@ class BackupControllerPage extends HookConsumerWidget {
        leading: IconButton(
          onPressed: () {
            ref.watch(websocketProvider.notifier).listenUploadEvent();
-            AutoRouter.of(context).pop(true);
+            context.autoPop(true);
          },
          splashRadius: 24,
          icon: const Icon(
--- a/mobile/lib/modules/backup/views/failed_backup_status_page.dart
+++ b/mobile/lib/modules/backup/views/failed_backup_status_page.dart
@@ -1,6 +1,6 @@
-import 'package:auto_route/auto_route.dart';
 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/modules/backup/providers/error_backup_list.provider.dart';
 import 'package:intl/intl.dart';
 import 'package:photo_manager/photo_manager.dart';
@@ -20,7 +20,7 @@ class FailedBackupStatusPage extends HookConsumerWidget {
        ),
        leading: IconButton(
          onPressed: () {
-            AutoRouter.of(context).pop(true);
+            context.autoPop(true);
          },
          splashRadius: 24,
          icon: const Icon(
@@ -114,7 +114,7 @@ class FailedBackupStatusPage extends HookConsumerWidget {
                              style: TextStyle(
                                fontWeight: FontWeight.bold,
                                fontSize: 12,
-                                color: Theme.of(context).primaryColor,
+                                color: context.primaryColor,
                              ),
                            ),
                          ),