helpy4/immich
1
0
Fork 0
mirror of https://github.com/immich-app/immich synced 2025-11-07 17:27:20 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions

chore(mobile): search field in separate widget (#16977)

Browse source 
* chore(mobile): search field in separate widget

* fix: removed unnecessary use of context

* chore: minor styling tweak

* fix: controller not bound

---------

Co-authored-by: Alex <alex.tran1502@gmail.com>
This commit is contained in:
Yaros 2025-03-24 20:40:33 +01:00 • committed by GitHub
parent 8bc80076bb
commit a651a4bf0e
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
4 changed files with 106 additions and 120 deletions
Download patch file Download diff file Expand all files Collapse all files

79
mobile/lib/widgets/common/search_field.dart Normal file
View file

@ -0,0 +1,79 @@
import 'package:flutter/material.dart';
import 'package:immich_mobile/extensions/build_context_extensions.dart';
import 'package:immich_mobile/extensions/theme_extensions.dart';
class SearchField extends StatelessWidget {
const SearchField({
super.key,
required this.hintText,
this.autofocus = false,
this.controller,
this.focusNode,
this.onChanged,
this.onSubmitted,
this.onTapOutside,
this.contentPadding = const EdgeInsets.only(left: 24),
this.prefixIcon,
this.suffixIcon,
this.filled = false,
});
final FocusNode? focusNode;
final void Function(String)? onChanged;
final void Function(String)? onSubmitted;
final void Function(PointerDownEvent)? onTapOutside;
final TextEditingController? controller;
final String hintText;
final EdgeInsetsGeometry contentPadding;
final Widget? prefixIcon;
final Widget? suffixIcon;
final bool autofocus;
final bool filled;
@override
Widget build(BuildContext context) {
return TextField(
controller: controller,
autofocus: autofocus,
focusNode: focusNode,
onChanged: onChanged,
onTapOutside: onTapOutside ?? (_) => focusNode?.unfocus(),
onSubmitted: onSubmitted,
decoration: InputDecoration(
contentPadding: contentPadding,
filled: filled,
fillColor: context.primaryColor.withValues(alpha: 0.1),
hintStyle: context.textTheme.bodyLarge?.copyWith(
color: context.themeData.colorScheme.onSurfaceSecondary,
),
border: OutlineInputBorder(
borderRadius: BorderRadius.circular(25),
borderSide: BorderSide(
color: context.colorScheme.surfaceDim,
),
),
enabledBorder: OutlineInputBorder(
borderRadius: BorderRadius.circular(25),
borderSide: BorderSide(
color: context.colorScheme.surfaceContainer,
),
),
disabledBorder: OutlineInputBorder(
borderRadius: BorderRadius.circular(25),
borderSide: BorderSide(
color: context.colorScheme.surfaceDim,
),
),
focusedBorder: OutlineInputBorder(
borderRadius: BorderRadius.circular(25),
borderSide: BorderSide(
color: context.colorScheme.primary.withAlpha(100),
),
),
prefixIcon: prefixIcon,
suffixIcon: suffixIcon,
hintText: hintText,
),
);
}
}

43
mobile/lib/widgets/search/search_filter/people_picker.dart
View file

@ -4,12 +4,12 @@ import 'package:flutter_hooks/flutter_hooks.dart';
import 'package:hooks_riverpod/hooks_riverpod.dart';
import 'package:immich_mobile/extensions/asyncvalue_extensions.dart';
import 'package:immich_mobile/extensions/build_context_extensions.dart';
import 'package:immich_mobile/extensions/theme_extensions.dart';
import 'package:immich_mobile/interfaces/person_api.interface.dart';
import 'package:immich_mobile/pages/common/large_leading_tile.dart';
import 'package:immich_mobile/providers/search/people.provider.dart';
import 'package:immich_mobile/services/api.service.dart';
import 'package:immich_mobile/utils/image_url_builder.dart';
import 'package:immich_mobile/widgets/common/search_field.dart';
class PeoplePicker extends HookConsumerWidget {
const PeoplePicker({super.key, required this.onSelect, this.filter});
@ -30,47 +30,12 @@ class PeoplePicker extends HookConsumerWidget {
children: [
Padding(
padding: const EdgeInsets.all(8),
child: TextField(
child: SearchField(
focusNode: formFocus,
onChanged: (value) => searchQuery.value = value,
onTapOutside: (_) => formFocus.unfocus(),
decoration: InputDecoration(
contentPadding: const EdgeInsets.only(left: 24),
filled: true,
fillColor: context.primaryColor.withValues(alpha: 0.1),
hintStyle: context.textTheme.bodyLarge?.copyWith(
color: context.themeData.colorScheme.onSurfaceSecondary,
),
border: OutlineInputBorder(
borderRadius: BorderRadius.circular(25),
borderSide: BorderSide(
color: context.colorScheme.surfaceContainerHighest,
),
),
enabledBorder: OutlineInputBorder(
borderRadius: BorderRadius.circular(25),
borderSide: BorderSide(
color: context.colorScheme.surfaceContainerHighest,
),
),
disabledBorder: OutlineInputBorder(
borderRadius: BorderRadius.circular(25),
borderSide: BorderSide(
color: context.colorScheme.surfaceContainerHighest,
),
),
focusedBorder: OutlineInputBorder(
borderRadius: BorderRadius.circular(25),
borderSide: BorderSide(
color: context.colorScheme.primary.withAlpha(150),
),
),
prefixIcon: Icon(
Icons.search_rounded,
color: context.colorScheme.primary,
),
hintText: 'search_filter_people_hint'.tr(),
),
filled: true,
hintText: 'search_filter_people_hint'.tr(),
),
),
Padding(