(fix/feat): [Clients] Update interaction to reorder and view submenu, added category to queue tile (#420)

* Add LunaReorderableListDragger widget for handler
* (feat): [NZBGet] Change interaction style (tap to view menu, draggable handle), add category to tile
* (feat): [SABnzbd] Change interaction style (tap to view menu, draggable handle), add category to tile

lib/core/widgets.dart

@@ -2,4 +2,5 @@ export 'widgets/action_bar_card.dart';
 export 'widgets/expandable_list_tile.dart';
 export 'widgets/five_line_card_with_poster.dart';
 export 'widgets/four_line_card_with_poster.dart';
+export 'widgets/reorderable_list_dragger.dart';
 export 'widgets/two_line_card_with_poster.dart';

lib/core/widgets/reorderable_list_dragger.dart

@@ -0,0 +1,23 @@
+import 'package:flutter/material.dart';
+
+class LunaReorderableListDragger extends StatelessWidget {
+    final int index;
+
+    LunaReorderableListDragger({
+        Key key,
+        @required this.index,
+    }) : super(key: key);
+
+    @override
+    Widget build(BuildContext context) {
+        return Column(
+            mainAxisAlignment: MainAxisAlignment.center,
+            children: [
+                ReorderableDragStartListener(
+                    index: index,
+                    child: Icon(Icons.menu_rounded),
+                ),
+            ],
+        );
+    }
+}

lib/modules/nzbget/core/api/data/queue.dart

@@ -59,8 +59,13 @@ class NZBGetQueueData {
         }
     }
 
+    String get formattedCategory {
+        if(category == null || category.isEmpty) return 'No Category';
+        return category;
+    }
+
     String get subtitle {
         String size = '$downloaded/$sizeTotal MB';
-        return '$statusString\t•\t$size\t•\t$percentageDone%';
+        return '$statusString\t•\t$size\t•\t$percentageDone%\t•\t$formattedCategory';
     }
 }

lib/modules/nzbget/core/dialogs.dart

@@ -183,7 +183,7 @@ class NZBGetDialogs {
             content: List.generate(
                 categories.length,
                 (index) => LunaDialog.tile(
-                    text: categories[index].name,
+                    text: categories[index].name.isEmpty ? 'No Category' : categories[index].name,
                     icon: Icons.category,
                     iconColor: LunaColours.list(index),
                     onTap: () => _setValues(true, categories[index]),

lib/modules/nzbget/routes/queue.dart

@@ -152,6 +152,7 @@ class _State extends State<NZBGetQueue> with TickerProviderStateMixin, Automatic
             itemCount: _queue.length,
             itemBuilder: (context, index) => NZBGetQueueTile(
                 key: Key(_queue[index].id.toString()),
+                index: index,
                 data: _queue[index],
                 queueContext: context,
                 refresh: () => _fetchWithoutMessage(),

lib/modules/nzbget/widgets/queue_tile.dart

@@ -5,12 +5,14 @@ import 'package:lunasea/core.dart';
 import 'package:lunasea/modules/nzbget.dart';
 
 class NZBGetQueueTile extends StatefulWidget {
+    final int index;
     final NZBGetQueueData data;
     final Function refresh;
     final BuildContext queueContext;
 
     NZBGetQueueTile({
         @required this.data,
+        @required this.index,
         @required this.queueContext,
         @required this.refresh,
         Key key,
@@ -49,11 +51,8 @@ class _State extends State<NZBGetQueueTile> {
                     ),
                 ],
             ),
-            trailing: LunaIconButton(
-                icon: Icons.more_vert,
-                onPressed: () async => _handlePopup(),
-                color: widget.data.paused ? Colors.white30 : Colors.white,
-            ),
+            trailing: LunaReorderableListDragger(index: widget.index),
+            onTap: _handlePopup,
         );
     }
 

lib/modules/sabnzbd/core/api/data/queue.dart

@@ -23,6 +23,11 @@ class SABnzbdQueueData {
         return sizeTotal == 0 ? 0 : (((sizeTotal-sizeLeft)/sizeTotal)*100).round() ?? 0.0;
     }
 
+    String get formattedCategory {
+        if(this.category == null || this.category == '*') return 'Default';
+        return category;
+    }
+
     String get subtitle {
         String time = isPaused ?
             'Paused' :
@@ -30,7 +35,7 @@ class SABnzbdQueueData {
                 '―' :
                 timeLeft;
         String size = '${sizeTotal-sizeLeft}/$sizeTotal MB';
-        return '$time\t•\t$size\t•\t$percentageDone%';
+        return '$time\t•\t$size\t•\t$percentageDone%\t•\t$formattedCategory';
     }
 
     bool get isPaused {

lib/modules/sabnzbd/routes/queue.dart

@@ -143,6 +143,7 @@ class _State extends State<SABnzbdQueue> with TickerProviderStateMixin, Automati
             itemBuilder: (context, index) => SABnzbdQueueTile(
                 key: Key(_queue[index].nzoId),
                 data: _queue[index],
+                index: index,
                 queueContext: context,
                 refresh: () => _fetchWithoutMessage(),
             ),

lib/modules/sabnzbd/widgets/queue_tile.dart

@@ -5,12 +5,14 @@ import 'package:lunasea/core.dart';
 import 'package:lunasea/modules/sabnzbd.dart';
 
 class SABnzbdQueueTile extends StatefulWidget {
+    final int index;
     final SABnzbdQueueData data;
     final Function refresh;
     final BuildContext queueContext;
 
     SABnzbdQueueTile({
         @required this.data,
+        @required this.index,
         @required this.queueContext,
         @required this.refresh,
         Key key,
@@ -48,11 +50,8 @@ class _State extends State<SABnzbdQueueTile> {
                 ),
             ],
         ),
-        trailing: LunaIconButton(
-            icon: Icons.more_vert,
-            onPressed: () async => _handlePopup(),
-            color: widget.data.isPaused ? Colors.white30 : Colors.white,
-        ),
+        trailing: LunaReorderableListDragger(index: widget.index),
+        onTap: _handlePopup,
     );
 
     Future<void> _handlePopup() async {