UBER-554: show messages with error and allow resending (#3488)

Signed-off-by: Vyacheslav Tumanov <me@slavatumanov.me>

plugins/gmail-resources/src/components/Message.svelte

@@ -14,7 +14,7 @@
 // limitations under the License.
 -->
 <script lang="ts">
-  import type { SharedMessage } from '@hcengineering/gmail'
+  import type { NewMessage, SharedMessage } from '@hcengineering/gmail'
   import { AttachmentsPresenter } from '@hcengineering/attachment-resources'
   import { CheckBox, Label } from '@hcengineering/ui'
   import { createEventDispatcher } from 'svelte'
@@ -24,6 +24,8 @@
   export let message: SharedMessage
   export let selected: boolean = false
   export let selectable: boolean = false
+  const isError = (message as unknown as NewMessage)?.status === 'error'
+  const errorMessage = isError ? (message as unknown as NewMessage) : undefined
 
   const dispatch = createEventDispatcher()
 </script>
@@ -42,7 +44,7 @@
       </div>
       <div class="content-dark-color flex">
         <AttachmentsPresenter value={message.attachments} object={message} />
-        <span class="content-color">{getTime(message.sendOn)}</span>
+        <span class="content-color">{!isError ? getTime(message.sendOn) : getTime(message.modifiedOn)}</span>
       </div>
     </div>
     <div class="content-dark-color text-sm overflow-label mr-4 mb-4">
@@ -52,9 +54,18 @@
     <div class="fs-title overflow-label mb-1">
       {message.subject}
     </div>
-    <div class="overflow-label">
-      {message.textContent}
-    </div>
+    {#if !isError}
+      <div class="overflow-label">
+        {message.textContent}
+      </div>
+    {/if}
+    {#if isError}
+      <div class="error-color top-divider mt-2 pt-2">
+        Error: {errorMessage && errorMessage?.error
+          ? JSON.parse(errorMessage.error)?.data?.error_description
+          : undefined ?? 'unknown error'}
+      </div>
+    {/if}
   </div>
   {#if selectable}
     <div class="ml-4"><CheckBox circle accented bind:checked={selected} /></div>