1
0
mirror of https://github.com/immich-app/immich.git synced 2025-08-10 23:22:22 +02:00

fix(mobile): search page (#10385)

* refactor(search): hide people/places if empty

* refactor(search): remove unused stack

* refactor(search): fix dropdown menu's width

* feat(search): show camera make/model vertically on mobile devices

* fix: lint errors
This commit is contained in:
RanKKI
2024-06-18 01:47:04 +10:00
committed by GitHub
parent a6e767e46d
commit eb987c14c1
11 changed files with 466 additions and 523 deletions

View File

@@ -13,7 +13,7 @@ import 'package:immich_mobile/providers/search/search_page_state.provider.dart';
import 'package:immich_mobile/widgets/search/curated_people_row.dart';
import 'package:immich_mobile/widgets/search/curated_places_row.dart';
import 'package:immich_mobile/widgets/search/person_name_edit_form.dart';
import 'package:immich_mobile/widgets/search/search_row_title.dart';
import 'package:immich_mobile/widgets/search/search_row_section.dart';
import 'package:immich_mobile/routing/router.dart';
import 'package:immich_mobile/entities/asset.entity.dart';
import 'package:immich_mobile/providers/server_info.provider.dart';
@@ -31,7 +31,7 @@ class SearchPage extends HookConsumerWidget {
final curatedPeople = ref.watch(getAllPeopleProvider);
final isMapEnabled =
ref.watch(serverInfoProvider.select((v) => v.serverFeatures.map));
double imageSize = math.min(context.width / 3, 150);
final double imageSize = math.min(context.width / 3, 150);
TextStyle categoryTitleStyle = const TextStyle(
fontWeight: FontWeight.w500,
@@ -53,16 +53,15 @@ class SearchPage extends HookConsumerWidget {
}
buildPeople() {
return SizedBox(
height: imageSize,
child: curatedPeople.widgetWhen(
onError: (error, stack) => const ScaffoldErrorBody(withIcon: false),
onData: (people) => Padding(
padding: const EdgeInsets.only(
left: 16,
top: 8,
),
return curatedPeople.widgetWhen(
onError: (error, stack) => const ScaffoldErrorBody(withIcon: false),
onData: (people) {
return SearchRowSection(
onViewAllPressed: () => context.pushRoute(const AllPeopleRoute()),
title: "search_page_people".tr(),
isEmpty: people.isEmpty,
child: CuratedPeopleRow(
padding: const EdgeInsets.symmetric(horizontal: 16),
content: people
.map((e) => SearchCuratedContent(label: e.name, id: e.id))
.take(12)
@@ -79,42 +78,46 @@ class SearchPage extends HookConsumerWidget {
showNameEditModel(person.id, person.label),
},
),
),
),
);
},
);
}
buildPlaces() {
return SizedBox(
height: imageSize,
child: places.widgetWhen(
onError: (error, stack) => const ScaffoldErrorBody(withIcon: false),
onData: (data) => CuratedPlacesRow(
isMapEnabled: isMapEnabled,
content: data,
imageSize: imageSize,
onTap: (content, index) {
context.pushRoute(
SearchInputRoute(
prefilter: SearchFilter(
people: {},
location: SearchLocationFilter(
city: content.label,
return places.widgetWhen(
onError: (error, stack) => const ScaffoldErrorBody(withIcon: false),
onData: (data) {
return SearchRowSection(
onViewAllPressed: () => context.pushRoute(const AllPlacesRoute()),
title: "search_page_places".tr(),
isEmpty: !isMapEnabled && data.isEmpty,
child: CuratedPlacesRow(
isMapEnabled: isMapEnabled,
content: data,
imageSize: imageSize,
onTap: (content, index) {
context.pushRoute(
SearchInputRoute(
prefilter: SearchFilter(
people: {},
location: SearchLocationFilter(
city: content.label,
),
camera: SearchCameraFilter(),
date: SearchDateFilter(),
display: SearchDisplayFilters(
isNotInAlbum: false,
isArchive: false,
isFavorite: false,
),
mediaType: AssetType.other,
),
camera: SearchCameraFilter(),
date: SearchDateFilter(),
display: SearchDisplayFilters(
isNotInAlbum: false,
isArchive: false,
isFavorite: false,
),
mediaType: AssetType.other,
),
),
);
},
),
),
);
},
),
);
},
);
}
@@ -160,88 +163,73 @@ class SearchPage extends HookConsumerWidget {
return Scaffold(
appBar: const ImmichAppBar(),
body: Stack(
body: ListView(
children: [
ListView(
children: [
buildSearchButton(),
SearchRowTitle(
title: "search_page_people".tr(),
onViewAllPressed: () =>
context.pushRoute(const AllPeopleRoute()),
buildSearchButton(),
const SizedBox(height: 8.0),
buildPeople(),
const SizedBox(height: 8.0),
buildPlaces(),
const SizedBox(height: 24.0),
Padding(
padding: const EdgeInsets.symmetric(horizontal: 16),
child: Text(
'search_page_your_activity',
style: context.textTheme.bodyLarge?.copyWith(
fontWeight: FontWeight.w500,
),
buildPeople(),
SearchRowTitle(
title: "search_page_places".tr(),
onViewAllPressed: () =>
context.pushRoute(const AllPlacesRoute()),
top: 0,
).tr(),
),
ListTile(
leading: Icon(
Icons.favorite_border_rounded,
color: categoryIconColor,
),
title:
Text('search_page_favorites', style: categoryTitleStyle).tr(),
onTap: () => context.pushRoute(const FavoritesRoute()),
),
const CategoryDivider(),
ListTile(
leading: Icon(
Icons.schedule_outlined,
color: categoryIconColor,
),
title: Text(
'search_page_recently_added',
style: categoryTitleStyle,
).tr(),
onTap: () => context.pushRoute(const RecentlyAddedRoute()),
),
const SizedBox(height: 24.0),
Padding(
padding: const EdgeInsets.symmetric(horizontal: 16.0),
child: Text(
'search_page_categories',
style: context.textTheme.bodyLarge?.copyWith(
fontWeight: FontWeight.w500,
),
const SizedBox(height: 10.0),
buildPlaces(),
const SizedBox(height: 24.0),
Padding(
padding: const EdgeInsets.symmetric(horizontal: 16),
child: Text(
'search_page_your_activity',
style: context.textTheme.bodyLarge?.copyWith(
fontWeight: FontWeight.w500,
),
).tr(),
),
ListTile(
leading: Icon(
Icons.favorite_border_rounded,
color: categoryIconColor,
),
title: Text('search_page_favorites', style: categoryTitleStyle)
.tr(),
onTap: () => context.pushRoute(const FavoritesRoute()),
),
const CategoryDivider(),
ListTile(
leading: Icon(
Icons.schedule_outlined,
color: categoryIconColor,
),
title: Text(
'search_page_recently_added',
style: categoryTitleStyle,
).tr(),
onTap: () => context.pushRoute(const RecentlyAddedRoute()),
),
const SizedBox(height: 24.0),
Padding(
padding: const EdgeInsets.symmetric(horizontal: 16.0),
child: Text(
'search_page_categories',
style: context.textTheme.bodyLarge?.copyWith(
fontWeight: FontWeight.w500,
),
).tr(),
),
ListTile(
title:
Text('search_page_videos', style: categoryTitleStyle).tr(),
leading: Icon(
Icons.play_circle_outline,
color: categoryIconColor,
),
onTap: () => context.pushRoute(const AllVideosRoute()),
),
const CategoryDivider(),
ListTile(
title: Text(
'search_page_motion_photos',
style: categoryTitleStyle,
).tr(),
leading: Icon(
Icons.motion_photos_on_outlined,
color: categoryIconColor,
),
onTap: () => context.pushRoute(const AllMotionPhotosRoute()),
),
],
).tr(),
),
ListTile(
title: Text('search_page_videos', style: categoryTitleStyle).tr(),
leading: Icon(
Icons.play_circle_outline,
color: categoryIconColor,
),
onTap: () => context.pushRoute(const AllVideosRoute()),
),
const CategoryDivider(),
ListTile(
title: Text(
'search_page_motion_photos',
style: categoryTitleStyle,
).tr(),
leading: Icon(
Icons.motion_photos_on_outlined,
color: categoryIconColor,
),
onTap: () => context.pushRoute(const AllMotionPhotosRoute()),
),
],
),