channel_list: Implement unsubscribe from channel

Author: Khader-1

assets/l10n/app_en.arb

@@ -624,5 +624,13 @@
   "errorFailedToSubscribedToChannel": "Failed to subscribe to ",
   "@errorFailedToSubscribedToChannel": {
     "description": "An error message when subscribe action fails"
+  },
+  "messageUnsubscribedFromChannel": "You've unsubscribed from ",
+  "@messageUnsubscribedFromChannel": {
+    "description": "A message shown to inform user that unsubscribe action passes"
+  },
+  "errorFailedToUnsubscribedFromChannel": "Failed to unsubscribe to ",
+  "@errorFailedToUnsubscribedFromChannel": {
+    "description": "An error message when unsubscribe action fails"
   }
 }

lib/widgets/channel_list.dart

@@ -105,22 +105,22 @@ class ChannelItem extends StatelessWidget {
                   overflow: TextOverflow.ellipsis),
               ])),
             const SizedBox(width: 8),
-            if (stream is! Subscription) _ChannelItemSubscribeButton(stream: stream, channelItemContext: context),
+            _ChannelItemSubscriptionToggle(stream: stream, channelItemContext: context),
           ]))));
   }
 }
 
-class _ChannelItemSubscribeButton extends StatefulWidget {
-  const _ChannelItemSubscribeButton({required this.stream, required this.channelItemContext});
+class _ChannelItemSubscriptionToggle extends StatefulWidget {
+  const _ChannelItemSubscriptionToggle({required this.stream, required this.channelItemContext});
 
   final ZulipStream stream;
   final BuildContext channelItemContext;
 
   @override
-  State<_ChannelItemSubscribeButton> createState() => _ChannelItemSubscribeButtonState();
+  State<_ChannelItemSubscriptionToggle> createState() => _ChannelItemSubscriptionToggleState();
 }
 
-class _ChannelItemSubscribeButtonState extends State<_ChannelItemSubscribeButton> {
+class _ChannelItemSubscriptionToggleState extends State<_ChannelItemSubscriptionToggle> {
   bool _isLoading = false;
 
   void _setIsLoading(bool value) {
@@ -130,15 +130,39 @@ class _ChannelItemSubscribeButtonState extends State<_ChannelItemSubscribeButton
 
   @override
   Widget build(BuildContext context) {
+    final colorScheme = Theme.of(context).colorScheme;
+    final (icon, color, onPressed) = widget.stream is Subscription
+      ? (Icons.check, colorScheme.primary, _unsubscribeFromChannel)
+      : (Icons.add,   null,                _subscribeToChannel);
+
     return IconButton(
-      icon: const Icon(Icons.add),
+      color: color,
+      icon: Icon(icon),
       onPressed: _isLoading ? null : () async {
         _setIsLoading(true);
-        await _subscribeToChannel(context, widget.stream);
+        await onPressed(context, widget.stream);
         _setIsLoading(false);
       });
   }
 
+  Future<void> _unsubscribeFromChannel(BuildContext context, ZulipStream stream) async {
+    final store = PerAccountStoreWidget.of(context);
+    final connection = store.connection;
+    final zulipLocalizations = ZulipLocalizations.of(context);
+    try {
+      final res = await unsubscribeFromChannels(connection, [stream]);
+      if (!context.mounted) return;
+      if (res.removed.contains(stream.name)) {
+        _showSnackbarWithChannelTitle(context, zulipLocalizations.messageUnsubscribedFromChannel, stream);
+      } else if (res.notRemoved.contains(stream.name)) {
+        _showSnackbarWithChannelTitle(context, zulipLocalizations.errorFailedToUnsubscribedFromChannel, stream);
+      }
+    } catch (e) {
+      if (!context.mounted) return;
+      _showSnackbarWithChannelTitle(context, zulipLocalizations.errorFailedToUnsubscribedFromChannel, stream);
+    }
+  }
+
   Future<void> _subscribeToChannel(BuildContext context, ZulipStream stream) async {
     final store = PerAccountStoreWidget.of(context);
     final connection = store.connection;

test/widgets/channel_list_test.dart

@@ -93,10 +93,20 @@ void main() {
         return stream;
     }
 
+    Future<Subscription> prepareSingleSubscription(WidgetTester tester) async {
+        final stream = eg.subscription(eg.stream());
+        await setupChannelListPage(tester, streams: [stream], subscriptions: [stream]);
+        return stream;
+    }
+
     Future<void> tapSubscribeButton(WidgetTester tester) async {
       await tester.tap(find.byIcon(Icons.add));
     }
 
+    Future<void> tapUnsubscribeButton(WidgetTester tester) async {
+      await tester.tap(find.byIcon(Icons.check));
+    }
+
     Future<void> waitAndCheckSnackbarIsShown(WidgetTester tester, String message, String channelName) async {
       await tester.pump(Duration.zero);
       await tester.pumpAndSettle();
@@ -119,17 +129,20 @@ void main() {
         alreadySubscribed: {}).toJson());
 
       check(find.byIcon(Icons.add).evaluate()).isNotEmpty();
+      check(find.byIcon(Icons.check).evaluate()).isEmpty();
 
       await store.handleEvent(SubscriptionAddEvent(id: 1,
         subscriptions: [eg.subscription(stream)]));
       await tester.pumpAndSettle();
 
       check(find.byIcon(Icons.add).evaluate()).isEmpty();
+      check(find.byIcon(Icons.check).evaluate()).isNotEmpty();
 
       await store.handleEvent(SubscriptionRemoveEvent(id: 2, streamIds: [stream.streamId]));
       await tester.pumpAndSettle();
 
       check(find.byIcon(Icons.add).evaluate()).isNotEmpty();
+      check(find.byIcon(Icons.check).evaluate()).isEmpty();
     });
 
     testWidgets('is disabled while loading', (WidgetTester tester) async {
@@ -238,5 +251,66 @@ void main() {
           expectedMessage: 'NetworkException: Oops (ClientException: Oops)');
       });
     });
+
+    group('unsubscribe', () {
+      testWidgets('is shown only for streams that user is subscribed to', (tester) async {
+        final streams = [eg.stream(), eg.stream(), eg.subscription(eg.stream())];
+        final subscriptions = [streams[2] as Subscription];
+        await setupChannelListPage(tester, streams: streams, subscriptions: subscriptions);
+
+        check(find.byIcon(Icons.check).evaluate().length).equals(1);
+      });
+
+      testWidgets('smoke api', (tester) async {
+        final stream = await prepareSingleSubscription(tester);
+        connection.prepare(json: UnsubscribeFromChannelsResult(
+          removed: [stream.name],
+          notRemoved: []).toJson());
+        await tapUnsubscribeButton(tester);
+
+        await tester.pump(Duration.zero);
+        await tester.pumpAndSettle();
+        check(connection.lastRequest).isA<http.Request>()
+          ..method.equals('DELETE')
+          ..url.path.equals('/api/v1/users/me/subscriptions')
+          ..bodyFields.deepEquals({
+              'subscriptions':  jsonEncode([stream.name])
+            });
+      });
+
+      testWidgets('shows a snackbar when subscription passes', (WidgetTester tester) async {
+        final stream = await prepareSingleSubscription(tester);
+        connection.prepare(json: UnsubscribeFromChannelsResult(
+          removed: [stream.name],
+          notRemoved: []).toJson());
+        await tapUnsubscribeButton(tester);
+
+        await waitAndCheckSnackbarIsShown(tester,
+          zulipLocalizations.messageUnsubscribedFromChannel, stream.name);
+      });
+
+      testWidgets('shows a snackbar when subscription fails', (WidgetTester tester) async {
+        final stream = await prepareSingleSubscription(tester);
+        connection.prepare(json: UnsubscribeFromChannelsResult(
+          removed: [],
+          notRemoved: [stream.name]).toJson());
+        await tapUnsubscribeButton(tester);
+
+        await waitAndCheckSnackbarIsShown(tester,
+          zulipLocalizations.errorFailedToUnsubscribedFromChannel, stream.name);
+      });
+
+      testWidgets('catch-all api errors', (WidgetTester tester) async {
+        await prepareSingleSubscription(tester);
+        connection.prepare(exception: http.ClientException('Oops'));
+        await tapUnsubscribeButton(tester);
+        await tester.pump(Duration.zero);
+        await tester.pumpAndSettle();
+
+        checkErrorDialog(tester,
+          expectedTitle: zulipLocalizations.errorFailedToUnsubscribedFromChannel,
+          expectedMessage: 'NetworkException: Oops (ClientException: Oops)');
+      });
+    });
   });
 }