diff --git a/packages/web-app-mail/src/components/MailAccountList.vue b/packages/web-app-mail/src/components/MailAccountList.vue
deleted file mode 100644
index fff7818eef..0000000000
--- a/packages/web-app-mail/src/components/MailAccountList.vue
+++ /dev/null
@@ -1,55 +0,0 @@
-<template>
-  <div class="flex justify-center">
-    <app-loading-spinner v-if="isLoading" />
-    <oc-list v-else>
-      <li v-for="account in accounts" :key="account.accountId">
-        <oc-button
-          v-oc-tooltip="account.name"
-          class="account-list-item mt-4"
-          no-hover
-          appearance="raw"
-          @click="onSelectAccount(account)"
-        >
-          <oc-avatar
-            :class="{
-              'border-2 border-role-secondary': currentAccount?.accountId === account.accountId
-            }"
-            :user-name="account.name"
-          />
-        </oc-button>
-      </li>
-    </oc-list>
-  </div>
-</template>
-
-<script setup lang="ts">
-import { AppLoadingSpinner } from '@opencloud-eu/web-pkg'
-import type { MailAccount } from '../types'
-import { useLoadAccounts } from '../composables/useLoadAccounts'
-import { useAccountsStore } from '../composables/piniaStores/accounts'
-import { storeToRefs } from 'pinia'
-import { useMailboxesStore } from '../composables/piniaStores/mailboxes'
-import { useLoadMailboxes } from '../composables/useLoadMailboxes'
-import { unref } from 'vue'
-import { useLoadMails } from '../composables/useLoadMails'
-import { useMailsStore } from '../composables/piniaStores/mails'
-
-const accountsStore = useAccountsStore()
-const { accounts, currentAccount } = storeToRefs(accountsStore)
-const { setCurrentAccount } = accountsStore
-const mailboxesStore = useMailboxesStore()
-const { mailboxes, currentMailbox } = storeToRefs(mailboxesStore)
-const { setCurrentMailbox } = mailboxesStore
-const { loadMailboxes } = useLoadMailboxes()
-const { loadMails } = useLoadMails()
-const { setCurrentMail } = useMailsStore()
-const { isLoading } = useLoadAccounts()
-
-const onSelectAccount = async (account: MailAccount) => {
-  setCurrentAccount(account)
-  setCurrentMail(null)
-  await loadMailboxes(unref(currentAccount).accountId)
-  setCurrentMailbox(unref(mailboxes)[0])
-  await loadMails(unref(currentAccount).accountId, unref(currentMailbox).id)
-}
-</script>
diff --git a/packages/web-app-mail/src/components/MailAccountSwitch.vue b/packages/web-app-mail/src/components/MailAccountSwitch.vue
new file mode 100644
index 0000000000..6c40cb3017
--- /dev/null
+++ b/packages/web-app-mail/src/components/MailAccountSwitch.vue
@@ -0,0 +1,86 @@
+<template>
+  <oc-button
+    id="account-list-toggle"
+    class="w-full"
+    appearance="filled"
+    color-role="surface"
+    justify-content="space-between"
+    no-hover
+  >
+    <app-loading-spinner v-if="isLoading" />
+    <div v-else class="flex justify-between items-center w-full">
+      <div class="flex items-center truncate">
+        <oc-avatar :user-name="currentAccount.name" />
+        <div class="flex flex-col items-start ml-5 truncate">
+          <span class="font-bold" v-text="currentAccount.name" />
+          <span
+            v-if="currentAccount.identities?.[0]?.email"
+            v-text="currentAccount.identities[0].email"
+          />
+        </div>
+      </div>
+      <oc-icon class="ml-2" name="more-2" />
+    </div>
+  </oc-button>
+  <oc-drop :title="$gettext('Accounts')" class="w-md" toggle="#account-list-toggle" close-on-click>
+    <oc-list>
+      <li v-for="account in accounts" :key="account.accountId" class="oc-list">
+        <oc-button
+          class="p-2"
+          :appearance="account.accountId === currentAccount.accountId ? 'filled' : 'raw-inverse'"
+          :color-role="
+            account.accountId === currentAccount.accountId ? 'secondaryContainer' : 'surface'
+          "
+          @click="onSelectAccount(account)"
+        >
+          <div class="flex justify-between items-center w-full">
+            <div class="flex items-center truncate">
+              <oc-avatar :user-name="account.name" />
+              <div class="flex flex-col items-start ml-5 truncate">
+                <span class="font-bold" v-text="account.name" />
+                <span v-if="account.identities?.[0]?.email" v-text="account.identities[0].email" />
+              </div>
+            </div>
+            <oc-icon
+              v-if="account.accountId === currentAccount.accountId"
+              class="ml-2"
+              name="check"
+            />
+          </div>
+        </oc-button>
+      </li>
+    </oc-list>
+  </oc-drop>
+</template>
+
+<script setup lang="ts">
+import { AppLoadingSpinner } from '@opencloud-eu/web-pkg'
+import type { MailAccount } from '../types'
+import { useLoadAccounts } from '../composables/useLoadAccounts'
+import { useAccountsStore } from '../composables/piniaStores/accounts'
+import { storeToRefs } from 'pinia'
+import { useMailboxesStore } from '../composables/piniaStores/mailboxes'
+import { useLoadMailboxes } from '../composables/useLoadMailboxes'
+import { unref } from 'vue'
+import { useLoadMails } from '../composables/useLoadMails'
+import { useMailsStore } from '../composables/piniaStores/mails'
+
+const accountsStore = useAccountsStore()
+const { accounts, currentAccount } = storeToRefs(accountsStore)
+const { setCurrentAccount } = accountsStore
+const mailboxesStore = useMailboxesStore()
+const { mailboxes, currentMailbox } = storeToRefs(mailboxesStore)
+const { setCurrentMailbox } = mailboxesStore
+const { loadMailboxes } = useLoadMailboxes()
+const { loadMails } = useLoadMails()
+const { setCurrentMail } = useMailsStore()
+const { isLoading } = useLoadAccounts()
+
+const onSelectAccount = async (account: MailAccount) => {
+  setCurrentAccount(account)
+  setCurrentMail(null)
+  await loadMailboxes(unref(currentAccount).accountId)
+  setCurrentMailbox(unref(mailboxes)[0])
+  await loadMails(unref(currentAccount).accountId, unref(currentMailbox).id)
+}
+</script>
diff --git a/packages/web-app-mail/src/components/MailboxTree.vue b/packages/web-app-mail/src/components/MailboxTree.vue
index f9db9d8a86..3662d00789 100644
--- a/packages/web-app-mail/src/components/MailboxTree.vue
+++ b/packages/web-app-mail/src/components/MailboxTree.vue
@@ -1,44 +1,49 @@
 <template>
-  <div class="mailbox-tree h-full px-1">
-    <h1 v-if="currentAccount" class="text-lg ml-4 truncate" v-text="currentAccount.name" />
-    <app-loading-spinner v-if="isLoading" />
-    <template v-else>
-      <no-content-message v-if="!mailboxes?.length" icon="folder-reduce" icon-fill-type="line">
-        <template #message>
-          <span v-text="$gettext('No mailboxes found')" />
-        </template>
-      </no-content-message>
-      <div v-else>
-        <oc-list class="mailbox-tree mt-1">
-          <li v-for="mailbox in mailboxes" :key="mailbox.id" class="pb-1 px-2">
-            <oc-button
-              class="w-full p-2 hover:bg-role-surface-container-highest focus:bg-role-surface-container-highest"
-              :class="{ '!bg-role-secondary-container': currentMailbox?.id === mailbox.id }"
-              no-hover
-              justify-content="left"
-              appearance="raw"
-              size="small"
-              @click="onSelectMailbox(mailbox)"
-            >
-              <div class="flex items-center justify-between w-full">
-                <div class="flex items-center truncate">
-                  <oc-icon name="folder" class="mr-2" fill-type="line" />
-                  <span class="truncate" v-text="mailbox.name" />
+  <div class="mailbox-tree h-full px-1 flex flex-col">
+    <div>
+      <h1 v-if="currentAccount" class="text-lg ml-4 truncate" v-text="currentAccount.name" />
+      <app-loading-spinner v-if="isLoading" />
+      <template v-else>
+        <no-content-message v-if="!mailboxes?.length" icon="folder-reduce" icon-fill-type="line">
+          <template #message>
+            <span v-text="$gettext('No mailboxes found')" />
+          </template>
+        </no-content-message>
+        <div v-else>
+          <oc-list class="mailbox-tree mt-1">
+            <li v-for="mailbox in mailboxes" :key="mailbox.id" class="pb-1 px-2">
+              <oc-button
+                class="w-full p-2 hover:bg-role-surface-container-highest focus:bg-role-surface-container-highest"
+                :class="{ '!bg-role-secondary-container': currentMailbox?.id === mailbox.id }"
+                no-hover
+                justify-content="left"
+                appearance="raw"
+                size="small"
+                @click="onSelectMailbox(mailbox)"
+              >
+                <div class="flex items-center justify-between w-full">
+                  <div class="flex items-center truncate">
+                    <oc-icon name="folder" class="mr-2" fill-type="line" />
+                    <span class="truncate" v-text="mailbox.name" />
+                  </div>
+                  <oc-tag
+                    v-if="mailbox.unreadEmails"
+                    v-oc-tooltip="$gettext('Unread emails')"
+                    class="ml-2"
+                    appearance="filled"
+                    :rounded="true"
+                    ><span v-text="mailbox.unreadEmails"
+                  /></oc-tag>
                 </div>
-                <oc-tag
-                  v-if="mailbox.unreadEmails"
-                  v-oc-tooltip="$gettext('Unread emails')"
-                  class="ml-2"
-                  appearance="filled"
-                  :rounded="true"
-                  ><span v-text="mailbox.unreadEmails"
-                /></oc-tag>
-              </div>
-            </oc-button>
-          </li>
-        </oc-list>
-      </div>
-    </template>
+              </oc-button>
+            </li>
+          </oc-list>
+        </div>
+      </template>
+    </div>
+    <div class="w-full self-end mt-auto px-2 py-4">
+      <MailAccountSwitch />
+    </div>
   </div>
 </template>
 
@@ -52,6 +57,7 @@ import { useAccountsStore } from '../composables/piniaStores/accounts'
 import { useMailsStore } from '../composables/piniaStores/mails'
 import { useLoadMails } from '../composables/useLoadMails'
 import { unref } from 'vue'
+import MailAccountSwitch from './MailAccountSwitch.vue'
 
 const mailboxesStore = useMailboxesStore()
 const accountsStore = useAccountsStore()
diff --git a/packages/web-app-mail/src/composables/useLoadAccounts.ts b/packages/web-app-mail/src/composables/useLoadAccounts.ts
index 32ffb9369f..2e99a9b590 100644
--- a/packages/web-app-mail/src/composables/useLoadAccounts.ts
+++ b/packages/web-app-mail/src/composables/useLoadAccounts.ts
@@ -31,7 +31,7 @@ export const useLoadAccounts = () => {
     }).restartable()
   }
 
-  const loadAccounts = async () => {
+  const loadAccounts = () => {
     return loadAccountsTask!.perform()
   }
 
diff --git a/packages/web-app-mail/src/composables/useLoadMail.ts b/packages/web-app-mail/src/composables/useLoadMail.ts
index e9c4a181b2..cf6dc866df 100644
--- a/packages/web-app-mail/src/composables/useLoadMail.ts
+++ b/packages/web-app-mail/src/composables/useLoadMail.ts
@@ -34,7 +34,7 @@ export const useLoadMail = () => {
     }).restartable()
   }
 
-  const loadMail = async (accountId: string, mailId: string) => {
+  const loadMail = (accountId: string, mailId: string) => {
     return loadMailTask!.perform(accountId, mailId)
   }
 
diff --git a/packages/web-app-mail/src/composables/useLoadMailboxes.ts b/packages/web-app-mail/src/composables/useLoadMailboxes.ts
index 0ef59ee36b..de73f18a96 100644
--- a/packages/web-app-mail/src/composables/useLoadMailboxes.ts
+++ b/packages/web-app-mail/src/composables/useLoadMailboxes.ts
@@ -31,7 +31,7 @@ export const useLoadMailboxes = () => {
     }).restartable()
   }
 
-  const loadMailboxes = async (accountId: string) => {
+  const loadMailboxes = (accountId: string) => {
     return loadMailboxesTask!.perform(accountId)
   }
 
diff --git a/packages/web-app-mail/src/composables/useLoadMails.ts b/packages/web-app-mail/src/composables/useLoadMails.ts
index b9162b9b35..7636f1555e 100644
--- a/packages/web-app-mail/src/composables/useLoadMails.ts
+++ b/packages/web-app-mail/src/composables/useLoadMails.ts
@@ -31,7 +31,7 @@ export const useLoadMails = () => {
     }).restartable()
   }
 
-  const loadMails = async (accountId: string, mailboxId: string) => {
+  const loadMails = (accountId: string, mailboxId: string) => {
     return loadMailsTask!.perform(accountId, mailboxId)
   }
 
diff --git a/packages/web-app-mail/src/views/Inbox.vue b/packages/web-app-mail/src/views/Inbox.vue
index 36f875c9d2..b972dd3de9 100644
--- a/packages/web-app-mail/src/views/Inbox.vue
+++ b/packages/web-app-mail/src/views/Inbox.vue
@@ -8,10 +8,6 @@
           'hidden md:flex': currentMailbox
         }"
       >
-        <div class="border-r-2 overflow-y-auto bg-role-surface-container w-[100px]">
-          <MailAccountList />
-        </div>
-
         <div class="overflow-y-auto md:border-r-2 bg-role-surface-container w-full">
           <MailboxTree />
         </div>
@@ -41,7 +37,6 @@ import { ref, unref, onMounted } from 'vue'
 import MailList from '../components/MailList.vue'
 import MailDetails from '../components/MailDetails.vue'
 import MailboxTree from '../components/MailboxTree.vue'
-import MailAccountList from '../components/MailAccountList.vue'
 import { AppLoadingSpinner, queryItemAsString } from '@opencloud-eu/web-pkg'
 import { useRouteQuery } from '@opencloud-eu/web-pkg'
 import { useMailsStore } from '../composables/piniaStores/mails'