Add archive all button in inbox (#4870)

Signed-off-by: Kristina Fefelova <kristin.fefelova@gmail.com>

plugins/notification-resources/src/components/Filter.svelte

@@ -13,7 +13,7 @@
 // limitations under the License.
 -->
 <script lang="ts">
-  import { Button, IconFilter, SelectPopup, eventToHTMLElement, showPopup } from '@hcengineering/ui'
+  import { IconFilter, SelectPopup, eventToHTMLElement, showPopup, ButtonIcon } from '@hcengineering/ui'
   import notification from '../plugin'
 
   export let filter: 'all' | 'read' | 'unread' = 'all'
@@ -45,4 +45,4 @@
   }
 </script>
 
-<Button icon={IconFilter} on:click={click} />
+<ButtonIcon icon={IconFilter} size="small" on:click={click} />

plugins/notification-resources/src/components/inbox/Inbox.svelte

@@ -31,7 +31,8 @@
     Separator,
     TabItem,
     TabList,
-    Location
+    Location,
+    ModernButton
   } from '@hcengineering/ui'
   import chunter, { ThreadMessage } from '@hcengineering/chunter'
   import { Ref, WithLookup } from '@hcengineering/core'
@@ -255,6 +256,10 @@
   onMount(() => {
     loadSavedMessages()
   })
+
+  function archiveAll (): void {
+    void inboxClient.deleteAllNotifications()
+  }
 </script>
 
 <ActionContext
@@ -283,6 +288,12 @@
             />
           </div>
           <div class="flex flex-gap-2">
+            <ModernButton
+              label={notification.string.ArchiveAll}
+              icon={view.icon.Archive}
+              size="small"
+              on:click={archiveAll}
+            />
             <Filter bind:filter />
           </div>
         </div>