diff --git a/dashboard/src/components/MailboxDialog.vue b/dashboard/src/components/MailboxDialog.vue
index 7a1f31462..f915b5254 100644
--- a/dashboard/src/components/MailboxDialog.vue
+++ b/dashboard/src/components/MailboxDialog.vue
@@ -18,7 +18,7 @@ const domain = ref('');
const mailbox = ref(null);
const aliases = ref([]);
const ownerId = ref('');
-const usersAndGroups = ref([]);
+const usersAndGroupsAndApps = ref([]);
const storageQuotaEnabled = ref(false);
const storageQuotaTicks = [ 500*1000*1000, 5*1000*1000*1000, 15*1000*1000*1000, 50*1000*1000*1000, 100*1000*1000*1000 ];
const storageQuota = ref(5*1000*1000*1000);
@@ -97,10 +97,15 @@ defineExpose({
enablePop3.value = m ? m.enablePop3 : false;
storageQuotaEnabled.value = m && m.storageQuota ? true : false;
storageQuota.value = m ? m.storageQuota : 5*1000*1000*1000;
- usersAndGroups.value = props.users.concat(props.groups).concat(props.apps);
+ usersAndGroupsAndApps.value = [{ separator: true, label: 'Users' }]
+ .concat(props.users)
+ .concat([{ separator: true, label: 'Groups' }])
+ .concat(props.groups)
+ .concat([{ separator: true, label: 'Apps' }])
+ .concat(props.apps);
// unify on .name for multiselect
- usersAndGroups.value.forEach(u => {
+ usersAndGroupsAndApps.value.forEach(u => {
u.icon = u.name ? 'fa-solid fa-users' : (u.username ? 'fa-solid fa-user' : 'fa-solid fa-cube') ;
u.name = u.name || u.username || u.label || u.fqdn;
});
@@ -148,7 +153,7 @@ defineExpose({
-
+
diff --git a/dashboard/src/style.css b/dashboard/src/style.css
index 46cb87045..2b13e7e83 100644
--- a/dashboard/src/style.css
+++ b/dashboard/src/style.css
@@ -235,6 +235,22 @@ a.pankow-breadcrumb-item {
justify-content: end;
}
+.table-actions-hover {
+ display: none;
+}
+
+.pankow-table-row:hover .pankow-table-cell .table-actions .table-actions-hover {
+ display: block;
+}
+
+.table-actions-no-hover {
+ display: block;
+}
+
+.pankow-table-row:hover .pankow-table-cell .table-actions .table-actions-no-hover {
+ display: none;
+}
+
/* info table label:value in Sections */
.info-row {
display: flex;