#54 snippet group

lib/view/page/snippet/edit.dart

@@ -1,7 +1,6 @@
 import 'package:after_layout/after_layout.dart';
 import 'package:flutter/material.dart';
 import 'package:flutter_gen/gen_l10n/l10n.dart';
-import 'package:nil/nil.dart';
 import 'package:toolbox/core/extension/navigator.dart';
 import 'package:toolbox/view/widget/input_field.dart';
 
@@ -10,6 +9,7 @@ import '../../../data/model/server/snippet.dart';
 import '../../../data/provider/snippet.dart';
 import '../../../data/res/ui.dart';
 import '../../../locator.dart';
+import '../../widget/tag_editor.dart';
 
 class SnippetEditPage extends StatefulWidget {
   const SnippetEditPage({Key? key, this.snippet}) : super(key: key);
@@ -29,6 +29,8 @@ class _SnippetEditPageState extends State<SnippetEditPage>
   late SnippetProvider _provider;
   late S _s;
 
+  List<String> _tags = [];
+
   @override
   void initState() {
     super.initState();
@@ -46,24 +48,29 @@ class _SnippetEditPageState extends State<SnippetEditPage>
     return Scaffold(
       appBar: AppBar(
         title: Text(_s.edit, style: textSize18),
-        actions: [
-          widget.snippet != null
-              ? IconButton(
-                  onPressed: () {
-                    _provider.del(widget.snippet!);
-                    context.pop();
-                  },
-                  tooltip: _s.delete,
-                  icon: const Icon(Icons.delete),
-                )
-              : nil
-        ],
+        actions: _buildAppBarActions(),
       ),
       body: _buildBody(),
       floatingActionButton: _buildFAB(),
     );
   }
 
+  List<Widget>? _buildAppBarActions() {
+    if (widget.snippet == null) {
+      return null;
+    }
+    return [
+      IconButton(
+        onPressed: () {
+          _provider.del(widget.snippet!);
+          context.pop();
+        },
+        tooltip: _s.delete,
+        icon: const Icon(Icons.delete),
+      )
+    ];
+  }
+
   Widget _buildFAB() {
     return FloatingActionButton(
       heroTag: 'snippet',
@@ -75,7 +82,7 @@ class _SnippetEditPageState extends State<SnippetEditPage>
           showSnackBar(context, Text(_s.fieldMustNotEmpty));
           return;
         }
-        final snippet = Snippet(name, script);
+        final snippet = Snippet(name, script, _tags);
         if (widget.snippet != null) {
           _provider.update(widget.snippet!, snippet);
         } else {
@@ -106,6 +113,15 @@ class _SnippetEditPageState extends State<SnippetEditPage>
           label: _s.snippet,
           icon: Icons.code,
         ),
+        TagEditor(
+          tags: _tags,
+          onChanged: (p0) => setState(() {
+            _tags = p0;
+          }),
+          s: _s,
+          tagSuggestions: [..._provider.tags],
+          onRenameTag: _provider.renameTag,
+        )
       ],
     );
   }

lib/view/page/snippet/list.dart

@@ -1,7 +1,11 @@
 import 'package:flutter/material.dart';
 import 'package:flutter_gen/gen_l10n/l10n.dart';
 import 'package:provider/provider.dart';
+import 'package:toolbox/core/extension/order.dart';
+import 'package:toolbox/view/widget/tag_switcher.dart';
 
+import '../../../data/store/setting.dart';
+import '../../../locator.dart';
 import '/core/route.dart';
 import '/data/provider/snippet.dart';
 import 'edit.dart';
@@ -16,11 +20,17 @@ class SnippetListPage extends StatefulWidget {
 
 class _SnippetListPageState extends State<SnippetListPage> {
   late S _s;
+  late MediaQueryData _media;
+
+  final _settingStore = locator<SettingStore>();
+
+  String? _tag;
 
   @override
   void didChangeDependencies() {
     super.didChangeDependencies();
     _s = S.of(context)!;
+    _media = MediaQuery.of(context);
   }
 
   @override
@@ -47,26 +57,48 @@ class _SnippetListPageState extends State<SnippetListPage> {
           );
         }
 
-        return ListView.builder(
+        final filtered = provider.snippets
+            .where((e) => _tag == null || (e.tags?.contains(_tag) ?? false))
+            .toList();
+
+        return ReorderableListView.builder(
           padding: const EdgeInsets.all(13),
-          itemCount: provider.snippets.length,
+          itemCount: filtered.length,
+          onReorder: (oldIdx, newIdx) => setState(() {
+            provider.snippets.moveById(
+              filtered[oldIdx],
+              filtered[newIdx],
+              onMove: (p0) {
+                _settingStore.snippetOrder.put(p0.map((e) => e.name).toList());
+              },
+            );
+          }),
+          header: TagSwitcher(
+            tags: provider.tags,
+            onTagChanged: (tag) => setState(() => _tag = tag),
+            initTag: _tag,
+            all: _s.all,
+            width: _media.size.width,
+          ),
           itemBuilder: (context, idx) {
+            final snippet = filtered[idx];
             return RoundRectCard(
               ListTile(
                 contentPadding: const EdgeInsets.only(left: 23, right: 17),
                 title: Text(
-                  provider.snippets[idx].name,
+                  snippet.name,
                   overflow: TextOverflow.ellipsis,
                   maxLines: 1,
                 ),
                 trailing: IconButton(
                   onPressed: () => AppRoute(
-                          SnippetEditPage(snippet: provider.snippets[idx]),
-                          'snippet edit page')
-                      .go(context),
+                    SnippetEditPage(snippet: snippet),
+                    'snippet edit page',
+                  ).go(context),
                   icon: const Icon(Icons.edit),
                 ),
               ),
+              key: ValueKey(snippet.name),
             );
           },
         );