From e482ea2ed4ed097780f6e1f32b316542ba23ff61 Mon Sep 17 00:00:00 2001
From: JianJroh <rhjian@foxmail.com>
Date: Wed, 1 Apr 2026 14:26:04 +0800
Subject: [PATCH 1/2] feat: cancel auto-delete timer when log entry is selected

---
 .../components/views-builtin/ViewBuiltinLogs.vue         | 9 ++++++++-
 1 file changed, 8 insertions(+), 1 deletion(-)

diff --git a/packages/core/src/client/webcomponents/components/views-builtin/ViewBuiltinLogs.vue b/packages/core/src/client/webcomponents/components/views-builtin/ViewBuiltinLogs.vue
index 78acd71c..106289a4 100644
--- a/packages/core/src/client/webcomponents/components/views-builtin/ViewBuiltinLogs.vue
+++ b/packages/core/src/client/webcomponents/components/views-builtin/ViewBuiltinLogs.vue
@@ -2,7 +2,7 @@
 import type { DevToolsLogEntry, DevToolsLogEntryFrom, DevToolsLogLevel } from '@vitejs/devtools-kit'
 import type { DocksContext } from '@vitejs/devtools-kit/client'
 import { useClipboard, useTimeAgo } from '@vueuse/core'
-import { computed, onMounted, ref } from 'vue'
+import { computed, onMounted, ref, watch } from 'vue'
 import { markLogsAsRead, useLogs } from '../../state/logs'
 import FilterToggles from '../display/FilterToggles.vue'
 import HashBadge from '../display/HashBadge.vue'
@@ -161,6 +161,13 @@ const selectedEntry = computed(() => {
   return logsState.entries.find(e => e.id === selectedId.value) ?? null
 })
 
+watch(selectedEntry, async (entry) => {
+  if (!entry?.autoDelete)
+    return
+
+  await props.context.rpc.call('devtoolskit:internal:logs:update', entry.id, { autoDelete: 0 })
+})
+
 const selectedTimeAgo = useTimeAgo(computed(() => selectedEntry.value?.timestamp ?? Date.now()))
 const { copy: copyStacktrace, copied: stacktraceCopied } = useClipboard()
 

From 176a754e9ff74358f44fab6d120074f4e36b1c94 Mon Sep 17 00:00:00 2001
From: JianJroh <rhjian@foxmail.com>
Date: Wed, 1 Apr 2026 14:37:52 +0800
Subject: [PATCH 2/2] chore: add auto-dismiss and auto-delete fields to log
 form in playground

---
 packages/core/playground/src/pages/devtools.vue | 12 ++++++++++++
 1 file changed, 12 insertions(+)

diff --git a/packages/core/playground/src/pages/devtools.vue b/packages/core/playground/src/pages/devtools.vue
index 681e2120..a24c9ebf 100644
--- a/packages/core/playground/src/pages/devtools.vue
+++ b/packages/core/playground/src/pages/devtools.vue
@@ -18,6 +18,8 @@ const logStatus = ref<'idle' | 'loading'>('idle')
 const logId = ref('')
 const logDescription = ref('')
 const logStacktrace = ref('')
+const logAutoDismiss = ref<number>()
+const logAutoDelete = ref<number>()
 
 // Update form
 const updateId = ref('')
@@ -56,6 +58,8 @@ async function addLog() {
     id: logId.value || undefined,
     description: logDescription.value || undefined,
     stacktrace: logStacktrace.value || undefined,
+    autoDismiss: logAutoDismiss.value,
+    autoDelete: logAutoDelete.value,
   })
 }
 
@@ -231,6 +235,14 @@ function incrementCounter() {
           <span op50 text-xs>Stacktrace</span>
           <textarea v-model="logStacktrace" rows="3" border="~ base" rounded px2 py1 text-sm bg-transparent outline-none resize-y font-mono />
         </label>
+        <label flex="~ col gap-1">
+          <span op50 text-xs>Auto Dismiss</span>
+          <input v-model="logAutoDismiss" type="number" border="~ base" rounded px2 py1 text-sm bg-transparent outline-none>
+        </label>
+        <label flex="~ col gap-1">
+          <span op50 text-xs>Auto Delete</span>
+          <input v-model="logAutoDelete" type="number" border="~ base" rounded px2 py1 text-sm bg-transparent outline-none>
+        </label>
       </div>
       <div flex items-center gap-3 mt2>
         <label flex items-center gap-1 text-xs>