1304 Edit message (#1395)

Signed-off-by: Denis Bunakalya <denis.bunakalya@xored.com>

plugins/chunter-assets/lang/en.json

@@ -31,6 +31,7 @@
     "MarkUnread": "Mark unread",
     "GetNewReplies": "Get notified about new replies",
     "TurnOffReplies": "Turn off notifications for replies",
+    "EditMessage": "Edit message",
     "DeleteMessage": "Delete message"
   }
 }

plugins/chunter-assets/lang/ru.json

@@ -30,6 +30,7 @@
     "MarkUnread": "Отметить как непрочитанное",
     "GetNewReplies": "Получать уведомления о новых ответах",
     "TurnOffReplies": "Выключить уведомления об ответах",
+    "EditMessage": "Редактировать сообщение",
     "DeleteMessage": "Удалить сообщение"
   }
 }

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

@@ -14,7 +14,7 @@
 -->
 <script lang="ts">
   import { Attachment } from '@anticrm/attachment'
-  import { AttachmentList } from '@anticrm/attachment-resources'
+  import { AttachmentList, AttachmentRefInput } from '@anticrm/attachment-resources'
   import type { Message } from '@anticrm/chunter'
   import { Employee, EmployeeAccount, formatName } from '@anticrm/contact'
   import { Ref, WithLookup, getCurrentAccount } from '@anticrm/core'
@@ -59,6 +59,13 @@
         action: chunter.actionImpl.SubscribeMessage
       } as Action)
 
+  $: isEditing = false;
+
+  const editAction = {
+    label: chunter.string.EditMessage,
+    action: () => isEditing = true
+  }
+
   const deleteAction = {
     label: chunter.string.DeleteMessage,
     action: async () => await client.remove(message)
@@ -79,13 +86,28 @@
               await impl(message)
             }
           })),
-          ...(getCurrentAccount()._id === message.createBy ? [deleteAction] : [])
+          ...(getCurrentAccount()._id === message.createBy ? [editAction, deleteAction] : [])
         ]
       },
       ev.target as HTMLElement
     )
   }
 
+  async function onMessageEdit (event: CustomEvent) {
+    const { message: newContent, attachments: newAttachments } = event.detail
+
+    if (newContent !== message.content || newAttachments !== attachments) {
+      await client.update(
+      message,
+        {
+          content: newContent,
+          attachments: newAttachments
+        }
+     )
+    }
+    isEditing = false
+  }
+
   function getEmployee (message: WithLookup<Message>): Employee | undefined {
     const employee = (message.$lookup?.createBy as EmployeeAccount).employee
     if (employee !== undefined) {
@@ -105,8 +127,18 @@
       {#if employee}{formatName(employee.name)}{/if}
       <span>{getTime(message.createOn)}</span>
     </div>
-    <div class="text"><MessageViewer message={message.content} /></div>
-    {#if message.attachments}<div class="attachments"><AttachmentList {attachments} /></div>{/if}
+    {#if isEditing}
+      <AttachmentRefInput 
+        space={message.space} 
+        _class={chunter.class.Comment} 
+        objectId={message._id} 
+        content={message.content} 
+        on:message={onMessageEdit} 
+      />
+    {:else}
+      <div class="text"><MessageViewer message={message.content} /></div>
+      {#if message.attachments}<div class="attachments"><AttachmentList {attachments} /></div>{/if}
+    {/if}
     {#if reactions || message.replies}
       <div class="footer flex-col">
         <div>

plugins/chunter-resources/src/components/ThreadComment.svelte

@@ -14,7 +14,7 @@
 -->
 <script lang="ts">
   import { Attachment } from '@anticrm/attachment'
-  import { AttachmentList } from '@anticrm/attachment-resources'
+  import { AttachmentList, AttachmentRefInput } from '@anticrm/attachment-resources'
   import type { ThreadMessage } from '@anticrm/chunter'
   import { Employee, EmployeeAccount, formatName } from '@anticrm/contact'
   import { Ref, WithLookup, getCurrentAccount } from '@anticrm/core'
@@ -53,6 +53,13 @@
         action: chunter.actionImpl.SubscribeComment
       } as Action)
 
+  $: isEditing = false;
+
+  const editAction = {
+    label: chunter.string.EditMessage,
+    action: () => isEditing = true
+  }
+
   const deleteAction = {
     label: chunter.string.DeleteMessage,
     action: async () => await client.removeDoc(message._class, message.space, message._id)
@@ -73,13 +80,28 @@
               await impl(message)
             }
           })),
-          ...(getCurrentAccount()._id === message.createBy ? [deleteAction] : [])
+          ...(getCurrentAccount()._id === message.createBy ? [editAction, deleteAction] : [])
         ]
       },
       ev.target as HTMLElement
     )
   }
 
+  async function onMessageEdit (event: CustomEvent) {
+    const { message: newContent, attachments: newAttachments } = event.detail
+
+    if (newContent !== message.content || newAttachments !== attachments) {
+      await client.update(
+        message,
+        {
+          content: newContent,
+          attachments: newAttachments
+        }
+      )
+    }
+    isEditing = false
+  }
+
   $: employee = getEmployee(message)
 
   function getEmployee (comment: WithLookup<ThreadMessage>): Employee | undefined {
@@ -97,8 +119,18 @@
       {#if employee}{formatName(employee.name)}{/if}
       <span>{getTime(message.createOn)}</span>
     </div>
-    <div class="text"><MessageViewer message={message.content} /></div>
-    {#if message.attachments}<div class="attachments"><AttachmentList {attachments} /></div>{/if}
+    {#if isEditing}
+      <AttachmentRefInput 
+        space={message.space} 
+        _class={chunter.class.Comment} 
+        objectId={message._id} 
+        content={message.content} 
+        on:message={onMessageEdit} 
+      />
+    {:else}
+      <div class="text"><MessageViewer message={message.content} /></div>
+      {#if message.attachments}<div class="attachments"><AttachmentList {attachments} /></div>{/if}
+    {/if}
     {#if reactions}
       <div class="footer">
         <div><Reactions /></div>

plugins/chunter-resources/src/plugin.ts

@@ -51,6 +51,7 @@ export default mergeIds(chunterId, chunter, {
     New: '' as IntlString,
     GetNewReplies: '' as IntlString,
     TurnOffReplies: '' as IntlString,
-    DeleteMessage: '' as IntlString
+    DeleteMessage: '' as IntlString,
+    EditMessage: '' as IntlString
   }
 })