From c360781565d0f14d07a590ea302753e3732b84b9 Mon Sep 17 00:00:00 2001 From: Yaros Date: Tue, 9 Dec 2025 16:03:29 +0100 Subject: [PATCH 1/5] fix(mobile): fix overflow text in backup card (#24448) * fix(mobile): fix overflow text in backup card * refactor: use intrinsicheight * chore: fix spelling of entitycounttile --- .../beta_sync_settings/entity_count_tile.dart | 57 +++---- .../sync_status_and_actions.dart | 158 ++++++++++-------- 2 files changed, 113 insertions(+), 102 deletions(-) diff --git a/mobile/lib/widgets/settings/beta_sync_settings/entity_count_tile.dart b/mobile/lib/widgets/settings/beta_sync_settings/entity_count_tile.dart index ac357c2dee..d9a0bae606 100644 --- a/mobile/lib/widgets/settings/beta_sync_settings/entity_count_tile.dart +++ b/mobile/lib/widgets/settings/beta_sync_settings/entity_count_tile.dart @@ -2,26 +2,27 @@ import 'package:flutter/material.dart'; import 'package:immich_mobile/extensions/build_context_extensions.dart'; import 'package:immich_mobile/extensions/theme_extensions.dart'; -class EntitiyCountTile extends StatelessWidget { +class EntityCountTile extends StatelessWidget { final int count; final String label; final IconData icon; - const EntitiyCountTile({super.key, required this.count, required this.label, required this.icon}); + const EntityCountTile({super.key, required this.count, required this.label, required this.icon}); String zeroPadding(int number, int targetWidth) { final numStr = number.toString(); return numStr.length < targetWidth ? "0" * (targetWidth - numStr.length) : ""; } - int calculateMaxDigits(double availableWidth) { - const double charWidth = 11.0; - return (availableWidth / charWidth).floor().clamp(1, 8); - } - @override Widget build(BuildContext context) { + final screenWidth = MediaQuery.of(context).size.width; + final availableWidth = (screenWidth - 32 - 8) / 2; + const double charWidth = 11.0; + final maxDigits = ((availableWidth - 32) / charWidth).floor().clamp(1, 8); + return Container( + height: double.infinity, padding: const EdgeInsets.all(16), decoration: BoxDecoration( color: context.colorScheme.surfaceContainerLow, @@ -29,7 +30,6 @@ class EntitiyCountTile extends StatelessWidget { border: Border.all(width: 0.5, color: context.colorScheme.outline.withAlpha(25)), ), child: Column( - mainAxisSize: MainAxisSize.min, crossAxisAlignment: CrossAxisAlignment.center, children: [ // Icon and Label @@ -38,33 +38,30 @@ class EntitiyCountTile extends StatelessWidget { children: [ Icon(icon, color: context.primaryColor), const SizedBox(width: 8), - Text( - label, - style: TextStyle(color: context.primaryColor, fontWeight: FontWeight.bold, fontSize: 16), + Flexible( + child: Text( + label, + style: TextStyle(color: context.primaryColor, fontWeight: FontWeight.bold, fontSize: 16), + ), ), ], ), - const SizedBox(height: 12), // Number - LayoutBuilder( - builder: (context, constraints) { - final maxDigits = calculateMaxDigits(constraints.maxWidth); - return RichText( - text: TextSpan( - style: const TextStyle(fontSize: 18, fontFamily: 'OverpassMono', fontWeight: FontWeight.w600), - children: [ - TextSpan( - text: zeroPadding(count, maxDigits), - style: TextStyle(color: context.colorScheme.onSurfaceSecondary.withAlpha(75)), - ), - TextSpan( - text: count.toString(), - style: TextStyle(color: context.primaryColor), - ), - ], + const Spacer(), + RichText( + text: TextSpan( + style: const TextStyle(fontSize: 18, fontFamily: 'OverpassMono', fontWeight: FontWeight.w600), + children: [ + TextSpan( + text: zeroPadding(count, maxDigits), + style: TextStyle(color: context.colorScheme.onSurfaceSecondary.withAlpha(75)), ), - ); - }, + TextSpan( + text: count.toString(), + style: TextStyle(color: context.primaryColor), + ), + ], + ), ), ], ), diff --git a/mobile/lib/widgets/settings/beta_sync_settings/sync_status_and_actions.dart b/mobile/lib/widgets/settings/beta_sync_settings/sync_status_and_actions.dart index 64c3d9b832..d4730951c0 100644 --- a/mobile/lib/widgets/settings/beta_sync_settings/sync_status_and_actions.dart +++ b/mobile/lib/widgets/settings/beta_sync_settings/sync_status_and_actions.dart @@ -282,76 +282,87 @@ class _SyncStatsCounts extends ConsumerWidget { _SectionHeaderText(text: "assets".t(context: context)), Padding( padding: const EdgeInsets.fromLTRB(16, 8, 16, 16), - child: Flex( - direction: Axis.horizontal, - mainAxisAlignment: MainAxisAlignment.spaceBetween, - spacing: 8.0, - children: [ - Expanded( - child: EntitiyCountTile( - label: "local".t(context: context), - count: localAssetCount, - icon: Icons.smartphone, + // 1. Wrap in IntrinsicHeight + child: IntrinsicHeight( + child: Flex( + direction: Axis.horizontal, + mainAxisAlignment: MainAxisAlignment.spaceBetween, + // 2. Stretch children vertically to fill the IntrinsicHeight + crossAxisAlignment: CrossAxisAlignment.stretch, + spacing: 8.0, + children: [ + Expanded( + child: EntityCountTile( + label: "local".t(context: context), + count: localAssetCount, + icon: Icons.smartphone, + ), ), - ), - Expanded( - child: EntitiyCountTile( - label: "remote".t(context: context), - count: remoteAssetCount, - icon: Icons.cloud, + Expanded( + child: EntityCountTile( + label: "remote".t(context: context), + count: remoteAssetCount, + icon: Icons.cloud, + ), ), - ), - ], + ], + ), ), ), _SectionHeaderText(text: "albums".t(context: context)), Padding( padding: const EdgeInsets.fromLTRB(16, 8, 16, 16), - child: Flex( - direction: Axis.horizontal, - mainAxisAlignment: MainAxisAlignment.spaceBetween, - spacing: 8.0, - children: [ - Expanded( - child: EntitiyCountTile( - label: "local".t(context: context), - count: localAlbumCount, - icon: Icons.smartphone, + child: IntrinsicHeight( + child: Flex( + direction: Axis.horizontal, + mainAxisAlignment: MainAxisAlignment.spaceBetween, + crossAxisAlignment: CrossAxisAlignment.stretch, // Added + spacing: 8.0, + children: [ + Expanded( + child: EntityCountTile( + label: "local".t(context: context), + count: localAlbumCount, + icon: Icons.smartphone, + ), ), - ), - Expanded( - child: EntitiyCountTile( - label: "remote".t(context: context), - count: remoteAlbumCount, - icon: Icons.cloud, + Expanded( + child: EntityCountTile( + label: "remote".t(context: context), + count: remoteAlbumCount, + icon: Icons.cloud, + ), ), - ), - ], + ], + ), ), ), _SectionHeaderText(text: "other".t(context: context)), Padding( padding: const EdgeInsets.fromLTRB(16, 8, 16, 16), - child: Flex( - direction: Axis.horizontal, - mainAxisAlignment: MainAxisAlignment.spaceBetween, - spacing: 8.0, - children: [ - Expanded( - child: EntitiyCountTile( - label: "memories".t(context: context), - count: memoryCount, - icon: Icons.calendar_today, + child: IntrinsicHeight( + child: Flex( + direction: Axis.horizontal, + mainAxisAlignment: MainAxisAlignment.spaceBetween, + crossAxisAlignment: CrossAxisAlignment.stretch, // Added + spacing: 8.0, + children: [ + Expanded( + child: EntityCountTile( + label: "memories".t(context: context), + count: memoryCount, + icon: Icons.calendar_today, + ), ), - ), - Expanded( - child: EntitiyCountTile( - label: "hashed_assets".t(context: context), - count: localHashedCount, - icon: Icons.tag, + Expanded( + child: EntityCountTile( + label: "hashed_assets".t(context: context), + count: localHashedCount, + icon: Icons.tag, + ), ), - ), - ], + ], + ), ), ), // To be removed once the experimental feature is stable @@ -364,26 +375,29 @@ class _SyncStatsCounts extends ConsumerWidget { return counts.when( data: (c) => Padding( padding: const EdgeInsets.fromLTRB(16, 8, 16, 16), - child: Flex( - direction: Axis.horizontal, - mainAxisAlignment: MainAxisAlignment.spaceBetween, - spacing: 8.0, - children: [ - Expanded( - child: EntitiyCountTile( - label: "local".t(context: context), - count: c.total, - icon: Icons.delete_outline, + child: IntrinsicHeight( + child: Flex( + direction: Axis.horizontal, + mainAxisAlignment: MainAxisAlignment.spaceBetween, + crossAxisAlignment: CrossAxisAlignment.stretch, // Added + spacing: 8.0, + children: [ + Expanded( + child: EntityCountTile( + label: "local".t(context: context), + count: c.total, + icon: Icons.delete_outline, + ), ), - ), - Expanded( - child: EntitiyCountTile( - label: "hashed_assets".t(context: context), - count: c.hashed, - icon: Icons.tag, + Expanded( + child: EntityCountTile( + label: "hashed_assets".t(context: context), + count: c.hashed, + icon: Icons.tag, + ), ), - ), - ], + ], + ), ), ), loading: () => const CircularProgressIndicator(), From 06e79703da1dc1019e97fbc6904f655f9d3bf533 Mon Sep 17 00:00:00 2001 From: Yaros Date: Tue, 9 Dec 2025 16:19:41 +0100 Subject: [PATCH 2/5] fix(mobile): timeline bottom padding on selection (#24480) --- .../presentation/widgets/timeline/timeline.widget.dart | 8 ++++++-- 1 file changed, 6 insertions(+), 2 deletions(-) diff --git a/mobile/lib/presentation/widgets/timeline/timeline.widget.dart b/mobile/lib/presentation/widgets/timeline/timeline.widget.dart index 5868de92aa..a04e26d653 100644 --- a/mobile/lib/presentation/widgets/timeline/timeline.widget.dart +++ b/mobile/lib/presentation/widgets/timeline/timeline.widget.dart @@ -324,7 +324,11 @@ class _SliverTimelineState extends ConsumerState<_SliverTimeline> { final topPadding = context.padding.top + (widget.appBar == null ? 0 : kToolbarHeight) + 10; const scrubberBottomPadding = 100.0; - final bottomPadding = context.padding.bottom + (widget.appBar == null ? 0 : scrubberBottomPadding); + const bottomSheetOpenModifier = 120.0; + final bottomPadding = + context.padding.bottom + + (widget.appBar == null ? 0 : scrubberBottomPadding) + + (isMultiSelectEnabled ? bottomSheetOpenModifier : 0); final grid = CustomScrollView( primary: true, @@ -347,7 +351,7 @@ class _SliverTimelineState extends ConsumerState<_SliverTimeline> { addRepaintBoundaries: false, ), ), - const SliverPadding(padding: EdgeInsets.only(bottom: scrubberBottomPadding)), + SliverPadding(padding: EdgeInsets.only(bottom: bottomPadding)), ], ); From 01e39277e029aed22fc3388d0d0466555b8f4a1b Mon Sep 17 00:00:00 2001 From: Arnau Mora Date: Tue, 9 Dec 2025 17:23:01 +0000 Subject: [PATCH 3/5] feat(mobile): Localized backup upload details page (#21136) * Localized backup details page # Conflicts: # i18n/en.json * Format * format fix --------- Co-authored-by: shenlong-tanwen <139912620+shalong-tanwen@users.noreply.github.com> --- i18n/en.json | 5 ++++ .../backup/drift_upload_detail.page.dart | 24 ++++++++++++------- 2 files changed, 20 insertions(+), 9 deletions(-) diff --git a/i18n/en.json b/i18n/en.json index 7eb9ffbef6..5903d7850e 100644 --- a/i18n/en.json +++ b/i18n/en.json @@ -652,6 +652,7 @@ "backup_options_page_title": "Backup options", "backup_setting_subtitle": "Manage background and foreground upload settings", "backup_settings_subtitle": "Manage upload settings", + "backup_upload_details_page_more_details": "Tap for more details", "backward": "Backward", "biometric_auth_enabled": "Biometric authentication enabled", "biometric_locked_out": "You are locked out of biometric authentication", @@ -718,6 +719,7 @@ "check_corrupt_asset_backup_button": "Perform check", "check_corrupt_asset_backup_description": "Run this check only over Wi-Fi and once all assets have been backed-up. The procedure might take a few minutes.", "check_logs": "Check Logs", + "checksum": "Checksum", "choose_matching_people_to_merge": "Choose matching people to merge", "city": "City", "clear": "Clear", @@ -1166,6 +1168,7 @@ "header_settings_header_name_input": "Header name", "header_settings_header_value_input": "Header value", "headers_settings_tile_title": "Custom proxy headers", + "height": "Height", "hi_user": "Hi {name} ({email})", "hide_all_people": "Hide all people", "hide_gallery": "Hide gallery", @@ -1288,6 +1291,7 @@ "local": "Local", "local_asset_cast_failed": "Unable to cast an asset that is not uploaded to the server", "local_assets": "Local Assets", + "local_id": "Local ID", "local_media_summary": "Local Media Summary", "local_network": "Local network", "local_network_sheet_info": "The app will connect to the server through this URL when using the specified Wi-Fi network", @@ -2218,6 +2222,7 @@ "week": "Week", "welcome": "Welcome", "welcome_to_immich": "Welcome to Immich", + "width": "Width", "wifi_name": "Wi-Fi Name", "workflow": "Workflow", "wrong_pin_code": "Wrong PIN code", diff --git a/mobile/lib/pages/backup/drift_upload_detail.page.dart b/mobile/lib/pages/backup/drift_upload_detail.page.dart index 1b8aa57eaa..612b6a8111 100644 --- a/mobile/lib/pages/backup/drift_upload_detail.page.dart +++ b/mobile/lib/pages/backup/drift_upload_detail.page.dart @@ -98,7 +98,7 @@ class DriftUploadDetailPage extends ConsumerWidget { ), ), Text( - 'Tap for more details', + "backup_upload_details_page_more_details".t(context: context), style: context.textTheme.bodySmall?.copyWith( color: context.colorScheme.onSurface.withValues(alpha: 0.6), ), @@ -239,14 +239,20 @@ class FileDetailDialog extends ConsumerWidget { const SizedBox(height: 24), if (asset != null) ...[ _buildInfoSection(context, [ - _buildInfoRow(context, "Filename", path.basename(uploadStatus.filename)), - _buildInfoRow(context, "Local ID", asset.id), - _buildInfoRow(context, "File Size", formatHumanReadableBytes(uploadStatus.fileSize, 2)), - if (asset.width != null) _buildInfoRow(context, "Width", "${asset.width}px"), - if (asset.height != null) _buildInfoRow(context, "Height", "${asset.height}px"), - _buildInfoRow(context, "Created At", asset.createdAt.toString()), - _buildInfoRow(context, "Updated At", asset.updatedAt.toString()), - if (asset.checksum != null) _buildInfoRow(context, "Checksum", asset.checksum!), + _buildInfoRow(context, "filename".t(context: context), path.basename(uploadStatus.filename)), + _buildInfoRow(context, "local_id".t(context: context), asset.id), + _buildInfoRow( + context, + "file_size".t(context: context), + formatHumanReadableBytes(uploadStatus.fileSize, 2), + ), + if (asset.width != null) _buildInfoRow(context, "width".t(context: context), "${asset.width}px"), + if (asset.height != null) + _buildInfoRow(context, "height".t(context: context), "${asset.height}px"), + _buildInfoRow(context, "created_at".t(context: context), asset.createdAt.toString()), + _buildInfoRow(context, "updated_at".t(context: context), asset.updatedAt.toString()), + if (asset.checksum != null) + _buildInfoRow(context, "checksum".t(context: context), asset.checksum!), ]), ], ], From 7af99b86068bd4407a1c0acab9117741e7846fbb Mon Sep 17 00:00:00 2001 From: idubnori Date: Wed, 10 Dec 2025 03:26:28 +0900 Subject: [PATCH 4/5] feat(mobile): move top bar buttons into kebabu menu in AssetViewer (#24461) * chore(mobile): i18n: "open_asset_info" in viewer kebab menu * feat(mobile): move some top buttons into kebabu menu * refactor(mobile): viewer kebab menu to use context-based button generation * feat(mobile): refactor action button and kebab menu to use ConsumerWidget for improved state management * feat(mobile): pass original theme to ViewerKebabMenu for consistent styling * chore: styling --------- Co-authored-by: Alex --- .../add_action_button.widget.dart | 2 + .../base_action_button.widget.dart | 12 +- .../cast_action_button.widget.dart | 2 +- .../motion_photo_action_button.widget.dart | 2 +- .../asset_viewer/top_app_bar.widget.dart | 41 +------ .../viewer_kebab_menu.widget.dart | 48 +++++--- mobile/lib/utils/action_button.utils.dart | 107 +++++++++++++++++- 7 files changed, 156 insertions(+), 58 deletions(-) diff --git a/mobile/lib/presentation/widgets/action_buttons/add_action_button.widget.dart b/mobile/lib/presentation/widgets/action_buttons/add_action_button.widget.dart index acd7ede6dc..08ac9f982c 100644 --- a/mobile/lib/presentation/widgets/action_buttons/add_action_button.widget.dart +++ b/mobile/lib/presentation/widgets/action_buttons/add_action_button.widget.dart @@ -174,10 +174,12 @@ class _AddActionButtonState extends ConsumerState { consumeOutsideTap: true, style: MenuStyle( backgroundColor: WidgetStatePropertyAll(themeData.scaffoldBackgroundColor), + surfaceTintColor: const WidgetStatePropertyAll(Colors.grey), elevation: const WidgetStatePropertyAll(4), shape: const WidgetStatePropertyAll( RoundedRectangleBorder(borderRadius: BorderRadius.all(Radius.circular(12))), ), + padding: const WidgetStatePropertyAll(EdgeInsets.symmetric(vertical: 6)), ), menuChildren: widget.originalTheme != null ? [ diff --git a/mobile/lib/presentation/widgets/action_buttons/base_action_button.widget.dart b/mobile/lib/presentation/widgets/action_buttons/base_action_button.widget.dart index e6098b07b4..675b5bf219 100644 --- a/mobile/lib/presentation/widgets/action_buttons/base_action_button.widget.dart +++ b/mobile/lib/presentation/widgets/action_buttons/base_action_button.widget.dart @@ -1,7 +1,8 @@ import 'package:flutter/material.dart'; +import 'package:hooks_riverpod/hooks_riverpod.dart'; import 'package:immich_mobile/extensions/build_context_extensions.dart'; -class BaseActionButton extends StatelessWidget { +class BaseActionButton extends ConsumerWidget { const BaseActionButton({ super.key, required this.label, @@ -30,7 +31,7 @@ class BaseActionButton extends StatelessWidget { final void Function()? onLongPressed; @override - Widget build(BuildContext context) { + Widget build(BuildContext context, WidgetRef ref) { final miniWidth = minWidth ?? (context.isMobile ? context.width / 4.5 : 75.0); final iconTheme = IconTheme.of(context); final iconSize = iconTheme.size ?? 24.0; @@ -46,14 +47,13 @@ class BaseActionButton extends StatelessWidget { if (menuItem) { final theme = context.themeData; - final effectiveStyle = theme.textTheme.labelLarge; final effectiveIconColor = iconColor ?? theme.iconTheme.color ?? theme.colorScheme.onSurfaceVariant; return MenuItemButton( - style: MenuItemButton.styleFrom(padding: const EdgeInsets.symmetric(horizontal: 16, vertical: 12)), - leadingIcon: Icon(iconData, color: effectiveIconColor, size: 20), + style: MenuItemButton.styleFrom(alignment: Alignment.centerLeft, padding: const EdgeInsets.all(16)), + leadingIcon: Icon(iconData, color: effectiveIconColor), onPressed: onPressed, - child: Text(label, style: effectiveStyle), + child: Text(label, style: theme.textTheme.labelLarge?.copyWith(fontSize: 16)), ); } diff --git a/mobile/lib/presentation/widgets/action_buttons/cast_action_button.widget.dart b/mobile/lib/presentation/widgets/action_buttons/cast_action_button.widget.dart index 2840ad294b..7a4f84fb4f 100644 --- a/mobile/lib/presentation/widgets/action_buttons/cast_action_button.widget.dart +++ b/mobile/lib/presentation/widgets/action_buttons/cast_action_button.widget.dart @@ -7,7 +7,7 @@ import 'package:immich_mobile/providers/cast.provider.dart'; import 'package:immich_mobile/widgets/asset_viewer/cast_dialog.dart'; class CastActionButton extends ConsumerWidget { - const CastActionButton({super.key, this.iconOnly = true, this.menuItem = false}); + const CastActionButton({super.key, this.iconOnly = false, this.menuItem = false}); final bool iconOnly; final bool menuItem; diff --git a/mobile/lib/presentation/widgets/action_buttons/motion_photo_action_button.widget.dart b/mobile/lib/presentation/widgets/action_buttons/motion_photo_action_button.widget.dart index 9cf541f49f..3bd67978e2 100644 --- a/mobile/lib/presentation/widgets/action_buttons/motion_photo_action_button.widget.dart +++ b/mobile/lib/presentation/widgets/action_buttons/motion_photo_action_button.widget.dart @@ -5,7 +5,7 @@ import 'package:immich_mobile/presentation/widgets/action_buttons/base_action_bu import 'package:immich_mobile/providers/asset_viewer/is_motion_video_playing.provider.dart'; class MotionPhotoActionButton extends ConsumerWidget { - const MotionPhotoActionButton({super.key, this.iconOnly = true, this.menuItem = false}); + const MotionPhotoActionButton({super.key, this.iconOnly = false, this.menuItem = false}); final bool iconOnly; final bool menuItem; diff --git a/mobile/lib/presentation/widgets/asset_viewer/top_app_bar.widget.dart b/mobile/lib/presentation/widgets/asset_viewer/top_app_bar.widget.dart index b3129a9a0e..193cf60220 100644 --- a/mobile/lib/presentation/widgets/asset_viewer/top_app_bar.widget.dart +++ b/mobile/lib/presentation/widgets/asset_viewer/top_app_bar.widget.dart @@ -4,26 +4,19 @@ import 'package:hooks_riverpod/hooks_riverpod.dart'; import 'package:immich_mobile/constants/enums.dart'; import 'package:immich_mobile/domain/models/asset/base_asset.model.dart'; import 'package:immich_mobile/domain/models/events.model.dart'; -import 'package:immich_mobile/domain/services/timeline.service.dart'; import 'package:immich_mobile/domain/utils/event_stream.dart'; import 'package:immich_mobile/extensions/build_context_extensions.dart'; -import 'package:immich_mobile/extensions/translate_extensions.dart'; -import 'package:immich_mobile/presentation/widgets/action_buttons/cast_action_button.widget.dart'; -import 'package:immich_mobile/presentation/widgets/action_buttons/download_action_button.widget.dart'; import 'package:immich_mobile/presentation/widgets/action_buttons/favorite_action_button.widget.dart'; import 'package:immich_mobile/presentation/widgets/action_buttons/motion_photo_action_button.widget.dart'; import 'package:immich_mobile/presentation/widgets/action_buttons/unfavorite_action_button.widget.dart'; import 'package:immich_mobile/presentation/widgets/asset_viewer/asset_viewer.state.dart'; import 'package:immich_mobile/presentation/widgets/asset_viewer/viewer_kebab_menu.widget.dart'; import 'package:immich_mobile/providers/activity.provider.dart'; -import 'package:immich_mobile/providers/cast.provider.dart'; import 'package:immich_mobile/providers/infrastructure/asset_viewer/current_asset.provider.dart'; import 'package:immich_mobile/providers/infrastructure/current_album.provider.dart'; import 'package:immich_mobile/providers/infrastructure/readonly_mode.provider.dart'; -import 'package:immich_mobile/providers/infrastructure/timeline.provider.dart'; import 'package:immich_mobile/providers/routes.provider.dart'; import 'package:immich_mobile/providers/user.provider.dart'; -import 'package:immich_mobile/routing/router.dart'; class ViewerTopAppBar extends ConsumerWidget implements PreferredSizeWidget { const ViewerTopAppBar({super.key}); @@ -42,15 +35,6 @@ class ViewerTopAppBar extends ConsumerWidget implements PreferredSizeWidget { final isInLockedView = ref.watch(inLockedViewProvider); final isReadonlyModeEnabled = ref.watch(readonlyModeProvider); - final timelineOrigin = ref.read(timelineServiceProvider).origin; - final showViewInTimelineButton = - timelineOrigin != TimelineOrigin.main && - timelineOrigin != TimelineOrigin.deepLink && - timelineOrigin != TimelineOrigin.trash && - timelineOrigin != TimelineOrigin.archive && - timelineOrigin != TimelineOrigin.localAlbum && - isOwner; - final isShowingSheet = ref.watch(assetViewerProvider.select((state) => state.showingBottomSheet)); int opacity = ref.watch(assetViewerProvider.select((state) => state.backgroundOpacity)); final showControls = ref.watch(assetViewerProvider.select((s) => s.showingControls)); @@ -63,11 +47,10 @@ class ViewerTopAppBar extends ConsumerWidget implements PreferredSizeWidget { opacity = 0; } - final isCasting = ref.watch(castProvider.select((c) => c.isCasting)); + final originalTheme = context.themeData; final actions = [ - if (asset.isRemoteOnly) const DownloadActionButton(source: ActionSource.viewer, iconOnly: true), - if (isCasting || (asset.hasRemote)) const CastActionButton(iconOnly: true), + if (asset.isMotionPhoto) const MotionPhotoActionButton(iconOnly: true), if (album != null && album.isActivityEnabled && album.isShared) IconButton( icon: const Icon(Icons.chat_outlined), @@ -75,28 +58,16 @@ class ViewerTopAppBar extends ConsumerWidget implements PreferredSizeWidget { EventStream.shared.emit(const ViewerOpenBottomSheetEvent(activitiesMode: true)); }, ), - if (showViewInTimelineButton) - IconButton( - onPressed: () async { - await context.maybePop(); - await context.navigateTo(const TabShellRoute(children: [MainTimelineRoute()])); - EventStream.shared.emit(ScrollToDateEvent(asset.createdAt)); - }, - icon: const Icon(Icons.image_search), - tooltip: 'view_in_timeline'.t(context: context), - ), + if (asset.hasRemote && isOwner && !asset.isFavorite) const FavoriteActionButton(source: ActionSource.viewer, iconOnly: true), if (asset.hasRemote && isOwner && asset.isFavorite) const UnFavoriteActionButton(source: ActionSource.viewer, iconOnly: true), - if (asset.isMotionPhoto) const MotionPhotoActionButton(iconOnly: true), - const ViewerKebabMenu(), + + ViewerKebabMenu(originalTheme: originalTheme), ]; - final lockedViewActions = [ - if (isCasting || (asset.hasRemote)) const CastActionButton(iconOnly: true), - const ViewerKebabMenu(), - ]; + final lockedViewActions = [ViewerKebabMenu(originalTheme: originalTheme)]; return IgnorePointer( ignoring: opacity < 255, diff --git a/mobile/lib/presentation/widgets/asset_viewer/viewer_kebab_menu.widget.dart b/mobile/lib/presentation/widgets/asset_viewer/viewer_kebab_menu.widget.dart index 4651b5eea8..ff638ee583 100644 --- a/mobile/lib/presentation/widgets/asset_viewer/viewer_kebab_menu.widget.dart +++ b/mobile/lib/presentation/widgets/asset_viewer/viewer_kebab_menu.widget.dart @@ -1,14 +1,17 @@ -import 'package:easy_localization/easy_localization.dart'; import 'package:flutter/material.dart'; import 'package:hooks_riverpod/hooks_riverpod.dart'; -import 'package:immich_mobile/domain/models/events.model.dart'; -import 'package:immich_mobile/domain/utils/event_stream.dart'; +import 'package:immich_mobile/domain/models/asset/base_asset.model.dart'; import 'package:immich_mobile/extensions/build_context_extensions.dart'; -import 'package:immich_mobile/presentation/widgets/action_buttons/base_action_button.widget.dart'; +import 'package:immich_mobile/providers/cast.provider.dart'; import 'package:immich_mobile/providers/infrastructure/asset_viewer/current_asset.provider.dart'; +import 'package:immich_mobile/providers/infrastructure/timeline.provider.dart'; +import 'package:immich_mobile/providers/user.provider.dart'; +import 'package:immich_mobile/utils/action_button.utils.dart'; class ViewerKebabMenu extends ConsumerWidget { - const ViewerKebabMenu({super.key}); + const ViewerKebabMenu({super.key, this.originalTheme}); + + final ThemeData? originalTheme; @override Widget build(BuildContext context, WidgetRef ref) { @@ -17,25 +20,42 @@ class ViewerKebabMenu extends ConsumerWidget { return const SizedBox.shrink(); } - final menuChildren = [ - BaseActionButton( - label: 'about'.tr(), - iconData: Icons.info_outline, - menuItem: true, - onPressed: () => EventStream.shared.emit(const ViewerOpenBottomSheetEvent()), - ), - ]; + final user = ref.watch(currentUserProvider); + final isOwner = asset is RemoteAsset && asset.ownerId == user?.id; + final isCasting = ref.watch(castProvider.select((c) => c.isCasting)); + final timelineOrigin = ref.read(timelineServiceProvider).origin; + + final kebabContext = ViewerKebabMenuButtonContext( + asset: asset, + isOwner: isOwner, + isCasting: isCasting, + timelineOrigin: timelineOrigin, + originalTheme: originalTheme, + ); + + final menuChildren = ViewerKebabMenuButtonBuilder.build(kebabContext, context, ref); return MenuAnchor( consumeOutsideTap: true, style: MenuStyle( backgroundColor: WidgetStatePropertyAll(context.themeData.scaffoldBackgroundColor), + surfaceTintColor: const WidgetStatePropertyAll(Colors.grey), elevation: const WidgetStatePropertyAll(4), shape: const WidgetStatePropertyAll( RoundedRectangleBorder(borderRadius: BorderRadius.all(Radius.circular(12))), ), + padding: const WidgetStatePropertyAll(EdgeInsets.symmetric(vertical: 6)), ), - menuChildren: menuChildren, + menuChildren: [ + ConstrainedBox( + constraints: const BoxConstraints(minWidth: 150), + child: Column( + mainAxisSize: MainAxisSize.min, + crossAxisAlignment: CrossAxisAlignment.stretch, + children: menuChildren, + ), + ), + ], builder: (context, controller, child) { return IconButton( icon: const Icon(Icons.more_vert_rounded), diff --git a/mobile/lib/utils/action_button.utils.dart b/mobile/lib/utils/action_button.utils.dart index 42729becc9..917ddbebca 100644 --- a/mobile/lib/utils/action_button.utils.dart +++ b/mobile/lib/utils/action_button.utils.dart @@ -1,9 +1,18 @@ -import 'package:flutter/widgets.dart'; +import 'package:auto_route/auto_route.dart'; +import 'package:easy_localization/easy_localization.dart'; +import 'package:flutter/material.dart'; +import 'package:hooks_riverpod/hooks_riverpod.dart'; import 'package:immich_mobile/constants/enums.dart'; import 'package:immich_mobile/domain/models/album/album.model.dart'; import 'package:immich_mobile/domain/models/asset/base_asset.model.dart'; +import 'package:immich_mobile/domain/models/events.model.dart'; +import 'package:immich_mobile/domain/services/timeline.service.dart'; +import 'package:immich_mobile/domain/utils/event_stream.dart'; +import 'package:immich_mobile/extensions/translate_extensions.dart'; import 'package:immich_mobile/presentation/widgets/action_buttons/advanced_info_action_button.widget.dart'; import 'package:immich_mobile/presentation/widgets/action_buttons/archive_action_button.widget.dart'; +import 'package:immich_mobile/presentation/widgets/action_buttons/base_action_button.widget.dart'; +import 'package:immich_mobile/presentation/widgets/action_buttons/cast_action_button.widget.dart'; import 'package:immich_mobile/presentation/widgets/action_buttons/delete_action_button.widget.dart'; import 'package:immich_mobile/presentation/widgets/action_buttons/delete_local_action_button.widget.dart'; import 'package:immich_mobile/presentation/widgets/action_buttons/delete_permanent_action_button.widget.dart'; @@ -19,6 +28,7 @@ import 'package:immich_mobile/presentation/widgets/action_buttons/trash_action_b import 'package:immich_mobile/presentation/widgets/action_buttons/unarchive_action_button.widget.dart'; import 'package:immich_mobile/presentation/widgets/action_buttons/unstack_action_button.widget.dart'; import 'package:immich_mobile/presentation/widgets/action_buttons/upload_action_button.widget.dart'; +import 'package:immich_mobile/routing/router.dart'; class ActionButtonContext { final BaseAsset asset; @@ -164,3 +174,98 @@ class ActionButtonBuilder { return _actionTypes.where((type) => type.shouldShow(context)).map((type) => type.buildButton(context)).toList(); } } + +class ViewerKebabMenuButtonContext { + final BaseAsset asset; + final bool isOwner; + final bool isCasting; + final TimelineOrigin timelineOrigin; + final ThemeData? originalTheme; + + const ViewerKebabMenuButtonContext({ + required this.asset, + required this.isOwner, + required this.isCasting, + required this.timelineOrigin, + this.originalTheme, + }); +} + +enum ViewerKebabMenuButtonType { + openInfo, + viewInTimeline, + cast, + download; + + /// Defines which group each button belongs to. + /// Buttons in the same group will be displayed together, + /// with dividers separating different groups. + int get group => switch (this) { + ViewerKebabMenuButtonType.openInfo => 0, + ViewerKebabMenuButtonType.viewInTimeline => 1, + ViewerKebabMenuButtonType.cast => 1, + ViewerKebabMenuButtonType.download => 1, + }; + + bool shouldShow(ViewerKebabMenuButtonContext context) { + return switch (this) { + ViewerKebabMenuButtonType.openInfo => true, + ViewerKebabMenuButtonType.viewInTimeline => + context.timelineOrigin != TimelineOrigin.main && + context.timelineOrigin != TimelineOrigin.deepLink && + context.timelineOrigin != TimelineOrigin.trash && + context.timelineOrigin != TimelineOrigin.archive && + context.timelineOrigin != TimelineOrigin.localAlbum && + context.isOwner, + ViewerKebabMenuButtonType.cast => context.isCasting || context.asset.hasRemote, + ViewerKebabMenuButtonType.download => context.asset.isRemoteOnly, + }; + } + + ConsumerWidget buildButton(ViewerKebabMenuButtonContext context, BuildContext buildContext) { + return switch (this) { + ViewerKebabMenuButtonType.openInfo => BaseActionButton( + label: 'info'.tr(), + iconData: Icons.info_outline, + iconColor: context.originalTheme?.iconTheme.color, + menuItem: true, + onPressed: () => EventStream.shared.emit(const ViewerOpenBottomSheetEvent()), + ), + + ViewerKebabMenuButtonType.viewInTimeline => BaseActionButton( + label: 'view_in_timeline'.t(context: buildContext), + iconData: Icons.image_search, + iconColor: context.originalTheme?.iconTheme.color, + menuItem: true, + onPressed: () async { + await buildContext.maybePop(); + await buildContext.navigateTo(const TabShellRoute(children: [MainTimelineRoute()])); + EventStream.shared.emit(ScrollToDateEvent(context.asset.createdAt)); + }, + ), + ViewerKebabMenuButtonType.cast => const CastActionButton(menuItem: true), + ViewerKebabMenuButtonType.download => const DownloadActionButton(source: ActionSource.viewer, menuItem: true), + }; + } +} + +class ViewerKebabMenuButtonBuilder { + static List build(ViewerKebabMenuButtonContext context, BuildContext buildContext, WidgetRef ref) { + final visibleButtons = ViewerKebabMenuButtonType.values.where((type) => type.shouldShow(context)).toList(); + + if (visibleButtons.isEmpty) return []; + + final List result = []; + int? lastGroup; + + for (final type in visibleButtons) { + if (lastGroup != null && type.group != lastGroup) { + result.add(const Divider(height: 1)); + } + result.add(type.buildButton(context, buildContext).build(buildContext, ref)); + lastGroup = type.group; + } + + return result; + } +} From 6d499c782a9e69b26b67b9f63368d897d84ed854 Mon Sep 17 00:00:00 2001 From: Alex Date: Tue, 9 Dec 2025 17:27:01 -0600 Subject: [PATCH 5/5] chore: update ui lib (#24483) --- pnpm-lock.yaml | 10 +++++----- web/package.json | 2 +- 2 files changed, 6 insertions(+), 6 deletions(-) diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml index 09a047b9e0..13b81356c3 100644 --- a/pnpm-lock.yaml +++ b/pnpm-lock.yaml @@ -717,8 +717,8 @@ importers: specifier: file:../open-api/typescript-sdk version: link:../open-api/typescript-sdk '@immich/ui': - specifier: ^0.50.0 - version: 0.50.0(@sveltejs/kit@2.49.0(@opentelemetry/api@1.9.0)(@sveltejs/vite-plugin-svelte@6.2.1(svelte@5.45.2)(vite@7.2.4(@types/node@24.10.1)(jiti@2.6.1)(lightningcss@1.30.2)(terser@5.44.0)(yaml@2.8.2)))(svelte@5.45.2)(vite@7.2.4(@types/node@24.10.1)(jiti@2.6.1)(lightningcss@1.30.2)(terser@5.44.0)(yaml@2.8.2)))(svelte@5.45.2) + specifier: ^0.50.1 + version: 0.50.1(@sveltejs/kit@2.49.0(@opentelemetry/api@1.9.0)(@sveltejs/vite-plugin-svelte@6.2.1(svelte@5.45.2)(vite@7.2.4(@types/node@24.10.1)(jiti@2.6.1)(lightningcss@1.30.2)(terser@5.44.0)(yaml@2.8.2)))(svelte@5.45.2)(vite@7.2.4(@types/node@24.10.1)(jiti@2.6.1)(lightningcss@1.30.2)(terser@5.44.0)(yaml@2.8.2)))(svelte@5.45.2) '@mapbox/mapbox-gl-rtl-text': specifier: 0.2.3 version: 0.2.3(mapbox-gl@1.13.3) @@ -2989,8 +2989,8 @@ packages: peerDependencies: svelte: ^5.0.0 - '@immich/ui@0.50.0': - resolution: {integrity: sha512-7AW9SRZTAgal8xlkUAxm7o4+pSG7HcKb+Bh9JpWLaDRRdGyPCZMmsNa9CjZglOQ7wkAD07tQ9u4+zezBLe0dlQ==} + '@immich/ui@0.50.1': + resolution: {integrity: sha512-fNlQGh75ZFa/UZAgJaYk9/ItHOXHNNzN4CunjCmE7WocVVkUZbUxopN9Ku3F5GULSqD/zJ5gNO6PQAZ1ZoSaaQ==} peerDependencies: svelte: ^5.0.0 @@ -14701,7 +14701,7 @@ snapshots: dependencies: svelte: 5.45.2 - '@immich/ui@0.50.0(@sveltejs/kit@2.49.0(@opentelemetry/api@1.9.0)(@sveltejs/vite-plugin-svelte@6.2.1(svelte@5.45.2)(vite@7.2.4(@types/node@24.10.1)(jiti@2.6.1)(lightningcss@1.30.2)(terser@5.44.0)(yaml@2.8.2)))(svelte@5.45.2)(vite@7.2.4(@types/node@24.10.1)(jiti@2.6.1)(lightningcss@1.30.2)(terser@5.44.0)(yaml@2.8.2)))(svelte@5.45.2)': + '@immich/ui@0.50.1(@sveltejs/kit@2.49.0(@opentelemetry/api@1.9.0)(@sveltejs/vite-plugin-svelte@6.2.1(svelte@5.45.2)(vite@7.2.4(@types/node@24.10.1)(jiti@2.6.1)(lightningcss@1.30.2)(terser@5.44.0)(yaml@2.8.2)))(svelte@5.45.2)(vite@7.2.4(@types/node@24.10.1)(jiti@2.6.1)(lightningcss@1.30.2)(terser@5.44.0)(yaml@2.8.2)))(svelte@5.45.2)': dependencies: '@immich/svelte-markdown-preprocess': 0.1.0(svelte@5.45.2) '@internationalized/date': 3.10.0 diff --git a/web/package.json b/web/package.json index 82065d74bf..b3cc6d2c2f 100644 --- a/web/package.json +++ b/web/package.json @@ -28,7 +28,7 @@ "@formatjs/icu-messageformat-parser": "^2.9.8", "@immich/justified-layout-wasm": "^0.4.3", "@immich/sdk": "file:../open-api/typescript-sdk", - "@immich/ui": "^0.50.0", + "@immich/ui": "^0.50.1", "@mapbox/mapbox-gl-rtl-text": "0.2.3", "@mdi/js": "^7.4.47", "@photo-sphere-viewer/core": "^5.14.0",