Work on implementing search filter in app [WIP]

flutter/lib/components/layout/app_bar.dart

@@ -4,6 +4,7 @@ import 'package:provider/provider.dart';
 import 'package:simplecloudnotifier/components/layout/app_bar_filter_dialog.dart';
 import 'package:simplecloudnotifier/components/layout/app_bar_progress_indicator.dart';
 import 'package:simplecloudnotifier/pages/debug/debug_main.dart';
+import 'package:simplecloudnotifier/pages/message_list/message_filter_chiplet.dart';
 import 'package:simplecloudnotifier/settings/app_settings.dart';
 import 'package:simplecloudnotifier/state/app_bar_state.dart';
 import 'package:simplecloudnotifier/state/app_events.dart';
@@ -108,7 +109,8 @@ class _SCNAppBarState extends State<SCNAppBar> {
               icon: const Icon(FontAwesomeIcons.solidMagnifyingGlass),
               onPressed: () {
                 value.setShowSearchField(false);
-                AppEvents().notifySearchListeners(_ctrlSearchField.text);
+                final chiplet = MessageFilterChiplet(label: _ctrlSearchField.text, value: _ctrlSearchField.text, type: MessageFilterChipletType.search);
+                AppEvents().notifyFilterListeners([MessageFilterChipletType.search], [chiplet]);
                 _ctrlSearchField.clear();
               },
             ),
@@ -157,7 +159,8 @@ class _SCNAppBarState extends State<SCNAppBar> {
       ),
       onSubmitted: (value) {
         AppBarState().setShowSearchField(false);
-        AppEvents().notifySearchListeners(_ctrlSearchField.text);
+        final chiplet = MessageFilterChiplet(label: _ctrlSearchField.text, value: _ctrlSearchField.text, type: MessageFilterChipletType.search);
+        AppEvents().notifyFilterListeners([MessageFilterChipletType.search], [chiplet]);
         _ctrlSearchField.clear();
       },
     );

flutter/lib/components/layout/app_bar_filter_dialog.dart

@@ -1,5 +1,11 @@
 import 'package:flutter/material.dart';
 import 'package:font_awesome_flutter/font_awesome_flutter.dart';
+import 'package:simplecloudnotifier/components/modals/filter_modal_channel.dart';
+import 'package:simplecloudnotifier/components/modals/filter_modal_keytoken.dart';
+import 'package:simplecloudnotifier/components/modals/filter_modal_priority.dart';
+import 'package:simplecloudnotifier/components/modals/filter_modal_sendername.dart';
+import 'package:simplecloudnotifier/components/modals/filter_modal_time.dart';
+import 'package:simplecloudnotifier/state/app_bar_state.dart';
 import 'package:simplecloudnotifier/utils/navi.dart';
 
 class AppBarFilterDialog extends StatefulWidget {
@@ -48,17 +54,17 @@ class _AppBarFilterDialogState extends State<AppBarFilterDialog> {
                   child: Column(
                     children: [
                       SizedBox(height: 4),
-                      _buildFilterItem(context, FontAwesomeIcons.magnifyingGlass, 'Search'),
+                      _buildFilterItem(context, FontAwesomeIcons.magnifyingGlass, 'Search', _showSearch),
                       Divider(),
-                      _buildFilterItem(context, FontAwesomeIcons.snake, 'Channel'),
+                      _buildFilterItem(context, FontAwesomeIcons.snake, 'Channel', _showChannelModal),
                       Divider(),
-                      _buildFilterItem(context, FontAwesomeIcons.signature, 'Sender'),
+                      _buildFilterItem(context, FontAwesomeIcons.signature, 'Sender', _showSenderModal),
                       Divider(),
-                      _buildFilterItem(context, FontAwesomeIcons.timer, 'Time'),
+                      _buildFilterItem(context, FontAwesomeIcons.timer, 'Time', _showTimeModal),
                       Divider(),
-                      _buildFilterItem(context, FontAwesomeIcons.bolt, 'Priority'),
+                      _buildFilterItem(context, FontAwesomeIcons.bolt, 'Priority', _showPriorityModal),
                       Divider(),
-                      _buildFilterItem(context, FontAwesomeIcons.gearCode, 'Key'),
+                      _buildFilterItem(context, FontAwesomeIcons.gearCode, 'Key', _showKeytokenModal),
                       SizedBox(height: 4),
                     ],
                   ),
@@ -72,15 +78,39 @@ class _AppBarFilterDialogState extends State<AppBarFilterDialog> {
     );
   }
 
-  Widget _buildFilterItem(BuildContext context, IconData icon, String label) {
+  Widget _buildFilterItem(BuildContext context, IconData icon, String label, void Function(BuildContext context) action) {
     return ListTile(
       visualDensity: VisualDensity.compact,
       title: Text(label),
       leading: Icon(icon),
       onTap: () {
         Navi.popDialog(context);
-        //TOOD show more...
+        action(context);
       },
     );
   }
+
+  void _showSearch(BuildContext context) {
+    AppBarState().setShowSearchField(true);
+  }
+
+  void _showPriorityModal(BuildContext context) {
+    showDialog<void>(context: context, builder: (BuildContext context) => FilterModalPriority());
+  }
+
+  void _showChannelModal(BuildContext context) {
+    showDialog<void>(context: context, builder: (BuildContext context) => FilterModalChannel());
+  }
+
+  void _showSenderModal(BuildContext context) {
+    showDialog<void>(context: context, builder: (BuildContext context) => FilterModalSendername());
+  }
+
+  void _showKeytokenModal(BuildContext context) {
+    showDialog<void>(context: context, builder: (BuildContext context) => FilterModalKeytoken());
+  }
+
+  void _showTimeModal(BuildContext context) {
+    showDialog<void>(context: context, builder: (BuildContext context) => FilterModalTime());
+  }
 }

flutter/lib/components/modals/filter_modal_channel.dart

@@ -0,0 +1,114 @@
+import 'package:flutter/material.dart';
+import 'package:provider/provider.dart';
+import 'package:simplecloudnotifier/api/api_client.dart';
+import 'package:simplecloudnotifier/models/channel.dart';
+import 'package:simplecloudnotifier/pages/message_list/message_filter_chiplet.dart';
+import 'package:simplecloudnotifier/state/app_auth.dart';
+import 'package:simplecloudnotifier/state/app_events.dart';
+import 'package:simplecloudnotifier/types/immediate_future.dart';
+
+class FilterModalChannel extends StatefulWidget {
+  @override
+  _FilterModalChannelState createState() => _FilterModalChannelState();
+}
+
+class _FilterModalChannelState extends State<FilterModalChannel> {
+  Set<String> _selectedEntries = {};
+
+  late ImmediateFuture<List<Channel>>? _futureChannels;
+
+  @override
+  void initState() {
+    super.initState();
+
+    _futureChannels = null;
+    _futureChannels = ImmediateFuture.ofFuture(() async {
+      final userAcc = Provider.of<AppAuth>(context, listen: false);
+      if (!userAcc.isAuth()) throw new Exception('not logged in');
+
+      final channels = await APIClient.getChannelList(userAcc, ChannelSelector.all);
+
+      return channels.where((p) => p.subscription?.confirmed ?? false).map((e) => e.channel).toList(); // return only subscribed channels
+    }());
+  }
+
+  void toggleEntry(String channelID) {
+    setState(() {
+      if (_selectedEntries.contains(channelID)) {
+        _selectedEntries.remove(channelID);
+      } else {
+        _selectedEntries.add(channelID);
+      }
+    });
+  }
+
+  @override
+  Widget build(BuildContext context) {
+    return AlertDialog(
+      title: const Text('Channels'),
+      content: Container(
+        width: 9000,
+        height: 9000,
+        child: () {
+          if (_futureChannels == null) {
+            return Center(child: CircularProgressIndicator());
+          }
+
+          return FutureBuilder(
+            future: _futureChannels!.future,
+            builder: ((context, snapshot) {
+              if (_futureChannels?.value != null) {
+                return _buildList(context, _futureChannels!.value!);
+              } else if (snapshot.connectionState == ConnectionState.done && snapshot.hasError) {
+                return Text('Error: ${snapshot.error}'); //TODO better error display
+              } else if (snapshot.connectionState == ConnectionState.done) {
+                return _buildList(context, snapshot.data!);
+              } else {
+                return Center(child: CircularProgressIndicator());
+              }
+            }),
+          );
+        }(),
+      ),
+      actions: <Widget>[
+        TextButton(
+          style: TextButton.styleFrom(textStyle: Theme.of(context).textTheme.labelLarge),
+          child: const Text('Apply'),
+          onPressed: () {
+            onOkay();
+          },
+        ),
+      ],
+    );
+  }
+
+  void onOkay() {
+    Navigator.of(context).pop();
+
+    final chiplets = _selectedEntries
+        .map((e) => MessageFilterChiplet(
+              label: _futureChannels?.get()?.map((e) => e as Channel?).firstWhere((p) => p?.channelID == e, orElse: () => null)?.displayName ?? '???',
+              value: e,
+              type: MessageFilterChipletType.channel,
+            ))
+        .toList();
+
+    AppEvents().notifyFilterListeners([MessageFilterChipletType.channel], chiplets);
+  }
+
+  Widget _buildList(BuildContext context, List<Channel> list) {
+    return ListView.builder(
+      shrinkWrap: true,
+      itemBuilder: (builder, index) {
+        final channel = list[index];
+        return ListTile(
+          title: Text(channel.displayName),
+          leading: Icon(_selectedEntries.contains(channel.channelID) ? Icons.check_box : Icons.check_box_outline_blank, color: Theme.of(context).primaryColor),
+          onTap: () => toggleEntry(channel.channelID),
+          visualDensity: VisualDensity(vertical: -4),
+        );
+      },
+      itemCount: list.length,
+    );
+  }
+}

flutter/lib/components/modals/filter_modal_keytoken.dart

@@ -0,0 +1,114 @@
+import 'package:flutter/material.dart';
+import 'package:provider/provider.dart';
+import 'package:simplecloudnotifier/api/api_client.dart';
+import 'package:simplecloudnotifier/models/keytoken.dart';
+import 'package:simplecloudnotifier/pages/message_list/message_filter_chiplet.dart';
+import 'package:simplecloudnotifier/state/app_auth.dart';
+import 'package:simplecloudnotifier/state/app_events.dart';
+import 'package:simplecloudnotifier/types/immediate_future.dart';
+
+class FilterModalKeytoken extends StatefulWidget {
+  @override
+  _FilterModalKeytokenState createState() => _FilterModalKeytokenState();
+}
+
+class _FilterModalKeytokenState extends State<FilterModalKeytoken> {
+  Set<String> _selectedEntries = {};
+
+  late ImmediateFuture<List<KeyToken>>? _futureKeyTokens;
+
+  @override
+  void initState() {
+    super.initState();
+
+    _futureKeyTokens = null;
+    _futureKeyTokens = ImmediateFuture.ofFuture(() async {
+      final userAcc = Provider.of<AppAuth>(context, listen: false);
+      if (!userAcc.isAuth()) throw new Exception('not logged in');
+
+      final toks = await APIClient.getKeyTokenList(userAcc);
+
+      return toks;
+    }());
+  }
+
+  void toggleEntry(String senderID) {
+    setState(() {
+      if (_selectedEntries.contains(senderID)) {
+        _selectedEntries.remove(senderID);
+      } else {
+        _selectedEntries.add(senderID);
+      }
+    });
+  }
+
+  @override
+  Widget build(BuildContext context) {
+    return AlertDialog(
+      title: const Text('Senders'),
+      content: Container(
+        width: 9000,
+        height: 9000,
+        child: () {
+          if (_futureKeyTokens == null) {
+            return Center(child: CircularProgressIndicator());
+          }
+
+          return FutureBuilder(
+            future: _futureKeyTokens!.future,
+            builder: ((context, snapshot) {
+              if (_futureKeyTokens?.value != null) {
+                return _buildList(context, _futureKeyTokens!.value!);
+              } else if (snapshot.connectionState == ConnectionState.done && snapshot.hasError) {
+                return Text('Error: ${snapshot.error}'); //TODO better error display
+              } else if (snapshot.connectionState == ConnectionState.done) {
+                return _buildList(context, snapshot.data!);
+              } else {
+                return Center(child: CircularProgressIndicator());
+              }
+            }),
+          );
+        }(),
+      ),
+      actions: <Widget>[
+        TextButton(
+          style: TextButton.styleFrom(textStyle: Theme.of(context).textTheme.labelLarge),
+          child: const Text('Apply'),
+          onPressed: () {
+            onOkay();
+          },
+        ),
+      ],
+    );
+  }
+
+  void onOkay() {
+    Navigator.of(context).pop();
+
+    final chiplets = _selectedEntries
+        .map((e) => MessageFilterChiplet(
+              label: _futureKeyTokens?.get()?.map((e) => e as KeyToken?).firstWhere((p) => p?.keytokenID == e, orElse: () => null)?.name ?? '???',
+              value: e,
+              type: MessageFilterChipletType.sender,
+            ))
+        .toList();
+
+    AppEvents().notifyFilterListeners([MessageFilterChipletType.sender], chiplets);
+  }
+
+  Widget _buildList(BuildContext context, List<KeyToken> list) {
+    return ListView.builder(
+      shrinkWrap: true,
+      itemBuilder: (builder, index) {
+        final sender = list[index];
+        return ListTile(
+          title: Text(sender.name),
+          leading: Icon(_selectedEntries.contains(sender.keytokenID) ? Icons.check_box : Icons.check_box_outline_blank, color: Theme.of(context).primaryColor),
+          onTap: () => toggleEntry(sender.keytokenID),
+          visualDensity: VisualDensity(vertical: -4),
+        );
+      },
+      itemCount: list.length,
+    );
+  }
+}

flutter/lib/components/modals/filter_modal_priority.dart

@@ -0,0 +1,67 @@
+import 'package:flutter/material.dart';
+import 'package:simplecloudnotifier/pages/message_list/message_filter_chiplet.dart';
+import 'package:simplecloudnotifier/state/app_events.dart';
+
+class FilterModalPriority extends StatefulWidget {
+  @override
+  _FilterModalPriorityState createState() => _FilterModalPriorityState();
+}
+
+class _FilterModalPriorityState extends State<FilterModalPriority> {
+  Set<int> _selectedEntries = {};
+
+  Map<int, (String, String)> _texts = {
+    0: ('Low (0)', 'Low'),
+    1: ('Normal (1)', 'Normal'),
+    2: ('High (2)', 'High'),
+  };
+
+  void toggleEntry(int entry) {
+    setState(() {
+      if (_selectedEntries.contains(entry)) {
+        _selectedEntries.remove(entry);
+      } else {
+        _selectedEntries.add(entry);
+      }
+    });
+  }
+
+  @override
+  Widget build(BuildContext context) {
+    return AlertDialog(
+      title: const Text('Priority'),
+      content: Container(
+        width: 0,
+        height: 200,
+        child: ListView.builder(
+          shrinkWrap: true,
+          itemBuilder: (builder, index) {
+            return ListTile(
+              title: Text(_texts[index]?.$1 ?? '???'),
+              leading: Icon(_selectedEntries.contains(index) ? Icons.check_box : Icons.check_box_outline_blank, color: Theme.of(context).primaryColor),
+              onTap: () => toggleEntry(index),
+            );
+          },
+          itemCount: 3,
+        ),
+      ),
+      actions: <Widget>[
+        TextButton(
+          style: TextButton.styleFrom(textStyle: Theme.of(context).textTheme.labelLarge),
+          child: const Text('Apply'),
+          onPressed: () {
+            onOkay();
+          },
+        ),
+      ],
+    );
+  }
+
+  void onOkay() {
+    Navigator.of(context).pop();
+
+    final chiplets = _selectedEntries.map((e) => MessageFilterChiplet(label: _texts[e]?.$2 ?? '???', value: e, type: MessageFilterChipletType.priority)).toList();
+
+    AppEvents().notifyFilterListeners([MessageFilterChipletType.priority], chiplets);
+  }
+}

flutter/lib/components/modals/filter_modal_sendername.dart

@@ -0,0 +1,113 @@
+import 'package:flutter/material.dart';
+import 'package:provider/provider.dart';
+import 'package:simplecloudnotifier/api/api_client.dart';
+import 'package:simplecloudnotifier/pages/message_list/message_filter_chiplet.dart';
+import 'package:simplecloudnotifier/state/app_auth.dart';
+import 'package:simplecloudnotifier/state/app_events.dart';
+import 'package:simplecloudnotifier/types/immediate_future.dart';
+
+class FilterModalSendername extends StatefulWidget {
+  @override
+  _FilterModalSendernameState createState() => _FilterModalSendernameState();
+}
+
+class _FilterModalSendernameState extends State<FilterModalSendername> {
+  Set<String> _selectedEntries = {};
+
+  late ImmediateFuture<List<String>>? _futureSenders;
+
+  @override
+  void initState() {
+    super.initState();
+
+    _futureSenders = null;
+    _futureSenders = ImmediateFuture.ofFuture(() async {
+      final userAcc = Provider.of<AppAuth>(context, listen: false);
+      if (!userAcc.isAuth()) throw new Exception('not logged in');
+
+      final senders = await APIClient.getSenderNameList(userAcc);
+
+      return senders;
+    }());
+  }
+
+  void toggleEntry(String senderID) {
+    setState(() {
+      if (_selectedEntries.contains(senderID)) {
+        _selectedEntries.remove(senderID);
+      } else {
+        _selectedEntries.add(senderID);
+      }
+    });
+  }
+
+  @override
+  Widget build(BuildContext context) {
+    return AlertDialog(
+      title: const Text('Senders'),
+      content: Container(
+        width: 9000,
+        height: 9000,
+        child: () {
+          if (_futureSenders == null) {
+            return Center(child: CircularProgressIndicator());
+          }
+
+          return FutureBuilder(
+            future: _futureSenders!.future,
+            builder: ((context, snapshot) {
+              if (_futureSenders?.value != null) {
+                return _buildList(context, _futureSenders!.value!);
+              } else if (snapshot.connectionState == ConnectionState.done && snapshot.hasError) {
+                return Text('Error: ${snapshot.error}'); //TODO better error display
+              } else if (snapshot.connectionState == ConnectionState.done) {
+                return _buildList(context, snapshot.data!);
+              } else {
+                return Center(child: CircularProgressIndicator());
+              }
+            }),
+          );
+        }(),
+      ),
+      actions: <Widget>[
+        TextButton(
+          style: TextButton.styleFrom(textStyle: Theme.of(context).textTheme.labelLarge),
+          child: const Text('Apply'),
+          onPressed: () {
+            onOkay();
+          },
+        ),
+      ],
+    );
+  }
+
+  void onOkay() {
+    Navigator.of(context).pop();
+
+    final chiplets = _selectedEntries
+        .map((e) => MessageFilterChiplet(
+              label: e,
+              value: e,
+              type: MessageFilterChipletType.sender,
+            ))
+        .toList();
+
+    AppEvents().notifyFilterListeners([MessageFilterChipletType.sender], chiplets);
+  }
+
+  Widget _buildList(BuildContext context, List<String> list) {
+    return ListView.builder(
+      shrinkWrap: true,
+      itemBuilder: (builder, index) {
+        final sender = list[index];
+        return ListTile(
+          title: Text(sender),
+          leading: Icon(_selectedEntries.contains(sender) ? Icons.check_box : Icons.check_box_outline_blank, color: Theme.of(context).primaryColor),
+          onTap: () => toggleEntry(sender),
+          visualDensity: VisualDensity(vertical: -4),
+        );
+      },
+      itemCount: list.length,
+    );
+  }
+}

flutter/lib/components/modals/filter_modal_time.dart

@@ -0,0 +1,49 @@
+import 'package:flutter/material.dart';
+import 'package:provider/provider.dart';
+import 'package:simplecloudnotifier/api/api_client.dart';
+import 'package:simplecloudnotifier/pages/message_list/message_filter_chiplet.dart';
+import 'package:simplecloudnotifier/state/app_auth.dart';
+import 'package:simplecloudnotifier/state/app_events.dart';
+import 'package:simplecloudnotifier/types/immediate_future.dart';
+
+class FilterModalTime extends StatefulWidget {
+  @override
+  _FilterModalTimeState createState() => _FilterModalTimeState();
+}
+
+class _FilterModalTimeState extends State<FilterModalTime> {
+  DateTime? _tsBefore = null;
+  DateTime? _tsAfter = null;
+
+  @override
+  void initState() {
+    super.initState();
+  }
+
+  @override
+  Widget build(BuildContext context) {
+    return AlertDialog(
+      title: const Text('Timerange'),
+      content: Container(
+        width: 9000,
+        height: 9000,
+        child: Placeholder(),
+      ),
+      actions: <Widget>[
+        TextButton(
+          style: TextButton.styleFrom(textStyle: Theme.of(context).textTheme.labelLarge),
+          child: const Text('Apply'),
+          onPressed: () {
+            onOkay();
+          },
+        ),
+      ],
+    );
+  }
+
+  void onOkay() {
+    Navigator.of(context).pop();
+
+    //TODO
+  }
+}