+
+
+
+ React Hook Tests • Renders: {displayRenderCount || renderCountRef.current} • Updates: {updateCount}
+
+
+
+
+
+ {/* useCache Testing */}
+
+
+
+ useCache Hook
+
+ }
+ size="small"
+ style={{
+ backgroundColor: isDarkTheme ? '#1f1f1f' : '#fff',
+ borderColor: isDarkTheme ? '#303030' : '#d9d9d9'
+ }}
+ >
+
+ setMemoryCacheKey(e.target.value)}
+ prefix={}
+ />
+
+ setMemoryCacheDefault(e.target.value)}
+ prefix={}
+ />
+
+ setNewMemoryValue(e.target.value)}
+ onPressEnter={handleMemoryUpdate}
+ prefix={}
+ />
+
+
+
+
+ Current Value:
+ {formatValue(memoryValue)}
+
+
+
+
+
+ {/* useSharedCache Testing */}
+
+
+
+ useSharedCache Hook
+
+ }
+ size="small"
+ style={{
+ backgroundColor: isDarkTheme ? '#1f1f1f' : '#fff',
+ borderColor: isDarkTheme ? '#303030' : '#d9d9d9'
+ }}
+ >
+
+ setSharedCacheKey(e.target.value)}
+ prefix={}
+ />
+
+ setSharedCacheDefault(e.target.value)}
+ prefix={}
+ />
+
+ setNewSharedValue(e.target.value)}
+ onPressEnter={handleSharedUpdate}
+ prefix={}
+ />
+
+
+
+
+ Current Value:
+ {formatValue(sharedValue)}
+
+
+
+
+
+ {/* usePersistCache Testing */}
+
+
+
+ usePersistCache Hook
+
+ }
+ size="small"
+ style={{
+ backgroundColor: isDarkTheme ? '#1f1f1f' : '#fff',
+ borderColor: isDarkTheme ? '#303030' : '#d9d9d9'
+ }}
+ >
+
+
+
+ setNewPersistValue(e.target.value)}
+ onPressEnter={handlePersistUpdate}
+ prefix={}
+ />
+
+
+
+
+ Current Value:
+ {formatValue(persistValue)}
+
+
+
+
+
+
+
+
+ {/* Data Type Testing */}
+
+
+
+
+ Number Type Testing
+
+ }
+ size="small"
+ style={{
+ backgroundColor: isDarkTheme ? '#1f1f1f' : '#fff',
+ borderColor: isDarkTheme ? '#303030' : '#d9d9d9'
+ }}
+ >
+
+ Key: {numberKey}
+ Current Value: {numberValue}
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ Object Type Testing
+
+ }
+ size="small"
+ style={{
+ backgroundColor: isDarkTheme ? '#1f1f1f' : '#fff',
+ borderColor: isDarkTheme ? '#303030' : '#d9d9d9'
+ }}
+ >
+
+ Key: {objectKey}
+
+
+ handleObjectUpdate('name', e.target.value)}
+ style={{ width: 120 }}
+ />
+ handleObjectUpdate('count', parseInt(e.target.value) || 0)}
+ style={{ width: 80 }}
+ />
+
+
+
+
+ {formatValue(objectValue)}
+
+
+
+
+
+
+
+
+ 💡 提示: useCache 仅在当前窗口有效 • useSharedCache 跨窗口实时同步 • usePersistCache 类型安全的持久化存储
+
+
+
+
+ )
+}
+
+const TestContainer = styled.div<{ $isDark: boolean }>`
+ color: ${props => props.$isDark ? '#fff' : '#000'};
+`
+
+const ResultDisplay = styled.div<{ $isDark: boolean }>`
+ background: ${props => props.$isDark ? '#0d1117' : '#f6f8fa'};
+ border: 1px solid ${props => props.$isDark ? '#30363d' : '#d0d7de'};
+ border-radius: 6px;
+ padding: 8px;
+ font-size: 11px;
+ max-height: 100px;
+ overflow-y: auto;
+
+ pre {
+ margin: 0;
+ white-space: pre-wrap;
+ word-break: break-all;
+ color: ${props => props.$isDark ? '#e6edf3' : '#1f2328'};
+ font-family: 'SF Mono', Monaco, 'Cascadia Code', 'Roboto Mono', Consolas, 'Courier New', monospace;
+ }
+`
+
+export default CacheBasicTests
\ No newline at end of file
diff --git a/src/renderer/src/windows/dataRefactorTest/components/CacheServiceTests.tsx b/src/renderer/src/windows/dataRefactorTest/components/CacheServiceTests.tsx
new file mode 100644
index 0000000000..d9e00a192a
--- /dev/null
+++ b/src/renderer/src/windows/dataRefactorTest/components/CacheServiceTests.tsx
@@ -0,0 +1,443 @@
+import { cacheService } from '@renderer/data/CacheService'
+import { loggerService } from '@renderer/services/LoggerService'
+import type { PersistCacheKey, PersistCacheSchema } from '@shared/data/cache/cacheSchemas'
+import { usePreference } from '@renderer/data/hooks/usePreference'
+import { ThemeMode } from '@shared/data/preference/preferenceTypes'
+import { Button, Input, message, Select, Space, Typography, Card, Row, Col, Divider } from 'antd'
+import { Database, Clock, Trash2, Eye, Edit, Zap } from 'lucide-react'
+import React, { useState, useEffect } from 'react'
+import styled from 'styled-components'
+
+const { Text, Title } = Typography
+const { Option } = Select
+const { TextArea } = Input
+
+const logger = loggerService.withContext('CacheServiceTests')
+
+/**
+ * Direct CacheService API testing component
+ * Tests memory, shared, and persist cache operations
+ */
+const CacheServiceTests: React.FC = () => {
+ const [currentTheme] = usePreference('ui.theme_mode')
+ const isDarkTheme = currentTheme === ThemeMode.dark
+
+ // State for test operations
+ const [memoryKey, setMemoryKey] = useState('test-memory-1')
+ const [memoryValue, setMemoryValue] = useState('{"type": "memory", "data": "test"}')
+ const [memoryTTL, setMemoryTTL] = useState