feat(category): add autocomplete for subcategories
This commit is contained in:
@@ -125,6 +125,9 @@ class _ManualRestaurantInputScreenState
|
|||||||
final categories = ref
|
final categories = ref
|
||||||
.watch(categoriesProvider)
|
.watch(categoriesProvider)
|
||||||
.maybeWhen(data: (list) => list, orElse: () => const <String>[]);
|
.maybeWhen(data: (list) => list, orElse: () => const <String>[]);
|
||||||
|
final subCategories = ref
|
||||||
|
.watch(subCategoriesProvider)
|
||||||
|
.maybeWhen(data: (list) => list, orElse: () => const <String>[]);
|
||||||
|
|
||||||
return Scaffold(
|
return Scaffold(
|
||||||
appBar: AppBar(
|
appBar: AppBar(
|
||||||
@@ -155,6 +158,7 @@ class _ManualRestaurantInputScreenState
|
|||||||
longitudeController: _longitudeController,
|
longitudeController: _longitudeController,
|
||||||
onFieldChanged: _onFieldChanged,
|
onFieldChanged: _onFieldChanged,
|
||||||
categories: categories,
|
categories: categories,
|
||||||
|
subCategories: subCategories,
|
||||||
),
|
),
|
||||||
const SizedBox(height: 24),
|
const SizedBox(height: 24),
|
||||||
Row(
|
Row(
|
||||||
|
|||||||
@@ -16,6 +16,7 @@ class AddRestaurantForm extends StatefulWidget {
|
|||||||
final TextEditingController longitudeController;
|
final TextEditingController longitudeController;
|
||||||
final Function(String) onFieldChanged;
|
final Function(String) onFieldChanged;
|
||||||
final List<String> categories;
|
final List<String> categories;
|
||||||
|
final List<String> subCategories;
|
||||||
|
|
||||||
const AddRestaurantForm({
|
const AddRestaurantForm({
|
||||||
super.key,
|
super.key,
|
||||||
@@ -31,6 +32,7 @@ class AddRestaurantForm extends StatefulWidget {
|
|||||||
required this.longitudeController,
|
required this.longitudeController,
|
||||||
required this.onFieldChanged,
|
required this.onFieldChanged,
|
||||||
this.categories = const <String>[],
|
this.categories = const <String>[],
|
||||||
|
this.subCategories = const <String>[],
|
||||||
});
|
});
|
||||||
|
|
||||||
@override
|
@override
|
||||||
@@ -39,26 +41,52 @@ class AddRestaurantForm extends StatefulWidget {
|
|||||||
|
|
||||||
class _AddRestaurantFormState extends State<AddRestaurantForm> {
|
class _AddRestaurantFormState extends State<AddRestaurantForm> {
|
||||||
late final FocusNode _categoryFocusNode;
|
late final FocusNode _categoryFocusNode;
|
||||||
|
late final FocusNode _subCategoryFocusNode;
|
||||||
late Set<String> _availableCategories;
|
late Set<String> _availableCategories;
|
||||||
|
late Set<String> _availableSubCategories;
|
||||||
|
|
||||||
@override
|
@override
|
||||||
void initState() {
|
void initState() {
|
||||||
super.initState();
|
super.initState();
|
||||||
_categoryFocusNode = FocusNode();
|
_categoryFocusNode = FocusNode();
|
||||||
|
_subCategoryFocusNode = FocusNode();
|
||||||
_availableCategories = {...widget.categories};
|
_availableCategories = {...widget.categories};
|
||||||
|
_availableSubCategories = {...widget.subCategories};
|
||||||
|
final currentCategory = widget.categoryController.text.trim();
|
||||||
|
if (currentCategory.isNotEmpty) {
|
||||||
|
_availableCategories.add(currentCategory);
|
||||||
|
}
|
||||||
|
final currentSubCategory = widget.subCategoryController.text.trim();
|
||||||
|
if (currentSubCategory.isNotEmpty) {
|
||||||
|
_availableSubCategories.add(currentSubCategory);
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
@override
|
@override
|
||||||
void didUpdateWidget(covariant AddRestaurantForm oldWidget) {
|
void didUpdateWidget(covariant AddRestaurantForm oldWidget) {
|
||||||
super.didUpdateWidget(oldWidget);
|
super.didUpdateWidget(oldWidget);
|
||||||
if (!setEquals(oldWidget.categories.toSet(), widget.categories.toSet())) {
|
if (!setEquals(oldWidget.categories.toSet(), widget.categories.toSet())) {
|
||||||
_availableCategories = {..._availableCategories, ...widget.categories};
|
setState(() {
|
||||||
|
_availableCategories = {...widget.categories, ..._availableCategories};
|
||||||
|
});
|
||||||
|
}
|
||||||
|
if (!setEquals(
|
||||||
|
oldWidget.subCategories.toSet(),
|
||||||
|
widget.subCategories.toSet(),
|
||||||
|
)) {
|
||||||
|
setState(() {
|
||||||
|
_availableSubCategories = {
|
||||||
|
...widget.subCategories,
|
||||||
|
..._availableSubCategories,
|
||||||
|
};
|
||||||
|
});
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
@override
|
@override
|
||||||
void dispose() {
|
void dispose() {
|
||||||
_categoryFocusNode.dispose();
|
_categoryFocusNode.dispose();
|
||||||
|
_subCategoryFocusNode.dispose();
|
||||||
super.dispose();
|
super.dispose();
|
||||||
}
|
}
|
||||||
|
|
||||||
@@ -95,19 +123,7 @@ class _AddRestaurantFormState extends State<AddRestaurantForm> {
|
|||||||
children: [
|
children: [
|
||||||
Expanded(child: _buildCategoryField(context)),
|
Expanded(child: _buildCategoryField(context)),
|
||||||
const SizedBox(width: 8),
|
const SizedBox(width: 8),
|
||||||
Expanded(
|
Expanded(child: _buildSubCategoryField(context)),
|
||||||
child: TextFormField(
|
|
||||||
controller: widget.subCategoryController,
|
|
||||||
decoration: InputDecoration(
|
|
||||||
labelText: '세부 카테고리',
|
|
||||||
hintText: '예: 갈비',
|
|
||||||
border: OutlineInputBorder(
|
|
||||||
borderRadius: BorderRadius.circular(8),
|
|
||||||
),
|
|
||||||
),
|
|
||||||
onChanged: widget.onFieldChanged,
|
|
||||||
),
|
|
||||||
),
|
|
||||||
],
|
],
|
||||||
),
|
),
|
||||||
const SizedBox(height: 16),
|
const SizedBox(height: 16),
|
||||||
@@ -339,4 +355,90 @@ class _AddRestaurantFormState extends State<AddRestaurantForm> {
|
|||||||
},
|
},
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
Widget _buildSubCategoryField(BuildContext context) {
|
||||||
|
return RawAutocomplete<String>(
|
||||||
|
textEditingController: widget.subCategoryController,
|
||||||
|
focusNode: _subCategoryFocusNode,
|
||||||
|
optionsBuilder: (TextEditingValue value) {
|
||||||
|
final query = value.text.trim();
|
||||||
|
if (query.isEmpty) {
|
||||||
|
return _availableSubCategories;
|
||||||
|
}
|
||||||
|
|
||||||
|
final lowerQuery = query.toLowerCase();
|
||||||
|
final matches = _availableSubCategories
|
||||||
|
.where((c) => c.toLowerCase().contains(lowerQuery))
|
||||||
|
.toList();
|
||||||
|
|
||||||
|
final hasExactMatch = _availableSubCategories.any(
|
||||||
|
(c) => c.toLowerCase() == lowerQuery,
|
||||||
|
);
|
||||||
|
if (!hasExactMatch && query.isNotEmpty) {
|
||||||
|
matches.insert(0, query);
|
||||||
|
}
|
||||||
|
|
||||||
|
return matches;
|
||||||
|
},
|
||||||
|
displayStringForOption: (option) => option,
|
||||||
|
onSelected: (option) {
|
||||||
|
final normalized = option.trim();
|
||||||
|
widget.subCategoryController.text = normalized;
|
||||||
|
if (normalized.isNotEmpty) {
|
||||||
|
setState(() {
|
||||||
|
_availableSubCategories.add(normalized);
|
||||||
|
});
|
||||||
|
}
|
||||||
|
widget.onFieldChanged(normalized);
|
||||||
|
},
|
||||||
|
fieldViewBuilder:
|
||||||
|
(context, textEditingController, focusNode, onFieldSubmitted) {
|
||||||
|
return TextFormField(
|
||||||
|
controller: textEditingController,
|
||||||
|
focusNode: focusNode,
|
||||||
|
decoration: InputDecoration(
|
||||||
|
labelText: '세부 카테고리',
|
||||||
|
hintText: '예: 갈비',
|
||||||
|
border: OutlineInputBorder(
|
||||||
|
borderRadius: BorderRadius.circular(8),
|
||||||
|
),
|
||||||
|
suffixIcon: const Icon(Icons.arrow_drop_down),
|
||||||
|
),
|
||||||
|
onChanged: widget.onFieldChanged,
|
||||||
|
onFieldSubmitted: (_) => onFieldSubmitted(),
|
||||||
|
);
|
||||||
|
},
|
||||||
|
optionsViewBuilder: (context, onSelected, options) {
|
||||||
|
return Align(
|
||||||
|
alignment: Alignment.topLeft,
|
||||||
|
child: Material(
|
||||||
|
elevation: 4,
|
||||||
|
borderRadius: BorderRadius.circular(8),
|
||||||
|
child: ConstrainedBox(
|
||||||
|
constraints: const BoxConstraints(maxHeight: 220, minWidth: 200),
|
||||||
|
child: ListView.builder(
|
||||||
|
padding: EdgeInsets.zero,
|
||||||
|
shrinkWrap: true,
|
||||||
|
itemCount: options.length,
|
||||||
|
itemBuilder: (context, index) {
|
||||||
|
final option = options.elementAt(index);
|
||||||
|
final isNewEntry = !_availableSubCategories.contains(option);
|
||||||
|
return ListTile(
|
||||||
|
dense: true,
|
||||||
|
title: Text(
|
||||||
|
isNewEntry ? '새 세부 카테고리 추가: $option' : option,
|
||||||
|
style: TextStyle(
|
||||||
|
fontWeight: isNewEntry ? FontWeight.w600 : null,
|
||||||
|
),
|
||||||
|
),
|
||||||
|
onTap: () => onSelected(option),
|
||||||
|
);
|
||||||
|
},
|
||||||
|
),
|
||||||
|
),
|
||||||
|
),
|
||||||
|
);
|
||||||
|
},
|
||||||
|
);
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -166,6 +166,9 @@ class _EditRestaurantDialogState extends ConsumerState<EditRestaurantDialog> {
|
|||||||
final categories = ref
|
final categories = ref
|
||||||
.watch(categoriesProvider)
|
.watch(categoriesProvider)
|
||||||
.maybeWhen(data: (list) => list, orElse: () => const <String>[]);
|
.maybeWhen(data: (list) => list, orElse: () => const <String>[]);
|
||||||
|
final subCategories = ref
|
||||||
|
.watch(subCategoriesProvider)
|
||||||
|
.maybeWhen(data: (list) => list, orElse: () => const <String>[]);
|
||||||
|
|
||||||
return Dialog(
|
return Dialog(
|
||||||
backgroundColor: isDark ? AppColors.darkSurface : AppColors.lightSurface,
|
backgroundColor: isDark ? AppColors.darkSurface : AppColors.lightSurface,
|
||||||
@@ -197,6 +200,7 @@ class _EditRestaurantDialogState extends ConsumerState<EditRestaurantDialog> {
|
|||||||
longitudeController: _longitudeController,
|
longitudeController: _longitudeController,
|
||||||
onFieldChanged: _onFieldChanged,
|
onFieldChanged: _onFieldChanged,
|
||||||
categories: categories,
|
categories: categories,
|
||||||
|
subCategories: subCategories,
|
||||||
),
|
),
|
||||||
const SizedBox(height: 24),
|
const SizedBox(height: 24),
|
||||||
Row(
|
Row(
|
||||||
|
|||||||
@@ -78,6 +78,21 @@ final categoriesProvider = StreamProvider<List<String>>((ref) {
|
|||||||
});
|
});
|
||||||
});
|
});
|
||||||
|
|
||||||
|
/// 세부 카테고리 목록 Provider
|
||||||
|
final subCategoriesProvider = StreamProvider<List<String>>((ref) {
|
||||||
|
final restaurantsStream = ref.watch(restaurantListProvider.stream);
|
||||||
|
return restaurantsStream.map((restaurants) {
|
||||||
|
final subCategories =
|
||||||
|
restaurants
|
||||||
|
.map((r) => r.subCategory)
|
||||||
|
.where((s) => s.isNotEmpty)
|
||||||
|
.toSet()
|
||||||
|
.toList()
|
||||||
|
..sort();
|
||||||
|
return subCategories;
|
||||||
|
});
|
||||||
|
});
|
||||||
|
|
||||||
/// 맛집 관리 StateNotifier
|
/// 맛집 관리 StateNotifier
|
||||||
class RestaurantNotifier extends StateNotifier<AsyncValue<void>> {
|
class RestaurantNotifier extends StateNotifier<AsyncValue<void>> {
|
||||||
final RestaurantRepository _repository;
|
final RestaurantRepository _repository;
|
||||||
|
|||||||
Reference in New Issue
Block a user