Skip to content

Commit

Permalink
feat(desktop): Search feature for Events History
Browse files Browse the repository at this point in the history
  • Loading branch information
@bdlukaa
bdlukaa committed Jan 24, 2024
1 parent 78372b7 commit 6558278
Show file tree
Hide file tree
Showing 3 changed files with 100 additions and 36 deletions.
2 changes: 1 addition & 1 deletion lib/widgets/device_grid/desktop/layout_manager.dart
View file
Original file line number Diff line number Diff line change
Expand Up @@ -115,7 +115,7 @@ class _LayoutManagerState extends State<LayoutManager> {
color: IconTheme.of(context).color,
),
tooltip: searchVisible
? 'Disable Search'
? 'Disable search'
: MaterialLocalizations.of(context).searchFieldLabel,
onPressed: () {
setState(() => searchVisible = !searchVisible);
Expand Down
44 changes: 41 additions & 3 deletions lib/widgets/events/events_screen.dart
View file
Original file line number Diff line number Diff line change
Expand Up @@ -37,6 +37,7 @@ import 'package:bluecherry_client/widgets/desktop_buttons.dart';
import 'package:bluecherry_client/widgets/downloads_manager.dart';
import 'package:bluecherry_client/widgets/error_warning.dart';
import 'package:bluecherry_client/widgets/events/event_player_desktop.dart';
import 'package:bluecherry_client/widgets/events_timeline/desktop/timeline_sidebar.dart';
import 'package:bluecherry_client/widgets/misc.dart';
import 'package:flutter/foundation.dart';
import 'package:flutter/material.dart';
Expand Down Expand Up @@ -172,6 +173,11 @@ class EventsScreenState<T extends StatefulWidget> extends State<T> {
});
}

bool searchVisible = false;
final searchController = TextEditingController();
final searchFocusNode = FocusNode();
String searchQuery = '';

@override
Widget build(BuildContext context) {
if (ServersProvider.instance.servers.isEmpty) {
Expand Down Expand Up @@ -205,10 +211,42 @@ class EventsScreenState<T extends StatefulWidget> extends State<T> {
SubHeader(
loc.servers,
height: 38.0,
trailing: Text(
'${ServersProvider.instance.servers.length}',
trailing: Row(
mainAxisAlignment: MainAxisAlignment.end,
children: [
Padding(
padding: const EdgeInsetsDirectional.only(end: 6.0),
child: SquaredIconButton(
icon: Icon(
searchVisible ? Icons.search_off : Icons.search,
size: 20.0,
),
tooltip: searchVisible
? 'Disable search'
: MaterialLocalizations.of(context)
.searchFieldLabel,
onPressed: () {
setState(() => searchVisible = !searchVisible);
if (searchVisible) {
searchFocusNode.requestFocus();
}
},
),
),
Text(
'${ServersProvider.instance.servers.length}',
),
],
),
),
EventsSearchBar(
searchVisible: searchVisible,
searchController: searchController,
searchFocusNode: searchFocusNode,
onSearchChanged: (query) {
super.setState(() => searchQuery = query);
},
),
Expanded(
child: SingleChildScrollView(
child: EventsDevicesPicker(
Expand All @@ -218,7 +256,7 @@ class EventsScreenState<T extends StatefulWidget> extends State<T> {
setState(() => disabledDevices.add(device)),
onDisabledDeviceRemoved: (device) =>
setState(() => disabledDevices.remove(device)),
searchQuery: '', // TODO(bdlukaa):
searchQuery: searchQuery,
),
),
),
Expand Down
90 changes: 58 additions & 32 deletions lib/widgets/events_timeline/desktop/timeline_sidebar.dart
View file
Original file line number Diff line number Diff line change
Expand Up @@ -91,6 +91,9 @@ class _TimelineSidebarState extends State<TimelineSidebar> {
searchVisible ? Icons.search_off : Icons.search,
size: 22.0,
),
tooltip: searchVisible
? 'Disable search'
: MaterialLocalizations.of(context).searchFieldLabel,
onPressed: () {
setState(() => searchVisible = !searchVisible);
if (searchVisible) {
Expand All @@ -103,38 +106,11 @@ class _TimelineSidebarState extends State<TimelineSidebar> {
),
padding: const EdgeInsetsDirectional.only(start: 16.0, end: 4.0),
),
AnimatedSize(
duration: kThemeChangeDuration,
curve: Curves.easeInOut,
child: Builder(builder: (context) {
if (!searchVisible) return const SizedBox.shrink();
return Column(children: [
const Divider(height: 1.0),
Padding(
padding: const EdgeInsets.all(8.0),
child: TextField(
controller: searchController,
focusNode: searchFocusNode,
decoration: const InputDecoration(
hintText: 'Search',
isDense: true,
border: InputBorder.none,
focusedBorder: InputBorder.none,
enabledBorder: InputBorder.none,
contentPadding: EdgeInsetsDirectional.symmetric(
horizontal: 8.0,
vertical: 4.0,
),
),
onChanged: (value) {
setState(() => searchQuery = value);
},
),
),
const Divider(height: 1.0),
const SizedBox(height: 8.0),
]);
}),
EventsSearchBar(
searchVisible: searchVisible,
searchController: searchController,
searchFocusNode: searchFocusNode,
onSearchChanged: (query) => setState(() => searchQuery = query),
),
Expanded(
child: StatefulBuilder(builder: (context, setState) {
Expand Down Expand Up @@ -184,3 +160,53 @@ class _TimelineSidebarState extends State<TimelineSidebar> {
);
}
}

class EventsSearchBar extends StatelessWidget {
final bool searchVisible;
final TextEditingController searchController;
final FocusNode searchFocusNode;
final ValueChanged<String> onSearchChanged;

const EventsSearchBar({
super.key,
required this.searchVisible,
required this.searchController,
required this.searchFocusNode,
required this.onSearchChanged,
});

@override
Widget build(BuildContext context) {
return AnimatedSize(
duration: kThemeChangeDuration,
curve: Curves.easeInOut,
child: Builder(builder: (context) {
if (!searchVisible) return const SizedBox.shrink();
return Column(children: [
const Divider(height: 1.0),
Padding(
padding: const EdgeInsets.all(8.0),
child: TextField(
controller: searchController,
focusNode: searchFocusNode,
decoration: const InputDecoration(
hintText: 'Search',
isDense: true,
border: InputBorder.none,
focusedBorder: InputBorder.none,
enabledBorder: InputBorder.none,
contentPadding: EdgeInsetsDirectional.symmetric(
horizontal: 8.0,
vertical: 4.0,
),
),
onChanged: onSearchChanged,
),
),
const Divider(height: 1.0),
const SizedBox(height: 8.0),
]);
}),
);
}
}

0 comments on commit 6558278

Please sign in to comment.