Use standart action for archive state (#1818)

Signed-off-by: Dvinyanin Alexandr <dvinyanin.alexandr@gmail.com>

models/task/src/index.ts

@@ -510,4 +510,30 @@ export function createModel (builder: Builder): void {
     },
     task.action.Move
   )
+
+  createAction(
+    builder,
+    {
+      action: view.actionImpl.UpdateDocument,
+      actionProps: {
+        key: 'isArchived',
+        value: true,
+        ask: true,
+        label: task.string.Archive,
+        message: task.string.ArchiveConfirm
+      },
+      query: {
+        isArchived: { $nin: [true] }
+      },
+      label: task.string.Archive,
+      icon: task.icon.TaskState,
+      input: 'any',
+      category: task.category.Task,
+      target: task.class.State,
+      context: {
+        mode: ['context', 'browser']
+      }
+    },
+    task.action.ArchiveState
+  )
 }

models/task/src/plugin.ts

@@ -28,6 +28,7 @@ export default mergeIds(taskId, task, {
     EditStatuses: '' as Ref<Action>,
     ArchiveSpace: '' as Ref<Action>,
     UnarchiveSpace: '' as Ref<Action>,
+    ArchiveState: '' as Ref<Action>,
     Move: '' as Ref<Action>
   },
   actionImpl: {

plugins/board-resources/src/components/ListHeader.svelte

@@ -1,25 +1,29 @@
 <script lang="ts">
   import { Button, Component, getPlatformColor, IconEdit, showPopup } from '@anticrm/ui'
   import { State } from '@anticrm/task'
-  import { getElementPopupAlignment } from '../utils/PopupUtils'
-  import ListInlineActions from './editor/ListInlineActions.svelte'
   import notification from '@anticrm/notification'
+  import { ContextMenu } from '@anticrm/view-resources'
   export let state: State
 
-  let ref: HTMLElement
-
-  function onArchive () {
-    showPopup(ListInlineActions, { value: state }, getElementPopupAlignment(ref, { h: 'right', v: 'bottom' }))
+  const showMenu = async (ev: MouseEvent): Promise<void> => {
+    ev.preventDefault()
+    showPopup(
+      ContextMenu,
+      { object: state },
+      {
+        getBoundingClientRect: () => DOMRect.fromRect({ width: 1, height: 1, x: ev.clientX, y: ev.clientY })
+      }
+    )
   }
 </script>
 
 <div class="flex-col h-16">
   <div class="h-2 border-radius-1" style="background-color: {getPlatformColor(state.color)}" />
-  <div class="flex-between h-full font-medium pr-2 pl-4" bind:this={ref}>
+  <div class="flex-between h-full font-medium pr-2 pl-4">
     <span class="lines-limit-2">{state.title}</span>
     <div class="flex">
       <Component is={notification.component.LastViewEditor} props={{ value: state }} />
-      <Button icon={IconEdit} kind="transparent" on:click={onArchive} />
+      <Button icon={IconEdit} kind="transparent" on:click={showMenu} />
     </div>
   </div>
 </div>

plugins/board-resources/src/components/editor/ListInlineActions.svelte

@@ -1,24 +0,0 @@
-<script lang="ts">
-  import { getClient } from '@anticrm/presentation'
-  import { State } from '@anticrm/task'
-  import { Button } from '@anticrm/ui'
-  import board from '../../plugin'
-
-  export let value: State
-
-  const client = getClient()
-</script>
-
-{#if value && !value.isArchived}
-  <div class="flex-col flex-gap-1">
-    <Button
-      icon={board.icon.Card}
-      label={board.string.ToArchive}
-      kind="no-border"
-      justify="left"
-      on:click={async () => {
-        client.update(value, { isArchived: true })
-      }}
-    />
-  </div>
-{/if}