diff --git a/mobile/lib/modules/home/providers/home_page_render_list_provider.dart b/mobile/lib/modules/home/providers/home_page_render_list_provider.dart index a0e4c1eef7..4ad6be68f0 100644 --- a/mobile/lib/modules/home/providers/home_page_render_list_provider.dart +++ b/mobile/lib/modules/home/providers/home_page_render_list_provider.dart @@ -8,52 +8,9 @@ import 'package:immich_mobile/shared/providers/asset.provider.dart'; final renderListProvider = StateProvider((ref) { var assetGroups = ref.watch(assetGroupByDateTimeProvider); - var settings = ref.watch(appSettingsServiceProvider); + var settings = ref.watch(appSettingsServiceProvider); final assetsPerRow = settings.getSetting(AppSettingsEnum.tilesPerRow); - List elements = []; - DateTime? lastDate; - - assetGroups.forEach((groupName, assets) { - final date = DateTime.parse(groupName); - - if (lastDate == null || lastDate!.month != date.month) { - elements.add( - RenderAssetGridElement(RenderAssetGridElementType.monthTitle, - title: groupName, date: date), - ); - } - - // Add group title - elements.add( - RenderAssetGridElement( - RenderAssetGridElementType.dayTitle, - title: groupName, - date: date, - relatedAssetList: assets, - ), - ); - - // Add rows - int cursor = 0; - while (cursor < assets.length) { - int rowElements = min(assets.length - cursor, assetsPerRow); - - final rowElement = RenderAssetGridElement( - RenderAssetGridElementType.assetRow, - date: date, - assetRow: RenderAssetGridRow( - assets.sublist(cursor, cursor + rowElements), - ), - ); - - elements.add(rowElement); - cursor += rowElements; - } - - lastDate = date; - }); - - return elements; + return assetGroupsToRenderList(assetGroups, assetsPerRow); }); diff --git a/mobile/lib/modules/home/ui/asset_list_v2/asset_grid_data_structure.dart b/mobile/lib/modules/home/ui/asset_list_v2/asset_grid_data_structure.dart index c008680eb1..9343859599 100644 --- a/mobile/lib/modules/home/ui/asset_list_v2/asset_grid_data_structure.dart +++ b/mobile/lib/modules/home/ui/asset_list_v2/asset_grid_data_structure.dart @@ -53,3 +53,51 @@ List assetsToRenderList( return elements; } + +List assetGroupsToRenderList( + Map> assetGroups, int assetsPerRow) { + List elements = []; + DateTime? lastDate; + + assetGroups.forEach((groupName, assets) { + final date = DateTime.parse(groupName); + + if (lastDate == null || lastDate!.month != date.month) { + elements.add( + RenderAssetGridElement(RenderAssetGridElementType.monthTitle, + title: groupName, date: date), + ); + } + + // Add group title + elements.add( + RenderAssetGridElement( + RenderAssetGridElementType.dayTitle, + title: groupName, + date: date, + relatedAssetList: assets, + ), + ); + + // Add rows + int cursor = 0; + while (cursor < assets.length) { + int rowElements = min(assets.length - cursor, assetsPerRow); + + final rowElement = RenderAssetGridElement( + RenderAssetGridElementType.assetRow, + date: date, + assetRow: RenderAssetGridRow( + assets.sublist(cursor, cursor + rowElements), + ), + ); + + elements.add(rowElement); + cursor += rowElements; + } + + lastDate = date; + }); + + return elements; +} diff --git a/mobile/lib/modules/search/providers/search_result_page.provider.dart b/mobile/lib/modules/search/providers/search_result_page.provider.dart index 66c7a44199..b52c172f60 100644 --- a/mobile/lib/modules/search/providers/search_result_page.provider.dart +++ b/mobile/lib/modules/search/providers/search_result_page.provider.dart @@ -1,8 +1,11 @@ import 'package:collection/collection.dart'; import 'package:hooks_riverpod/hooks_riverpod.dart'; +import 'package:immich_mobile/modules/home/ui/asset_list_v2/asset_grid_data_structure.dart'; import 'package:immich_mobile/modules/search/models/search_result_page_state.model.dart'; import 'package:immich_mobile/modules/search/services/search.service.dart'; +import 'package:immich_mobile/modules/settings/providers/app_settings.provider.dart'; +import 'package:immich_mobile/modules/settings/services/app_settings.service.dart'; import 'package:intl/intl.dart'; import 'package:openapi/api.dart'; @@ -66,3 +69,12 @@ final searchResultGroupByDateTimeProvider = StateProvider((ref) { .format(DateTime.parse(element.createdAt).toLocal()), ); }); + +final searchRenderListProvider = StateProvider((ref) { + var assetGroups = ref.watch(searchResultGroupByDateTimeProvider); + + var settings = ref.watch(appSettingsServiceProvider); + final assetsPerRow = settings.getSetting(AppSettingsEnum.tilesPerRow); + + return assetGroupsToRenderList(assetGroups, assetsPerRow); +}); diff --git a/mobile/lib/modules/search/views/search_result_page.dart b/mobile/lib/modules/search/views/search_result_page.dart index 09f38ffb0f..850de5cd96 100644 --- a/mobile/lib/modules/search/views/search_result_page.dart +++ b/mobile/lib/modules/search/views/search_result_page.dart @@ -4,13 +4,12 @@ import 'package:flutter/material.dart'; import 'package:flutter_hooks/flutter_hooks.dart'; import 'package:flutter_spinkit/flutter_spinkit.dart'; import 'package:hooks_riverpod/hooks_riverpod.dart'; -import 'package:immich_mobile/modules/home/ui/daily_title_text.dart'; -import 'package:immich_mobile/modules/home/ui/draggable_scrollbar.dart'; -import 'package:immich_mobile/modules/home/ui/image_grid.dart'; -import 'package:immich_mobile/modules/home/ui/monthly_title_text.dart'; +import 'package:immich_mobile/modules/home/ui/asset_list_v2/immich_asset_grid.dart'; import 'package:immich_mobile/modules/search/providers/search_page_state.provider.dart'; import 'package:immich_mobile/modules/search/providers/search_result_page.provider.dart'; import 'package:immich_mobile/modules/search/ui/search_suggestion_list.dart'; +import 'package:immich_mobile/modules/settings/providers/app_settings.provider.dart'; +import 'package:immich_mobile/modules/settings/services/app_settings.service.dart'; import 'package:openapi/api.dart'; class SearchResultPage extends HookConsumerWidget { @@ -21,17 +20,12 @@ class SearchResultPage extends HookConsumerWidget { @override Widget build(BuildContext context, WidgetRef ref) { - ScrollController scrollController = useScrollController(); final searchTermController = useTextEditingController(text: ""); final isNewSearch = useState(false); final currentSearchTerm = useState(searchTerm); - final List imageGridGroup = []; - FocusNode? searchFocusNode; - List sortedAssetList = []; - useEffect( () { searchFocusNode = FocusNode(); @@ -117,7 +111,12 @@ class SearchResultPage extends HookConsumerWidget { _buildSearchResult() { var searchResultPageState = ref.watch(searchResultPageProvider); - var assetGroupByDateTime = ref.watch(searchResultGroupByDateTimeProvider); + var searchResultRenderList = ref.watch(searchRenderListProvider); + + var settings = ref.watch(appSettingsServiceProvider); + final assetsPerRow = settings.getSetting(AppSettingsEnum.tilesPerRow); + final showStorageIndicator = + settings.getSetting(AppSettingsEnum.storageIndicator); if (searchResultPageState.isError) { return const Text("Error"); @@ -132,57 +131,11 @@ class SearchResultPage extends HookConsumerWidget { } if (searchResultPageState.isSuccess) { - if (searchResultPageState.searchResult.isNotEmpty) { - int? lastMonth; - // set sorted List - for (var group in assetGroupByDateTime.values) { - for (var value in group) { - sortedAssetList.add(value); - } - } - assetGroupByDateTime.forEach((dateGroup, immichAssetList) { - DateTime parseDateGroup = DateTime.parse(dateGroup); - int currentMonth = parseDateGroup.month; - - if (lastMonth != null) { - if (currentMonth - lastMonth! != 0) { - imageGridGroup.add( - MonthlyTitleText( - isoDate: dateGroup, - ), - ); - } - } - - imageGridGroup.add( - DailyTitleText( - isoDate: dateGroup, - assetGroup: immichAssetList, - ), - ); - - imageGridGroup.add( - ImageGrid( - assetGroup: immichAssetList, - sortedAssetGroup: sortedAssetList, - ), - ); - - lastMonth = currentMonth; - }); - - return DraggableScrollbar.semicircle( - backgroundColor: Theme.of(context).hintColor, - controller: scrollController, - heightScrollThumb: 48.0, - child: CustomScrollView( - controller: scrollController, - slivers: [...imageGridGroup], - ), - ); - } else { - return const Text("No assets found"); - } + return ImmichAssetGrid( + renderList: searchResultRenderList, + assetsPerRow: assetsPerRow, + showStorageIndicator: showStorageIndicator, + ); } return const SizedBox();