channel_list: Implement unsubscribe from channel

Author: Khader-1

assets/l10n/app_en.arb

@@ -546,5 +546,19 @@
     "placeholders": {
       "channelName": {"type": "String", "example": "announce"}
     }
+  },
+  "messageUnsubscribedFromChannel": "You've unsubscribed from {channelName}!",
+  "@messageUnsubscribedFromChannel": {
+    "description": "A message shown to inform user that unsubscribe action passes",
+    "placeholders": {
+      "channelName": {"type": "String", "example": "announce"}
+    }
+  },
+  "errorFailedToUnsubscribedFromChannel": "Failed to unsubscribe to {channelName}",
+  "@errorFailedToUnsubscribedFromChannel": {
+    "description": "An error message when unsubscribe action fails",
+    "placeholders": {
+      "channelName": {"type": "String", "example": "announce"}
+    }
   }
 }

lib/widgets/channel_list.dart

@@ -95,21 +95,52 @@ class ChannelItem extends StatelessWidget {
                   overflow: TextOverflow.ellipsis),
               ])),
               const SizedBox(width: 8),
-              if (stream is! Subscription) _ChannelItemSubscribeButton(stream: stream),
+              _ChannelItemSubscriptionToggle(stream: stream),
             ]))));
   }
 }
 
-class _ChannelItemSubscribeButton extends StatelessWidget {
-  const _ChannelItemSubscribeButton({required this.stream});
+class _ChannelItemSubscriptionToggle extends StatelessWidget {
+  const _ChannelItemSubscriptionToggle({required this.stream});
 
   final ZulipStream stream;
 
   @override
   Widget build(BuildContext context) {
+    final colorScheme = Theme.of(context).colorScheme;
+    final (icon, color, onPressed) = stream is Subscription
+    ? (Icons.check, colorScheme.primary, _unsubscribeFromChannel)
+    : (Icons.add,   null,                _subscribeToChannel);
+
     return IconButton(
-      icon: const Icon(Icons.add),
-      onPressed: () => _subscribeToChannel(context, stream));
+      color: color,
+      icon: Icon(icon),
+      onPressed: () => onPressed(context, stream));
+  }
+
+  Future<void> _unsubscribeFromChannel(BuildContext context, ZulipStream stream) async {
+    final store = PerAccountStoreWidget.of(context);
+    final connection = store.connection;
+    final scaffoldMessenger = ScaffoldMessenger.of(context);
+    final zulipLocalizations = ZulipLocalizations.of(context);
+    try {
+      final res = await unsubscribeFromChannels(connection, [stream]);
+      if (!context.mounted) return;
+      scaffoldMessenger.clearSnackBars();
+      if (res.removed?.contains(stream.name) ?? false) {
+        scaffoldMessenger.showSnackBar(SnackBar(behavior: SnackBarBehavior.floating,
+          content: Text(zulipLocalizations.messageUnsubscribedFromChannel(stream.name))));
+      } else if (res.notRemoved?.contains(stream.name) ?? false) {
+        scaffoldMessenger.showSnackBar(SnackBar(behavior: SnackBarBehavior.floating,
+          content: Text(zulipLocalizations.errorFailedToUnsubscribedFromChannel(stream.name))));
+      }
+    } catch (e) {
+      if (!context.mounted) return;
+      final zulipLocalizations = ZulipLocalizations.of(context);
+      await showErrorDialog(context: context,
+        title: zulipLocalizations.errorFailedToUnsubscribedFromChannel(stream.name),
+        message: e.toString()); // TODO(#741): extract user-facing message better
+    }
   }
 
   Future<void> _subscribeToChannel(BuildContext context, ZulipStream stream) async {

test/widgets/channel_list_test.dart

@@ -91,10 +91,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) async {
       await tester.pump(Duration.zero);
       await tester.pumpAndSettle();
@@ -108,17 +118,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();
     }, skip: true);
 
     group('subscribe', () {
@@ -193,5 +206,66 @@ void main() {
           expectedMessage: 'NetworkException: Oops (ClientException: Oops)');
       }, skip: true);
     });
+
+    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]];
+        await setupChannelListPage(tester, streams: streams, subscriptions: subscriptions.cast());
+
+        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));
+      }, skip: true);
+
+      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));
+      }, skip: true);
+
+      testWidgets('catch-all api errors', (WidgetTester tester) async {
+        final stream = 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(stream.name),
+          expectedMessage: 'NetworkException: Oops (ClientException: Oops)');
+      }, skip: true);
+    });
   });
 }