fix(history): require confirmation before clearing all history

apps/desktop/src/renderer/pages/HistoryPage.tsx

@@ -10,6 +10,9 @@ import { useI18n } from '@d3ro/i18n'
 import { getDateKey } from '../utils/formatters'
 import { EmptyStateCard, SearchInput, PageHeader, HistoryEntryCard } from '../components/shared'
 import type { HistoryEntry, HistoryPage as HistoryPageData, TagCount } from '@d3ro/core/types'
+import { isClearAllDialogOpen, isHistoryViewFiltered } from './history/clear-all-history-flow'
+import { useClearAllHistory } from './history/useClearAllHistory'
+import { ClearAllHistoryDialog } from './history/ClearAllHistoryDialog'
 
 const PAGE_SIZE = 50
 
@@ -69,7 +72,6 @@ export function HistoryPage(): React.ReactElement {
   }, [])
 
   const isExportingRef = useRef(false)
-  const isDeletingAllRef = useRef(false)
   const isDeletingSingleRef = useRef(false)
 
   const handleDelete = useCallback(
@@ -117,16 +119,9 @@ export function HistoryPage(): React.ReactElement {
     }
   }, [activeTag])
 
-  const handleDeleteAll = useCallback(async () => {
-    if (isDeletingAllRef.current) return
-    isDeletingAllRef.current = true
-    try {
-      await window.electronAPI.history.deleteAll()
-      loadData()
-    } finally {
-      isDeletingAllRef.current = false
-    }
-  }, [loadData])
+  // 전체 삭제는 필터와 무관하고 동기화로 다른 기기에도 전파되므로 반드시 확인 단계를 거친다
+  const clearAll = useClearAllHistory(loadData)
+  const clearAllState = clearAll.state
 
   return (
     <Box sx={{ maxWidth: 1060, mx: 'auto', p: { xs: 2.5, md: 4 }, pb: 10 }}>
@@ -143,11 +138,13 @@ export function HistoryPage(): React.ReactElement {
               </PhysicalButton>
             </Tooltip>
 
-            <Tooltip title={t('common.clearAll') || '모두 지우기'} arrow>
+            <Tooltip title={t('history.clearAll')} arrow>
               <IconButton
                 size="small"
                 data-testid="clear-all-history-button"
-                onClick={handleDeleteAll}
+                aria-label={t('history.clearAll')}
+                aria-haspopup="dialog"
+                onClick={clearAll.request}
                 sx={{
                   color: d3roPalette.text.inactive,
                   p: 0.75,
@@ -163,6 +160,15 @@ export function HistoryPage(): React.ReactElement {
         }
       />
 
+      <ClearAllHistoryDialog
+        open={isClearAllDialogOpen(clearAllState)}
+        count={'count' in clearAllState ? clearAllState.count : 0}
+        filtered={isHistoryViewFiltered(activeTag, search)}
+        deleting={clearAllState.phase === 'deleting'}
+        onCancel={clearAll.cancel}
+        onConfirm={clearAll.confirm}
+      />
+
       {/* Search Input Bar */}
       {!activeTag && (
         <SearchInput