feat: add clear inbox and sent items functionality (#720)

- Add clear inbox/sent items APIs for users and admins
- Implement ENABLE_USER_DELETE_EMAIL permission checks
- Fix multilingual support for success messages
- Update Vue to 3.5.21 and Wrangler to 4.34.0
- Add UI components for clearing email data in account settings

🤖 Generated with [Claude Code](https://claude.ai/code)

Co-authored-by: Claude <noreply@anthropic.com>

frontend/package.json

@@ -30,7 +30,7 @@
     "naive-ui": "^2.42.0",
     "postal-mime": "^2.4.4",
     "vooks": "^0.2.12",
-    "vue": "^3.5.20",
+    "vue": "^3.5.21",
     "vue-clipboard3": "^2.0.0",
     "vue-i18n": "^11.1.11",
     "vue-router": "^4.5.1"
@@ -47,7 +47,7 @@
     "vite-plugin-wasm": "^3.5.0",
     "workbox-build": "^7.3.0",
     "workbox-window": "^7.3.0",
-    "wrangler": "^4.33.0"
+    "wrangler": "^4.34.0"
   },
   "packageManager": "pnpm@10.10.0+sha512.d615db246fe70f25dcfea6d8d73dee782ce23e2245e3c4f6f888249fb568149318637dca73c2c5c8ef2a4ca0d5657fb9567188bfab47f566d1ee6ce987815c39"
 }

frontend/src/views/admin/Account.vue

@@ -33,7 +33,12 @@ const { t } = useI18n({
             itemCount: 'itemCount',
             query: 'Query',
             addressQueryTip: 'Leave blank to query all addresses',
-            actions: 'Actions'
+            clearInbox: 'Clear Inbox',
+            clearSentItems: 'Clear Sent Items',
+            clearInboxTip: 'Are you sure to clear inbox for this email?',
+            clearSentItemsTip: 'Are you sure to clear sent items for this email?',
+            actions: 'Actions',
+            success: 'Success',
         },
         zh: {
             name: '名称',
@@ -52,7 +57,12 @@ const { t } = useI18n({
             itemCount: '总数',
             query: '查询',
             addressQueryTip: '留空查询所有地址',
+            clearInbox: '清空收件箱',
+            clearSentItems: '清空发件箱',
+            clearInboxTip: '确定要清空这个邮箱的收件箱吗？',
+            clearSentItemsTip: '确定要清空这个邮箱的发件箱吗？',
             actions: '操作',
+            success: '成功',
         }
     }
 });
@@ -60,6 +70,8 @@ const { t } = useI18n({
 const showEmailCredential = ref(false)
 const curEmailCredential = ref("")
 const curDeleteAddressId = ref(0);
+const curClearInboxAddressId = ref(0);
+const curClearSentItemsAddressId = ref(0);
 
 const addressQuery = ref("")
 
@@ -68,6 +80,8 @@ const count = ref(0)
 const page = ref(1)
 const pageSize = ref(20)
 const showDeleteAccount = ref(false)
+const showClearInbox = ref(false)
+const showClearSentItems = ref(false)
 
 const showCredential = async (id) => {
     try {
@@ -83,7 +97,7 @@ const showCredential = async (id) => {
 const deleteEmail = async () => {
     try {
         await api.adminDeleteAddress(curDeleteAddressId.value)
-        message.success("success");
+        message.success(t("success"));
         await fetchData()
     } catch (error) {
         message.error(error.message || "error");
@@ -92,6 +106,34 @@ const deleteEmail = async () => {
     }
 }
 
+const clearInbox = async () => {
+    try {
+        await api.fetch(`/admin/clear_inbox/${curClearInboxAddressId.value}`, {
+            method: 'DELETE'
+        });
+        message.success(t("success"));
+        await fetchData()
+    } catch (error) {
+        message.error(error.message || "error");
+    } finally {
+        showClearInbox.value = false
+    }
+}
+
+const clearSentItems = async () => {
+    try {
+        await api.fetch(`/admin/clear_sent_items/${curClearSentItemsAddressId.value}`, {
+            method: 'DELETE'
+        });
+        message.success(t("success"));
+        await fetchData()
+    } catch (error) {
+        message.error(error.message || "error");
+    } finally {
+        showClearSentItems.value = false
+    }
+}
+
 const fetchData = async () => {
     try {
         addressQuery.value = addressQuery.value.trim()
@@ -228,6 +270,32 @@ const columns = [
                                     ),
                                     show: row.send_count > 0
                                 },
+                                {
+                                    label: () => h(NButton,
+                                        {
+                                            text: true,
+                                            onClick: () => {
+                                                curClearInboxAddressId.value = row.id;
+                                                showClearInbox.value = true;
+                                            }
+                                        },
+                                        { default: () => t('clearInbox') }
+                                    ),
+                                    show: row.mail_count > 0
+                                },
+                                {
+                                    label: () => h(NButton,
+                                        {
+                                            text: true,
+                                            onClick: () => {
+                                                curClearSentItemsAddressId.value = row.id;
+                                                showClearSentItems.value = true;
+                                            }
+                                        },
+                                        { default: () => t('clearSentItems') }
+                                    ),
+                                    show: row.send_count > 0
+                                },
                                 {
                                     label: () => h(NButton,
                                         {
@@ -281,6 +349,22 @@ onMounted(async () => {
                 </n-button>
             </template>
         </n-modal>
+        <n-modal v-model:show="showClearInbox" preset="dialog" :title="t('clearInbox')">
+            <p>{{ t('clearInboxTip') }}</p>
+            <template #action>
+                <n-button :loading="loading" @click="clearInbox" size="small" tertiary type="error">
+                    {{ t('clearInbox') }}
+                </n-button>
+            </template>
+        </n-modal>
+        <n-modal v-model:show="showClearSentItems" preset="dialog" :title="t('clearSentItems')">
+            <p>{{ t('clearSentItemsTip') }}</p>
+            <template #action>
+                <n-button :loading="loading" @click="clearSentItems" size="small" tertiary type="error">
+                    {{ t('clearSentItems') }}
+                </n-button>
+            </template>
+        </n-modal>
         <n-input-group>
             <n-input v-model:value="addressQuery" clearable :placeholder="t('addressQueryTip')"
                 @keydown.enter="fetchData" />

frontend/src/views/index/AccountSettings.vue

@@ -8,13 +8,15 @@ import { api } from '../../api'
 import { getRouterPathWithLang } from '../../utils'
 
 const {
-    jwt, settings, showAddressCredential, loading
+    jwt, settings, showAddressCredential, loading, openSettings
 } = useGlobalState()
 const router = useRouter()
 const message = useMessage()
 
 const showLogout = ref(false)
 const showDeleteAccount = ref(false)
+const showClearInbox = ref(false)
+const showClearSentItems = ref(false)
 const { locale, t } = useI18n({
     messages: {
         en: {
@@ -24,6 +26,11 @@ const { locale, t } = useI18n({
             logoutConfirm: 'Are you sure to logout?',
             deleteAccount: "Delete Account",
             deleteAccountConfirm: "Are you sure to delete your account and all emails for this account?",
+            clearInbox: "Clear Inbox",
+            clearSentItems: "Clear Sent Items",
+            clearInboxConfirm: "Are you sure to clear all emails in your inbox?",
+            clearSentItemsConfirm: "Are you sure to clear all emails in your sent items?",
+            success: "Success",
         },
         zh: {
             logout: '退出登录',
@@ -32,6 +39,11 @@ const { locale, t } = useI18n({
             logoutConfirm: '确定要退出登录吗？',
             deleteAccount: "删除账户",
             deleteAccountConfirm: "确定要删除你的账户和其中的所有邮件吗?",
+            clearInbox: "清空收件箱",
+            clearSentItems: "清空发件箱",
+            clearInboxConfirm: "确定要清空你收件箱中的所有邮件吗？",
+            clearSentItemsConfirm: "确定要清空你发件箱中的所有邮件吗？",
+            success: "成功",
         }
     }
 });
@@ -54,6 +66,32 @@ const deleteAccount = async () => {
         message.error(error.message || "error");
     }
 };
+
+const clearInbox = async () => {
+    try {
+        await api.fetch(`/api/clear_inbox`, {
+            method: 'DELETE'
+        });
+        message.success(t("success"));
+    } catch (error) {
+        message.error(error.message || "error");
+    } finally {
+        showClearInbox.value = false;
+    }
+};
+
+const clearSentItems = async () => {
+    try {
+        await api.fetch(`/api/clear_sent_items`, {
+            method: 'DELETE'
+        });
+        message.success(t("success"));
+    } catch (error) {
+        message.error(error.message || "error");
+    } finally {
+        showClearSentItems.value = false;
+    }
+};
 </script>
 
 <template>
@@ -62,10 +100,19 @@ const deleteAccount = async () => {
             <n-button @click="showAddressCredential = true" type="primary" secondary block strong>
                 {{ t('showAddressCredential') }}
             </n-button>
+            <n-button v-if="openSettings.enableUserDeleteEmail" @click="showClearInbox = true" type="warning" secondary
+                block strong>
+                {{ t('clearInbox') }}
+            </n-button>
+            <n-button v-if="openSettings.enableUserDeleteEmail" @click="showClearSentItems = true" type="warning"
+                secondary block strong>
+                {{ t('clearSentItems') }}
+            </n-button>
             <n-button @click="showLogout = true" secondary block strong>
                 {{ t('logout') }}
             </n-button>
-            <n-button @click="showDeleteAccount = true" type="error" secondary block strong>
+            <n-button v-if="openSettings.enableUserDeleteEmail" @click="showDeleteAccount = true" type="error" secondary
+                block strong>
                 {{ t('deleteAccount') }}
             </n-button>
         </n-card>
@@ -85,6 +132,22 @@ const deleteAccount = async () => {
                 </n-button>
             </template>
         </n-modal>
+        <n-modal v-model:show="showClearInbox" preset="dialog" :title="t('clearInbox')">
+            <p>{{ t('clearInboxConfirm') }}</p>
+            <template #action>
+                <n-button :loading="loading" @click="clearInbox" size="small" tertiary type="warning">
+                    {{ t('clearInbox') }}
+                </n-button>
+            </template>
+        </n-modal>
+        <n-modal v-model:show="showClearSentItems" preset="dialog" :title="t('clearSentItems')">
+            <p>{{ t('clearSentItemsConfirm') }}</p>
+            <template #action>
+                <n-button :loading="loading" @click="clearSentItems" size="small" tertiary type="warning">
+                    {{ t('clearSentItems') }}
+                </n-button>
+            </template>
+        </n-modal>
     </div>
 </template>
 

pages/package.json

@@ -11,7 +11,7 @@
   "author": "",
   "license": "ISC",
   "devDependencies": {
-    "wrangler": "^4.33.0"
+    "wrangler": "^4.34.0"
   },
   "packageManager": "pnpm@10.10.0+sha512.d615db246fe70f25dcfea6d8d73dee782ce23e2245e3c4f6f888249fb568149318637dca73c2c5c8ef2a4ca0d5657fb9567188bfab47f566d1ee6ce987815c39"
 }

vitepress-docs/package.json

@@ -4,9 +4,9 @@
   "version": "1.0.5",
   "type": "module",
   "devDependencies": {
-    "@types/node": "^24.3.0",
+    "@types/node": "^24.3.1",
     "vitepress": "^1.6.4",
-    "wrangler": "^4.33.0"
+    "wrangler": "^4.34.0"
   },
   "scripts": {
     "dev": "vitepress dev docs",

worker/package.json

@@ -11,20 +11,20 @@
     "build": "wrangler deploy --dry-run --outdir dist --minify"
   },
   "devDependencies": {
-    "@cloudflare/workers-types": "^4.20250826.0",
+    "@cloudflare/workers-types": "^4.20250904.0",
     "@eslint/js": "9.18.0",
     "@simplewebauthn/types": "10.0.0",
-    "@types/node": "^22.18.0",
+    "@types/node": "^22.18.1",
     "eslint": "9.18.0",
     "globals": "^15.15.0",
-    "typescript-eslint": "^8.41.0",
+    "typescript-eslint": "^8.42.0",
-    "wrangler": "^4.33.0"
+    "wrangler": "^4.34.0"
   },
   "dependencies": {
-    "@aws-sdk/client-s3": "^3.876.0",
+    "@aws-sdk/client-s3": "^3.879.0",
-    "@aws-sdk/s3-request-presigner": "^3.876.0",
+    "@aws-sdk/s3-request-presigner": "^3.879.0",
     "@simplewebauthn/server": "10.0.1",
-    "hono": "^4.9.4",
+    "hono": "^4.9.6",
     "jsonpath-plus": "^10.3.0",
     "mimetext": "^3.0.27",
     "postal-mime": "^2.4.4",

worker/src/admin_api/index.ts

@@ -89,6 +89,34 @@ api.delete('/admin/delete_address/:id', async (c) => {
     })
 })
 
+api.delete('/admin/clear_inbox/:id', async (c) => {
+    const { id } = c.req.param();
+    const { success: mailSuccess } = await c.env.DB.prepare(
+        `DELETE FROM raw_mails WHERE address IN`
+        + ` (select name from address where id = ?) `
+    ).bind(id).run();
+    if (!mailSuccess) {
+        return c.text("Failed to clear inbox", 500)
+    }
+    return c.json({
+        success: mailSuccess
+    })
+})
+
+api.delete('/admin/clear_sent_items/:id', async (c) => {
+    const { id } = c.req.param();
+    const { success: sendboxSuccess } = await c.env.DB.prepare(
+        `DELETE FROM sendbox WHERE address IN`
+        + ` (select name from address where id = ?) `
+    ).bind(id).run();
+    if (!sendboxSuccess) {
+        return c.text("Failed to clear sent items", 500)
+    }
+    return c.json({
+        success: sendboxSuccess
+    })
+})
+
 api.get('/admin/show_password/:id', async (c) => {
     const { id } = c.req.param();
     const name = await c.env.DB.prepare(

worker/src/common.ts

@@ -268,9 +268,7 @@ const batchDeleteAddressWithData = async (
     return true;
 }
 
-/**
+
- * TODO: need senbox delete?
- */
 export const deleteAddressWithData = async (
     c: Context<HonoCustomType>,
     address: string | undefined | null,

worker/src/mails_api/index.ts

@@ -162,3 +162,39 @@ api.delete('/api/delete_address', async (c) => {
         success: success
     })
 })
+
+api.delete('/api/clear_inbox', async (c) => {
+    const lang = c.get("lang") || c.env.DEFAULT_LANG;
+    const msgs = i18n.getMessages(lang);
+    if (!getBooleanValue(c.env.ENABLE_USER_DELETE_EMAIL)) {
+        return c.text(msgs.UserDeleteEmailDisabledMsg, 403)
+    }
+    const { address } = c.get("jwtPayload")
+    const { success } = await c.env.DB.prepare(
+        `DELETE FROM raw_mails WHERE address = ?`
+    ).bind(address).run();
+    if (!success) {
+        return c.text("Failed to clear inbox", 500)
+    }
+    return c.json({
+        success: success
+    })
+})
+
+api.delete('/api/clear_sent_items', async (c) => {
+    const lang = c.get("lang") || c.env.DEFAULT_LANG;
+    const msgs = i18n.getMessages(lang);
+    if (!getBooleanValue(c.env.ENABLE_USER_DELETE_EMAIL)) {
+        return c.text(msgs.UserDeleteEmailDisabledMsg, 403)
+    }
+    const { address } = c.get("jwtPayload")
+    const { success } = await c.env.DB.prepare(
+        `DELETE FROM sendbox WHERE address = ?`
+    ).bind(address).run();
+    if (!success) {
+        return c.text("Failed to clear sent items", 500)
+    }
+    return c.json({
+        success: success
+    })
+})