From 3e96e3a9048a87917c246209104cc42b1c8512de Mon Sep 17 00:00:00 2001 From: Jorge Coca Date: Tue, 28 Nov 2023 04:12:00 -0600 Subject: [PATCH] feat: add search box to results and source answers views (#22) --- lib/home/widgets/question_view.dart | 10 +------- lib/home/widgets/results_view.dart | 18 ++++++++++--- lib/home/widgets/search_box.dart | 25 +++++++++++++++++++ lib/home/widgets/see_source_answers.dart | 4 ++- lib/home/widgets/widgets.dart | 1 + .../widgets/question_input_text_field.dart | 10 ++++++-- test/home/view/home_page_test.dart | 8 +++++- .../home/widgets/see_source_answers_test.dart | 1 + 8 files changed, 60 insertions(+), 17 deletions(-) create mode 100644 lib/home/widgets/search_box.dart diff --git a/lib/home/widgets/question_view.dart b/lib/home/widgets/question_view.dart index 24ad990..9ee7e72 100644 --- a/lib/home/widgets/question_view.dart +++ b/lib/home/widgets/question_view.dart @@ -78,15 +78,7 @@ class _QuestionView extends StatelessWidget { ?.copyWith(color: VertexColors.flutterNavy), ), const SizedBox(height: 40), - QuestionInputTextField( - icon: vertexIcons.stars.image(), - hint: l10n.questionHint, - actionText: l10n.ask, - onTextUpdated: (String query) => - context.read().add(QueryUpdated(query: query)), - onActionPressed: () => - context.read().add(const QuestionAsked()), - ), + const SearchBox(), ], ), ), diff --git a/lib/home/widgets/results_view.dart b/lib/home/widgets/results_view.dart index 1d176e9..ce40036 100644 --- a/lib/home/widgets/results_view.dart +++ b/lib/home/widgets/results_view.dart @@ -11,10 +11,20 @@ class ResultsView extends StatelessWidget { Widget build(BuildContext context) { final response = context.select((HomeBloc bloc) => bloc.state.vertexResponse); - return Stack( - children: [ - Align(child: BlueContainer(summary: response.summary)), - ], + return SingleChildScrollView( + child: Column( + children: [ + const SizedBox(height: 64), + const SearchBox(), + const SizedBox(height: 32), + Stack( + children: [ + Align(child: BlueContainer(summary: response.summary)), + ], + ), + const SizedBox(height: 32), + ], + ), ); } } diff --git a/lib/home/widgets/search_box.dart b/lib/home/widgets/search_box.dart new file mode 100644 index 0000000..0562676 --- /dev/null +++ b/lib/home/widgets/search_box.dart @@ -0,0 +1,25 @@ +import 'package:app_ui/app_ui.dart'; +import 'package:dash_ai_search/home/home.dart'; +import 'package:dash_ai_search/l10n/l10n.dart'; +import 'package:flutter/material.dart'; +import 'package:flutter_bloc/flutter_bloc.dart'; + +class SearchBox extends StatelessWidget { + const SearchBox({super.key}); + + @override + Widget build(BuildContext context) { + final l10n = context.l10n; + final searchQuery = context.select((HomeBloc bloc) => bloc.state.query); + return QuestionInputTextField( + icon: vertexIcons.stars.image(), + hint: l10n.questionHint, + actionText: l10n.ask, + onTextUpdated: (String query) => + context.read().add(QueryUpdated(query: query)), + onActionPressed: () => + context.read().add(const QuestionAsked()), + text: searchQuery.isEmpty ? null : searchQuery, + ); + } +} diff --git a/lib/home/widgets/see_source_answers.dart b/lib/home/widgets/see_source_answers.dart index 9172535..55e24e6 100644 --- a/lib/home/widgets/see_source_answers.dart +++ b/lib/home/widgets/see_source_answers.dart @@ -16,7 +16,9 @@ class SeeSourceAnswers extends StatelessWidget { color: VertexColors.googleBlue, child: Column( children: [ - const SizedBox(height: 100), + const SizedBox(height: 64), + const SearchBox(), + const SizedBox(height: 32), Padding( padding: const EdgeInsets.symmetric(horizontal: 50), child: Row( diff --git a/lib/home/widgets/widgets.dart b/lib/home/widgets/widgets.dart index 69f719a..b05ebbe 100644 --- a/lib/home/widgets/widgets.dart +++ b/lib/home/widgets/widgets.dart @@ -3,5 +3,6 @@ export 'circle.dart'; export 'logo.dart'; export 'question_view.dart'; export 'results_view.dart'; +export 'search_box.dart'; export 'thinking_view.dart'; export 'welcome_view.dart'; diff --git a/packages/app_ui/lib/src/widgets/question_input_text_field.dart b/packages/app_ui/lib/src/widgets/question_input_text_field.dart index 130f83b..e78e267 100644 --- a/packages/app_ui/lib/src/widgets/question_input_text_field.dart +++ b/packages/app_ui/lib/src/widgets/question_input_text_field.dart @@ -13,6 +13,7 @@ class QuestionInputTextField extends StatefulWidget { required this.actionText, required this.onTextUpdated, required this.onActionPressed, + this.text, super.key, }); @@ -31,6 +32,9 @@ class QuestionInputTextField extends StatefulWidget { /// final VoidCallback onActionPressed; + /// Initial text displayed in the text field + final String? text; + @override State createState() => _QuestionTextFieldState(); } @@ -41,7 +45,7 @@ class _QuestionTextFieldState extends State { @override void initState() { super.initState(); - _controller = TextEditingController(); + _controller = TextEditingController(text: widget.text); _controller.addListener(() { widget.onTextUpdated(_controller.text); }); @@ -57,13 +61,15 @@ class _QuestionTextFieldState extends State { Widget build(BuildContext context) { final textTheme = Theme.of(context).textTheme; return Container( - constraints: const BoxConstraints(maxWidth: 659), + constraints: const BoxConstraints(maxWidth: 600), child: TextField( controller: _controller, style: textTheme.bodyMedium?.copyWith( color: VertexColors.flutterNavy, ), decoration: InputDecoration( + filled: true, + fillColor: VertexColors.arctic, prefixIcon: Padding( padding: const EdgeInsets.only(left: 12), child: widget.icon, diff --git a/test/home/view/home_page_test.dart b/test/home/view/home_page_test.dart index bb24eff..d96baea 100644 --- a/test/home/view/home_page_test.dart +++ b/test/home/view/home_page_test.dart @@ -1,6 +1,7 @@ import 'package:bloc_test/bloc_test.dart'; import 'package:dash_ai_search/home/home.dart'; import 'package:dash_ai_search/home/widgets/see_source_answers.dart'; +import 'package:flutter/widgets.dart'; import 'package:flutter_bloc/flutter_bloc.dart'; import 'package:flutter_test/flutter_test.dart'; import 'package:mocktail/mocktail.dart'; @@ -112,7 +113,12 @@ void main() { child: HomeView(), ), ); - expect(find.byType(SeeSourceAnswersButton), findsOneWidget); + final answersFinder = find.byType(SeeSourceAnswersButton); + await tester.dragUntilVisible( + answersFinder, + find.byType(SingleChildScrollView), + const Offset(0, 10), + ); await tester.tap(find.byType(SeeSourceAnswersButton)); verify(() => homeBloc.add(const SeeSourceAnswersRequested())).called(1); }); diff --git a/test/home/widgets/see_source_answers_test.dart b/test/home/widgets/see_source_answers_test.dart index b2e41a9..42a986a 100644 --- a/test/home/widgets/see_source_answers_test.dart +++ b/test/home/widgets/see_source_answers_test.dart @@ -43,6 +43,7 @@ void main() { child: Material(child: SeeSourceAnswers()), ), ); + expect(find.byType(SearchBox), findsOneWidget); expect(find.text(response.summary), findsOneWidget); expect(find.text(response.documents.length.toString()), findsOneWidget); expect(find.byType(Placeholder), findsOneWidget);