msglist: Support retrieving failed outbox message content

Author: PIG208

assets/l10n/app_en.arb

@@ -801,6 +801,10 @@
   "@messageIsMovedLabel": {
     "description": "Label for a moved message. (Use ALL CAPS for cased alphabets: Latin, Greek, Cyrillic, etc.)"
   },
+  "messageIsntSentLabel": "MESSAGE ISN'T SENT. CHECK YOUR CONNECTION.",
+  "@messageIsntSentLabel": {
+    "description": "Label for a message that isn't sent. (Use ALL CAPS for cased alphabets: Latin, Greek, Cyrillic, etc.)"
+  },
   "pollVoterNames": "({voterNames})",
   "@pollVoterNames": {
     "description": "The list of people who voted for a poll option, wrapped in parentheses.",

lib/generated/l10n/zulip_localizations.dart

@@ -1184,6 +1184,12 @@ abstract class ZulipLocalizations {
   /// **'MOVED'**
   String get messageIsMovedLabel;
 
+  /// Label for a message that isn't sent. (Use ALL CAPS for cased alphabets: Latin, Greek, Cyrillic, etc.)
+  ///
+  /// In en, this message translates to:
+  /// **'MESSAGE ISN\'T SENT. CHECK YOUR CONNECTION.'**
+  String get messageIsntSentLabel;
+
   /// The list of people who voted for a poll option, wrapped in parentheses.
   ///
   /// In en, this message translates to:

lib/generated/l10n/zulip_localizations_ar.dart

@@ -654,6 +654,10 @@ class ZulipLocalizationsAr extends ZulipLocalizations {
   @override
   String get messageIsMovedLabel => 'MOVED';
 
+  @override
+  String get messageIsntSentLabel =>
+      'MESSAGE ISN\'T SENT. CHECK YOUR CONNECTION.';
+
   @override
   String pollVoterNames(String voterNames) {
     return '($voterNames)';

lib/generated/l10n/zulip_localizations_en.dart

@@ -654,6 +654,10 @@ class ZulipLocalizationsEn extends ZulipLocalizations {
   @override
   String get messageIsMovedLabel => 'MOVED';
 
+  @override
+  String get messageIsntSentLabel =>
+      'MESSAGE ISN\'T SENT. CHECK YOUR CONNECTION.';
+
   @override
   String pollVoterNames(String voterNames) {
     return '($voterNames)';

lib/generated/l10n/zulip_localizations_ja.dart

@@ -654,6 +654,10 @@ class ZulipLocalizationsJa extends ZulipLocalizations {
   @override
   String get messageIsMovedLabel => 'MOVED';
 
+  @override
+  String get messageIsntSentLabel =>
+      'MESSAGE ISN\'T SENT. CHECK YOUR CONNECTION.';
+
   @override
   String pollVoterNames(String voterNames) {
     return '($voterNames)';

lib/generated/l10n/zulip_localizations_nb.dart

@@ -654,6 +654,10 @@ class ZulipLocalizationsNb extends ZulipLocalizations {
   @override
   String get messageIsMovedLabel => 'MOVED';
 
+  @override
+  String get messageIsntSentLabel =>
+      'MESSAGE ISN\'T SENT. CHECK YOUR CONNECTION.';
+
   @override
   String pollVoterNames(String voterNames) {
     return '($voterNames)';

lib/generated/l10n/zulip_localizations_pl.dart

@@ -663,6 +663,10 @@ class ZulipLocalizationsPl extends ZulipLocalizations {
   @override
   String get messageIsMovedLabel => 'PRZENIESIONO';
 
+  @override
+  String get messageIsntSentLabel =>
+      'MESSAGE ISN\'T SENT. CHECK YOUR CONNECTION.';
+
   @override
   String pollVoterNames(String voterNames) {
     return '($voterNames)';

lib/generated/l10n/zulip_localizations_ru.dart

@@ -667,6 +667,10 @@ class ZulipLocalizationsRu extends ZulipLocalizations {
   @override
   String get messageIsMovedLabel => 'ПЕРЕМЕЩЕНО';
 
+  @override
+  String get messageIsntSentLabel =>
+      'MESSAGE ISN\'T SENT. CHECK YOUR CONNECTION.';
+
   @override
   String pollVoterNames(String voterNames) {
     return '($voterNames)';

lib/generated/l10n/zulip_localizations_sk.dart

@@ -656,6 +656,10 @@ class ZulipLocalizationsSk extends ZulipLocalizations {
   @override
   String get messageIsMovedLabel => 'PRESUNUTÉ';
 
+  @override
+  String get messageIsntSentLabel =>
+      'MESSAGE ISN\'T SENT. CHECK YOUR CONNECTION.';
+
   @override
   String pollVoterNames(String voterNames) {
     return '($voterNames)';

lib/generated/l10n/zulip_localizations_uk.dart

@@ -666,6 +666,10 @@ class ZulipLocalizationsUk extends ZulipLocalizations {
   @override
   String get messageIsMovedLabel => 'ПЕРЕМІЩЕНО';
 
+  @override
+  String get messageIsntSentLabel =>
+      'MESSAGE ISN\'T SENT. CHECK YOUR CONNECTION.';
+
   @override
   String pollVoterNames(String voterNames) {
     return '($voterNames)';

lib/model/message.dart

@@ -275,9 +275,8 @@ mixin _OutboxMessageStore on PerAccountStoreBase {
   void _handleMessageEventOutbox(MessageEvent event) {
     if (event.localMessageId != null) {
       final localMessageId = int.parse(event.localMessageId!, radix: 10);
-      // The outbox message can be missing if the user removes it (to be
-      // implemented in #1441) before the event arrives.
-      // Nothing to do in that case.
+      // The outbox message can be missing if the user removes it before the
+      // event arrives.  Nothing to do in that case.
       _outboxMessages.remove(localMessageId);
       _outboxMessageDebounceTimers.remove(localMessageId)?.cancel();
       _outboxMessageWaitPeriodTimers.remove(localMessageId)?.cancel();

lib/widgets/message_list.dart

@@ -5,6 +5,7 @@ import 'package:intl/intl.dart' hide TextDirection;
 
 import '../api/model/model.dart';
 import '../generated/l10n/zulip_localizations.dart';
+import '../model/message.dart';
 import '../model/message_list.dart';
 import '../model/narrow.dart';
 import '../model/store.dart';
@@ -1515,22 +1516,86 @@ class OutboxMessageWithPossibleSender extends StatelessWidget {
 
   final MessageListOutboxMessageItem item;
 
+  // TODO should we restore the topic as well?
+  void _handlePress(BuildContext context) {
+    final content = item.message.content.endsWith('\n')
+      ? item.message.content : '${item.message.content}\n';
+
+    final composeBoxController =
+      MessageListPage.ancestorOf(context).composeBoxState!.controller;
+    composeBoxController.content.insertPadded(content);
+    if (!composeBoxController.contentFocusNode.hasFocus) {
+      composeBoxController.contentFocusNode.requestFocus();
+    }
+
+    final store = PerAccountStoreWidget.of(context);
+    assert(store.outboxMessages.containsKey(item.message.localMessageId));
+    store.removeOutboxMessage(item.message.localMessageId);
+  }
+
   @override
   Widget build(BuildContext context) {
-    final message = item.message;
-    return Padding(
-      padding: const EdgeInsets.symmetric(vertical: 4),
-      child: Column(children: [
-        if (item.showSender)
-          _SenderRow(message: message, showTimestamp: false),
-        Padding(
-          padding: const EdgeInsets.symmetric(horizontal: 16),
-          // This is adapated from [MessageContent].
-          // TODO(#576): Offer InheritedMessage ancestor once we are ready
-          //   to support local echoing images and lightbox.
-          child: DefaultTextStyle(
-            style: ContentTheme.of(context).textStylePlainParagraph,
-            child: BlockContentList(nodes: item.content.nodes))),
-      ]));
+    final designVariables = DesignVariables.of(context);
+    final zulipLocalizations = ZulipLocalizations.of(context);
+    final isComposeBoxOffered =
+      MessageListPage.ancestorOf(context).composeBoxState != null;
+
+    final GestureTapCallback? handleTap;
+    final double opacity;
+    final Widget bottom;
+    switch (item.message.state) {
+      case OutboxMessageState.hidden:
+        assert(false,
+          'Hidden OutboxMessage messages should not appear in message lists');
+        handleTap = null;
+        opacity = 1.0;
+        bottom = SizedBox.shrink();
+
+      case OutboxMessageState.waiting:
+        handleTap = null;
+        opacity = 1.0;
+        bottom = LinearProgressIndicator(
+          minHeight: 2,
+          color: designVariables.foreground.withFadedAlpha(0.5),
+          backgroundColor: designVariables.foreground.withFadedAlpha(0.2));
+
+      case OutboxMessageState.failed:
+      case OutboxMessageState.waitPeriodExpired:
+        handleTap = isComposeBoxOffered ? () => _handlePress(context) : null;
+        opacity = 0.6;
+        bottom = Text(
+          zulipLocalizations.messageIsntSentLabel,
+          textAlign: TextAlign.end,
+          style: TextStyle(
+            color: designVariables.btnLabelAttLowIntDanger,
+            fontSize: 12,
+            height: 12 / 12,
+            letterSpacing: proportionalLetterSpacing(
+              context, 0.006, baseFontSize: 12),
+          ).merge(weightVariableTextStyle(context, wght: 400)));
+    }
+
+    return GestureDetector(
+      onTap: handleTap,
+      behavior: HitTestBehavior.opaque,
+      child: Opacity(opacity: opacity, child: Padding(
+        padding: const EdgeInsets.symmetric(vertical: 4),
+        child: Column(children: [
+          if (item.showSender)
+            _SenderRow(message: item.message, showTimestamp: false),
+          Padding(
+            padding: const EdgeInsets.symmetric(horizontal: 16),
+            child: Column(crossAxisAlignment: CrossAxisAlignment.stretch,
+              children: [
+                // This is adapated from [MessageContent].
+                // TODO(#576): Offer InheritedMessage ancestor once we are ready
+                //   to support local echoing images and lightbox.
+                DefaultTextStyle(
+                  style: ContentTheme.of(context).textStylePlainParagraph,
+                  child: BlockContentList(nodes: item.content.nodes)),
+
+                bottom,
+              ])),
+        ]))));
   }
 }