all_channels: Remove three dot menu and add gesture controls

Make the All channels view UI consistent with the Channels view.
Specifically, onTap on a row item should lead to channel feed page
and onLongPress should launch the channel bottom sheet.

- all_channels: Add SizedBox(height: 40, width: 52) as a placeholder
  when toggle shouldn't shown. The top and bottom padding at 2 will
  make the Row height at least 44 px. Width is set to 52 to match
  the width of the toggle, so long text wouldn't extend all the way
  before text ellipsis
- all_channels: Add on tap to channel feed if user has content
  access
- all_channels: Add additional end padding for row item, also
  setting top and bottom padding to 2 so that widget height is at
  least 44px

Fixes #1914

Author: chungwwei

lib/widgets/all_channels.dart

@@ -5,11 +5,13 @@ import '../api/route/channels.dart';
 import '../generated/l10n/zulip_localizations.dart';
 import '../log.dart';
 import '../model/channel.dart';
+import '../model/narrow.dart';
 import 'action_sheet.dart';
 import 'actions.dart';
 import 'app_bar.dart';
 import 'button.dart';
 import 'icons.dart';
+import 'message_list.dart';
 import 'page.dart';
 import 'remote_settings.dart';
 import 'store.dart';
@@ -96,28 +98,30 @@ class AllChannelsListEntry extends StatelessWidget {
     final Subscription? subscription = channel is Subscription ? channel : null;
     final hasContentAccess = store.selfHasContentAccess(channel);
 
-    return Padding(
-      padding: EdgeInsetsDirectional.only(start: 8, end: 4),
-      child: Row(spacing: 6, children: [
-        Icon(
-          size: 20,
-          color: colorSwatchFor(context, subscription).iconOnPlainBackground,
-          iconDataForStream(channel)),
-        Expanded(
-          child: Text(
-            style: TextStyle(
-              color: designVariables.textMessage,
-              fontSize: 17,
-              height: 20 / 17,
-            ).merge(weightVariableTextStyle(context, wght: 600)),
-            channel.name)),
-        if (hasContentAccess) _SubscribeToggle(channel: channel),
-        ZulipIconButton(
-          icon: ZulipIcons.more_horizontal,
-          onPressed: () {
-            showChannelActionSheet(context, channelId: channel.streamId);
-          }),
-      ]));
+    return InkWell(
+      onTap: !hasContentAccess ? null : () => Navigator.push(context,
+        MessageListPage.buildRoute(context: context,
+          narrow: ChannelNarrow(channel.streamId))),
+      onLongPress: () => showChannelActionSheet(context, channelId: channel.streamId),
+      child: Padding(
+        padding: const EdgeInsets.fromLTRB(8, 2, 12, 2),
+        child: Row(spacing: 6, children: [
+          Icon(
+            size: 20,
+            color: colorSwatchFor(context, subscription).iconOnPlainBackground,
+            iconDataForStream(channel)),
+          Expanded(
+            child: Text(
+              maxLines: 1,
+              overflow: TextOverflow.ellipsis,
+              style: TextStyle(
+                color: designVariables.textMessage,
+                fontSize: 17,
+                height: 20 / 17,
+              ).merge(weightVariableTextStyle(context, wght: 600)),
+              channel.name)),
+          hasContentAccess ? _SubscribeToggle(channel: channel) : const SizedBox(height: 40, width: 52),
+        ])));
   }
 }
 

test/widgets/all_channels_test.dart

@@ -12,6 +12,7 @@ import 'package:zulip/widgets/app_bar.dart';
 import 'package:zulip/widgets/button.dart';
 import 'package:zulip/widgets/home.dart';
 import 'package:zulip/widgets/icons.dart';
+import 'package:zulip/widgets/message_list.dart';
 import 'package:zulip/widgets/page.dart';
 import 'package:zulip/widgets/remote_settings.dart';
 import 'package:zulip/widgets/theme.dart';
@@ -202,21 +203,35 @@ void main() {
       } else {
         check(maybeToggle).isNull();
       }
-
-      check(findInRow(find.byIcon(ZulipIcons.more_horizontal))).findsOne();
     }
   });
 
-  testWidgets('tapping three-dots button opens channel action sheet', (tester) async {
+  testWidgets('open channel action sheet on long press', (tester) async {
     await setupAllChannelsPage(tester, channels: [eg.stream()]);
 
-    await tester.tap(find.byIcon(ZulipIcons.more_horizontal));
+    await tester.longPress(find.byType(AllChannelsListEntry));
     await tester.pump();
     await transitionDurationObserver.pumpPastTransition(tester);
 
     check(find.byType(BottomSheet)).findsOne();
   });
 
+  testWidgets('navigate to channel feed on tap', (tester) async {
+    final channel = eg.stream(name: 'some-channel');
+    await setupAllChannelsPage(tester, channels: [channel]);
+
+    connection.prepare(json: eg.newestGetMessagesResult(
+      foundOldest: true, messages: [eg.streamMessage(stream: channel)]).toJson());
+    await tester.tap(find.byType(AllChannelsListEntry));
+    await tester.pump();
+    await transitionDurationObserver.pumpPastTransition(tester);
+
+    check(find.descendant(
+      of: find.byType(MessageListPage),
+      matching: find.text('some-channel')),
+    ).findsOne();
+  });
+
   testWidgets('use toggle switch to subscribe/unsubscribe', (tester) async {
     final channel = eg.stream();
     await setupAllChannelsPage(tester, channels: [channel]);