Implement search in ports tab

This commit is contained in:
2024-07-08 10:22:11 +02:00
parent fd626950de
commit c6b714747c

View File

@ -15,6 +15,9 @@ class PortsTab extends StatefulWidget {
}
class _PortsTabState extends State<PortsTab> {
final searchController = TextEditingController();
String searchText = "";
void onEditPort(mixer.Port port) {
CreatePortDialog().show(context, widget.sendAction, port, false);
}
@ -48,48 +51,75 @@ class _PortsTabState extends State<PortsTab> {
child: Padding(
padding: const EdgeInsets.all(8.0),
child: Column(
children: [...widget.mixerState.inputs, ...widget.mixerState.outputs]
.indexed
.map(
(elem) => Card(
child: ListTile(
leading: (elem.$1 >= widget.mixerState.inputs.length)
? const Icon(Icons.speaker_outlined)
: const Icon(Icons.mic_none_outlined),
title: Text(elem.$2.name),
subtitle: Text('Backend: ${elem.$2.properties.backend}'),
trailing: PopupMenuButton<MenuAction>(
tooltip: "More Options",
onSelected: (MenuAction item) {
switch (item) {
case MenuAction.edit:
onEditPort(elem.$2);
case MenuAction.delete:
onDeletePort(elem.$2);
}
},
itemBuilder: (BuildContext context) =>
<PopupMenuEntry<MenuAction>>[
const PopupMenuItem<MenuAction>(
value: MenuAction.edit,
child: ListTile(
leading: Icon(Icons.mode_edit),
title: Text('Edit'),
),
children: [
TextField(
decoration: InputDecoration(
prefixIcon: const Icon(Icons.search),
suffixIcon: IconButton(
icon: const Icon(Icons.clear),
onPressed: () {
setState(() {
searchController.text = "";
searchText = "";
});
},
),
labelText: 'Search',
border: const OutlineInputBorder(),
),
onChanged: (val) {
setState(() {
searchText = val;
});
},
controller: searchController),
const SizedBox(height: 10),
...[...widget.mixerState.inputs, ...widget.mixerState.outputs]
.indexed
.where((elem) {
return elem.$2.name
.toLowerCase()
.contains(searchText.toLowerCase());
}).map(
(elem) => Card(
child: ListTile(
leading: (elem.$1 >= widget.mixerState.inputs.length)
? const Icon(Icons.speaker_outlined)
: const Icon(Icons.mic_none_outlined),
title: Text(elem.$2.name),
subtitle: Text('Backend: ${elem.$2.properties.backend}'),
trailing: PopupMenuButton<MenuAction>(
tooltip: "More Options",
onSelected: (MenuAction item) {
switch (item) {
case MenuAction.edit:
onEditPort(elem.$2);
case MenuAction.delete:
onDeletePort(elem.$2);
}
},
itemBuilder: (BuildContext context) =>
<PopupMenuEntry<MenuAction>>[
const PopupMenuItem<MenuAction>(
value: MenuAction.edit,
child: ListTile(
leading: Icon(Icons.mode_edit),
title: Text('Edit'),
),
const PopupMenuItem<MenuAction>(
value: MenuAction.delete,
child: ListTile(
leading: Icon(Icons.delete),
title: Text('Delete'),
),
),
const PopupMenuItem<MenuAction>(
value: MenuAction.delete,
child: ListTile(
leading: Icon(Icons.delete),
title: Text('Delete'),
),
],
),
),
],
),
),
)
.toList(),
),
)
],
),
),
);