feat: sort smart search

Smart search currently returns a list of assets by their score. It would be nice if we could instead filter assets, and then list them by date. This is the default behaviour of other platforms.
2026-03-26 11:50:53 +03:00 · 2026-02-24 10:28:56 +00:00
parent 1d25267f22
commit d416e225e6
17 changed files with 705 additions and 21 deletions
--- a/mobile/lib/infrastructure/repositories/search_api.repository.dart
+++ b/mobile/lib/infrastructure/repositories/search_api.repository.dart
@@ -37,6 +37,7 @@ class SearchApiRepository extends ApiRepository {
          personIds: filter.people.map((e) => e.id).toList(),
          tagIds: filter.tagIds,
          type: type,
+          order: filter.order,
          page: page,
          size: 100,
        ),
@@ -62,6 +63,7 @@ class SearchApiRepository extends ApiRepository {
        personIds: filter.people.map((e) => e.id).toList(),
        tagIds: filter.tagIds,
        type: type,
+        order: filter.order ?? AssetOrder.desc,
        page: page,
        size: 1000,
      ),
--- a/mobile/lib/models/search/search_filter.model.dart
+++ b/mobile/lib/models/search/search_filter.model.dart
@@ -3,6 +3,7 @@ import 'dart:convert';

 import 'package:immich_mobile/domain/models/person.model.dart';
 import 'package:immich_mobile/entities/asset.entity.dart';
+import 'package:openapi/api.dart' show AssetOrder;

 class SearchLocationFilter {
  String? country;
@@ -221,6 +222,7 @@ class SearchFilter {
  SearchDateFilter date;
  SearchRatingFilter rating;
  SearchDisplayFilters display;
+  AssetOrder? order;

  // Enum
  AssetType mediaType;
@@ -233,6 +235,7 @@ class SearchFilter {
    this.language,
    this.assetId,
    this.tagIds,
+    this.order,
    required this.people,
    required this.location,
    required this.camera,
@@ -279,6 +282,7 @@ class SearchFilter {
    SearchDisplayFilters? display,
    SearchRatingFilter? rating,
    AssetType? mediaType,
+    AssetOrder? Function()? order,
  }) {
    return SearchFilter(
      context: context ?? this.context,
@@ -295,12 +299,13 @@ class SearchFilter {
      rating: rating ?? this.rating,
      mediaType: mediaType ?? this.mediaType,
      tagIds: tagIds ?? this.tagIds,
+      order: order != null ? order() : this.order,
    );
  }

  @override
  String toString() {
-    return 'SearchFilter(context: $context, filename: $filename, description: $description, language: $language, ocr: $ocr, people: $people, location: $location, tagIds: $tagIds, camera: $camera, date: $date, display: $display, rating: $rating, mediaType: $mediaType, assetId: $assetId)';
+    return 'SearchFilter(context: $context, filename: $filename, description: $description, language: $language, ocr: $ocr, people: $people, location: $location, tagIds: $tagIds, camera: $camera, date: $date, display: $display, rating: $rating, mediaType: $mediaType, assetId: $assetId, order: $order)';
  }

  @override
@@ -320,7 +325,8 @@ class SearchFilter {
        other.date == date &&
        other.display == display &&
        other.rating == rating &&
-        other.mediaType == mediaType;
+        other.mediaType == mediaType &&
+        other.order == order;
  }

  @override
@@ -338,6 +344,7 @@ class SearchFilter {
        date.hashCode ^
        display.hashCode ^
        rating.hashCode ^
-        mediaType.hashCode;
+        mediaType.hashCode ^
+        order.hashCode;
  }
 }
--- a/mobile/lib/pages/search/search.page.dart
+++ b/mobile/lib/pages/search/search.page.dart
@@ -11,6 +11,7 @@ import 'package:immich_mobile/entities/asset.entity.dart';
 import 'package:immich_mobile/extensions/build_context_extensions.dart';
 import 'package:immich_mobile/models/search/search_filter.model.dart';
 import 'package:immich_mobile/providers/search/paginated_search.provider.dart';
+import 'package:immich_mobile/widgets/asset_grid/asset_grid_data_structure.dart';
 import 'package:immich_mobile/providers/search/search_input_focus.provider.dart';
 import 'package:immich_mobile/routing/router.dart';
 import 'package:immich_mobile/widgets/asset_grid/multiselect_grid.dart';
@@ -23,6 +24,8 @@ import 'package:immich_mobile/widgets/search/search_filter/media_type_picker.dar
 import 'package:immich_mobile/widgets/search/search_filter/people_picker.dart';
 import 'package:immich_mobile/widgets/search/search_filter/search_filter_chip.dart';
 import 'package:immich_mobile/widgets/search/search_filter/search_filter_utils.dart';
+import 'package:immich_mobile/widgets/search/search_filter/sort_order_picker.dart';
+import 'package:openapi/api.dart' show AssetOrder;

@RoutePage()
 class SearchPage extends HookConsumerWidget {
@@ -56,6 +59,7 @@ class SearchPage extends HookConsumerWidget {
    final locationCurrentFilterWidget = useState<Widget?>(null);
    final mediaTypeCurrentFilterWidget = useState<Widget?>(null);
    final displayOptionCurrentFilterWidget = useState<Widget?>(null);
+    final sortOrderCurrentFilterWidget = useState<Widget?>(null);

    final isSearching = useState(false);

@@ -78,6 +82,8 @@ class SearchPage extends HookConsumerWidget {
      }

      isSearching.value = true;
+      ref.read(searchGroupByProvider.notifier).state =
+          filter.value.order != null ? GroupAssetsBy.day : GroupAssetsBy.none;
      ref.watch(paginatedSearchProvider.notifier).clear();
      final hasResult = await ref.watch(paginatedSearchProvider.notifier).search(filter.value);

@@ -387,6 +393,37 @@ class SearchPage extends HookConsumerWidget {
      );
    }

+    // SORT ORDER
+    showSortOrderPicker() {
+      handleOnSelect(AssetOrder? value) {
+        filter.value = filter.value.copyWith(order: () => value);
+
+        if (value == null) {
+          sortOrderCurrentFilterWidget.value = null;
+        } else if (value == AssetOrder.desc) {
+          sortOrderCurrentFilterWidget.value = Text('newest_first'.tr(), style: context.textTheme.labelLarge);
+        } else {
+          sortOrderCurrentFilterWidget.value = Text('oldest_first'.tr(), style: context.textTheme.labelLarge);
+        }
+      }
+
+      handleClear() {
+        filter.value = filter.value.copyWith(order: () => null);
+        sortOrderCurrentFilterWidget.value = null;
+        search();
+      }
+
+      showFilterBottomSheet(
+        context: context,
+        child: FilterBottomSheetScaffold(
+          title: 'search_filter_sort_order_title'.tr(),
+          onSearch: search,
+          onClear: handleClear,
+          child: SortOrderPicker(onSelect: handleOnSelect, order: filter.value.order),
+        ),
+      );
+    }
+
    handleTextSubmitted(String value) {
      switch (textSearchType.value) {
        case TextSearchType.context:
@@ -594,6 +631,12 @@ class SearchPage extends HookConsumerWidget {
                    label: 'search_filter_display_options'.tr(),
                    currentFilter: displayOptionCurrentFilterWidget.value,
                  ),
+                  SearchFilterChip(
+                    icon: Icons.sort_outlined,
+                    onTap: showSortOrderPicker,
+                    label: 'search_filter_sort_order'.tr(),
+                    currentFilter: sortOrderCurrentFilterWidget.value,
+                  ),
                ],
              ),
            ),
@@ -601,7 +644,11 @@ class SearchPage extends HookConsumerWidget {
          if (isSearching.value)
            const Expanded(child: Center(child: CircularProgressIndicator()))
          else
-            SearchResultGrid(onScrollEnd: loadMoreSearchResult, isSearching: isSearching.value),
+            SearchResultGrid(
+              onScrollEnd: loadMoreSearchResult,
+              isSearching: isSearching.value,
+              dragScrollLabelEnabled: filter.value.order != null,
+            ),
        ],
      ),
    );
@@ -611,8 +658,14 @@ class SearchPage extends HookConsumerWidget {
 class SearchResultGrid extends StatelessWidget {
  final VoidCallback onScrollEnd;
  final bool isSearching;
+  final bool dragScrollLabelEnabled;

-  const SearchResultGrid({super.key, required this.onScrollEnd, this.isSearching = false});
+  const SearchResultGrid({
+    super.key,
+    required this.onScrollEnd,
+    this.isSearching = false,
+    this.dragScrollLabelEnabled = false,
+  });

  @override
  Widget build(BuildContext context) {
@@ -640,7 +693,7 @@ class SearchResultGrid extends StatelessWidget {
            editEnabled: true,
            favoriteEnabled: true,
            stackEnabled: false,
-            dragScrollLabelEnabled: false,
+            dragScrollLabelEnabled: dragScrollLabelEnabled,
            emptyIndicator: Padding(
              padding: const EdgeInsets.symmetric(horizontal: 16.0),
              child: !isSearching ? const SearchEmptyContent() : const SizedBox.shrink(),
--- a/mobile/lib/providers/search/paginated_search.provider.dart
+++ b/mobile/lib/providers/search/paginated_search.provider.dart
@@ -8,6 +8,8 @@ import 'package:riverpod_annotation/riverpod_annotation.dart';

 part 'paginated_search.provider.g.dart';

+final searchGroupByProvider = StateProvider<GroupAssetsBy>((ref) => GroupAssetsBy.none);
+
 final paginatedSearchProvider = StateNotifierProvider<PaginatedSearchNotifier, SearchResult>(
  (ref) => PaginatedSearchNotifier(ref.watch(searchServiceProvider)),
 );
@@ -41,6 +43,7 @@ class PaginatedSearchNotifier extends StateNotifier<SearchResult> {
@riverpod
 Future<RenderList> paginatedSearchRenderList(Ref ref) {
  final result = ref.watch(paginatedSearchProvider);
+  final groupBy = ref.watch(searchGroupByProvider);
  final timelineService = ref.watch(timelineServiceProvider);
-  return timelineService.getTimelineFromAssets(result.assets, GroupAssetsBy.none);
+  return timelineService.getTimelineFromAssets(result.assets, groupBy);
 }
--- a/mobile/lib/providers/search/paginated_search.provider.g.dart
+++ b/mobile/lib/providers/search/paginated_search.provider.g.dart
@@ -7,7 +7,7 @@ part of 'paginated_search.provider.dart';
 // **************************************************************************

 String _$paginatedSearchRenderListHash() =>
-    r'22d715ff7864e5a946be38322ce7813616f899c2';
+    r'bb1ea9153b2a186778420426f1fb1add6d6a9140';

 /// See also [paginatedSearchRenderList].
@ProviderFor(paginatedSearchRenderList)
--- a/mobile/lib/widgets/search/search_filter/sort_order_picker.dart
+++ b/mobile/lib/widgets/search/search_filter/sort_order_picker.dart
@@ -0,0 +1,42 @@
+import 'package:easy_localization/easy_localization.dart';
+import 'package:flutter/material.dart';
+import 'package:flutter_hooks/flutter_hooks.dart';
+import 'package:openapi/api.dart' show AssetOrder;
+
+enum _SortOption { bestMatch, newest, oldest }
+
+class SortOrderPicker extends HookWidget {
+  const SortOrderPicker({super.key, required this.onSelect, this.order});
+
+  final Function(AssetOrder?) onSelect;
+  final AssetOrder? order;
+
+  @override
+  Widget build(BuildContext context) {
+    final selected = useState<_SortOption>(switch (order) {
+      AssetOrder.desc => _SortOption.newest,
+      AssetOrder.asc => _SortOption.oldest,
+      _ => _SortOption.bestMatch,
+    });
+
+    return RadioGroup<_SortOption>(
+      onChanged: (value) {
+        if (value == null) return;
+        selected.value = value;
+        onSelect(switch (value) {
+          _SortOption.bestMatch => null,
+          _SortOption.newest => AssetOrder.desc,
+          _SortOption.oldest => AssetOrder.asc,
+        });
+      },
+      groupValue: selected.value,
+      child: Column(
+        children: [
+          RadioListTile(title: const Text('best_match').tr(), value: _SortOption.bestMatch),
+          RadioListTile(title: const Text('newest_first').tr(), value: _SortOption.newest),
+          RadioListTile(title: const Text('oldest_first').tr(), value: _SortOption.oldest),
+        ],
+      ),
+    );
+  }
+}