Update translations

dashboard/src/views/EmailMailboxesView.vue

@@ -5,7 +5,7 @@ const i18n = useI18n();
 const t = i18n.t;
 
 import { ref, onMounted, useTemplateRef, inject, computed } from 'vue';
-import { Button, TableView, Dialog, Checkbox, TextInput } from '@cloudron/pankow';
+import { Button, TableView, Dialog, Checkbox, TextInput, Menu } from '@cloudron/pankow';
 import { prettyDecimalSize } from '@cloudron/pankow/utils';
 import { eachLimit } from 'async';
 import Section from '../components/Section.vue';
@@ -50,6 +50,24 @@ const columns = {
   actions: {}
 };
 
+const actionMenuModel = ref([]);
+const actionMenuElement = useTemplateRef('actionMenuElement');
+function onActionMenu(mailbox, event) {
+  actionMenuModel.value = [{
+    icon: 'fa-solid fa-pencil-alt',
+    label: t('main.action.edit'),
+    action: onAddOrEdit.bind(null, mailbox),
+  }, {
+    separator: true,
+  }, {
+    icon: 'fa-solid fa-trash-alt',
+    label: t('main.action.remove'),
+    action: onRemove.bind(null, mailbox),
+  }];
+
+  actionMenuElement.value.open(event, event.currentTarget);
+}
+
 const busy = ref(true);
 const mailboxes = ref([]);
 const domains = ref([]);
@@ -184,6 +202,7 @@ onMounted(async () => {
 
 <template>
   <div class="content">
+    <Menu ref="actionMenuElement" :model="actionMenuModel" />
     <Dialog ref="removeDialog"
       :title="$t('email.deleteMailboxDialog.title', { name: removeMailbox.name, domain: removeMailbox.domain })"
       :confirm-label="$t('email.deleteMailboxDialog.deleteAction')"
@@ -220,9 +239,8 @@ onMounted(async () => {
           <span v-if="mailbox.usage && mailbox.usage.quotaLimit">{{ prettyDecimalSize(mailbox.usage.quotaLimit) }}</span>
         </template>
         <template #actions="mailbox">
-          <div class="table-actions">
-            <Button tool secondary small icon="fa fa-pencil-alt" @click.stop="onAddOrEdit(mailbox)"></Button>
-            <Button tool danger small icon="fa-solid fa-trash-alt" @click.stop="onRemove(mailbox)"></Button>
+          <div style="text-align: right;">
+            <Button tool plain secondary @click.capture="onActionMenu(mailbox, $event)" icon="fa-solid fa-ellipsis" />
           </div>
         </template>
       </TableView>