From c1a8b898558831fe526d8e390092233f0e38c1b7 Mon Sep 17 00:00:00 2001
From: Andrey Sobolev <haiodo@users.noreply.github.com>
Date: Thu, 30 Jun 2022 10:36:15 +0700
Subject: [PATCH] Fix Issues TSK-220, TSK-221 (#2170)

Signed-off-by: Andrey Sobolev <haiodo@gmail.com>
---
 models/task/src/index.ts                         |  4 ++--
 packages/presentation/src/components/Card.svelte |  9 +++++++++
 packages/ui/src/components/Button.svelte         |  5 +++--
 packages/ui/src/resize.ts                        | 12 +++++++-----
 4 files changed, 21 insertions(+), 9 deletions(-)

diff --git a/models/task/src/index.ts b/models/task/src/index.ts
index 5fcdd6dcca..45722829f0 100644
--- a/models/task/src/index.ts
+++ b/models/task/src/index.ts
@@ -275,7 +275,7 @@ export const actionTemplates = template({
       label: task.string.Archive,
       message: task.string.ArchiveConfirm
     },
-    input: 'focus',
+    input: 'any',
     category: task.category.Task,
     query: {
       archived: false
@@ -296,7 +296,7 @@ export const actionTemplates = template({
       label: task.string.Unarchive,
       message: task.string.UnarchiveConfirm
     },
-    input: 'focus',
+    input: 'any',
     category: task.category.Task,
     query: {
       archived: true
diff --git a/packages/presentation/src/components/Card.svelte b/packages/presentation/src/components/Card.svelte
index e0f81505fb..2467e2ce80 100644
--- a/packages/presentation/src/components/Card.svelte
+++ b/packages/presentation/src/components/Card.svelte
@@ -27,6 +27,8 @@
   export let okLabel: IntlString = presentation.string.Create
 
   const dispatch = createEventDispatcher()
+
+  let okProcessing = false
 </script>
 
 <form id={label} class="antiCard dialog" on:submit|preventDefault={() => {}}>
@@ -71,17 +73,24 @@
         <MiniToggle label={presentation.string.CreateMore} bind:on={createMore} />
       {/if}
       <Button
+        loading={okProcessing}
         focusIndex={10001}
         disabled={!canSave}
         label={okLabel}
         kind={'primary'}
         on:click={() => {
+          if (okProcessing) {
+            return
+          }
+          okProcessing = true
           const r = okAction()
           if (r instanceof Promise && !createMore) {
             r.then(() => {
+              okProcessing = false
               dispatch('close')
             })
           } else if (!createMore) {
+            okProcessing = false
             dispatch('close')
           }
         }}
diff --git a/packages/ui/src/components/Button.svelte b/packages/ui/src/components/Button.svelte
index 0a7ef26320..a65bab92d0 100644
--- a/packages/ui/src/components/Button.svelte
+++ b/packages/ui/src/components/Button.svelte
@@ -125,8 +125,9 @@
   {/if}
   {#if loading}
     <Spinner />
-  {:else if label}
-    <span class="overflow-label disabled">
+  {/if}
+  {#if label}
+    <span class="overflow-label disabled" class:ml-2={loading}>
       <Label {label} params={labelParams} />
     </span>
   {:else if $$slots.content}
diff --git a/packages/ui/src/resize.ts b/packages/ui/src/resize.ts
index 44d6a4b9da..3ac776202e 100644
--- a/packages/ui/src/resize.ts
+++ b/packages/ui/src/resize.ts
@@ -20,12 +20,14 @@ export function resizeObserver (element: Element, onResize: (element: Element) =
   if (observer === undefined) {
     callbacks = new WeakMap()
     observer = new ResizeObserver((entries) => {
-      for (const entry of entries) {
-        const onResize = callbacks.get(entry.target)
-        if (onResize != null) {
-          onResize(entry.target)
+      window.requestAnimationFrame(() => {
+        for (const entry of entries) {
+          const onResize = callbacks.get(entry.target)
+          if (onResize != null) {
+            onResize(entry.target)
+          }
         }
-      }
+      })
     })
   }