Develop (#26)

统一简化多个页面里的CopyButton调用，删除不再需要的空回调参数

* feat: 添加clearCookies函数的单元测试并修复cookie域名处理逻辑

* feat: 增强 data URI 处理，支持带参数的前缀并更新相关测试

* fix: 修正 AGENTS.md 中 TypeScript 类型检查命令的描述

* feat: 添加 settings.local.json 文件以配置 Bash 权限

* perf: 预设背景色避免 Popup 弹窗白屏闪烁

* perf: 避免图标过早实例化，传递组件引用而非 JSX 节点

* feat: 添加 useLazyTranslation 和 preloadNamespaces 函数以支持动态加载 i18n 命名空间

* feat: 使用 useLazyTranslation 替换 useTranslation 以支持懒加载翻译

* feat: 添加 PageSkeleton 组件及其测试用例以支持页面加载骨架屏

* feat: 使用骨架屏替换加载状态指示器，优化用户体验

* feat: 优化 CopyButton 组件的复制功能，添加定时器管理复制状态

* feat: 调整 chunk 大小警告阈值以优化构建性能

config/features.tsx

@@ -1,4 +1,5 @@
-import { type ComponentType, lazy, ReactNode } from 'react';
+import { type ComponentType, lazy } from 'react';
+import type { SvgIconProps } from '@mui/material/SvgIcon';
 import type { PageType } from '@/types/storage';
 import AccessTimeIcon from '@mui/icons-material/AccessTime';
 import StorageIcon from '@mui/icons-material/Storage';
@@ -38,8 +39,8 @@ export interface FeatureConfig {
   descriptionKey: string;
   /** 主题颜色键（用于仪表盘卡片，映射到 theme.palette[key].main） */
   themeColorKey?: PaletteColorKey;
-  /** 图标组件（用于仪表盘卡片） */
-  icon?: ReactNode;
+  /** 图标组件引用（用于仪表盘卡片，按需实例化） */
+  icon?: ComponentType<SvgIconProps>;
   /** 默认是否在仪表盘显示 */
   defaultVisible: boolean;
   /** 不同显示模式对应的组件 */
@@ -70,7 +71,7 @@ export const FEATURES: FeatureConfig[] = [
     labelKey: 'features:timestamp.title',
     descriptionKey: 'features:timestamp.description',
     themeColorKey: 'primary',
-    icon: <AccessTimeIcon sx={{ fontSize: 20 }} />,
+    icon: AccessTimeIcon,
     defaultVisible: true,
     components: {
       popup: TimestampPage,
@@ -83,7 +84,7 @@ export const FEATURES: FeatureConfig[] = [
     labelKey: 'features:storageCleaner.title',
     descriptionKey: 'features:storageCleaner.description',
     themeColorKey: 'warning',
-    icon: <StorageIcon sx={{ fontSize: 20 }} />,
+    icon: StorageIcon,
     defaultVisible: true,
     components: {
       popup: StorageCleanerPage,
@@ -96,7 +97,7 @@ export const FEATURES: FeatureConfig[] = [
     labelKey: 'features:qrCode.title',
     descriptionKey: 'features:qrCode.description',
     themeColorKey: 'success',
-    icon: <QrCodeIcon sx={{ fontSize: 20 }} />,
+    icon: QrCodeIcon,
     defaultVisible: true,
     components: {
       popup: QrCodePage,
@@ -109,7 +110,7 @@ export const FEATURES: FeatureConfig[] = [
     labelKey: 'features:textStatistics.title',
     descriptionKey: 'features:textStatistics.description',
     themeColorKey: 'secondary',
-    icon: <DescriptionIcon sx={{ fontSize: 20 }} />,
+    icon: DescriptionIcon,
     defaultVisible: true,
     components: {
       popup: TextStatisticsPage,
@@ -122,7 +123,7 @@ export const FEATURES: FeatureConfig[] = [
     labelKey: 'features:jwt.title',
     descriptionKey: 'features:jwt.description',
     themeColorKey: 'info',
-    icon: <VpnKeyIcon sx={{ fontSize: 20 }} />,
+    icon: VpnKeyIcon,
     defaultVisible: true,
     components: {
       popup: JwtPage,
@@ -135,7 +136,7 @@ export const FEATURES: FeatureConfig[] = [
     labelKey: 'features:jsonDiff.title',
     descriptionKey: 'features:jsonDiff.description',
     themeColorKey: 'primary',
-    icon: <CompareArrowsIcon sx={{ fontSize: 20 }} />,
+    icon: CompareArrowsIcon,
     defaultVisible: true,
     components: {
       popup: JsonToolsPage,
@@ -148,7 +149,7 @@ export const FEATURES: FeatureConfig[] = [
     labelKey: 'features:base64Converter.title',
     descriptionKey: 'features:base64Converter.description',
     themeColorKey: 'info',
-    icon: <TransformIcon sx={{ fontSize: 20 }} />,
+    icon: TransformIcon,
     defaultVisible: true,
     components: {
       popup: Base64ConverterPage,
@@ -161,7 +162,7 @@ export const FEATURES: FeatureConfig[] = [
     labelKey: 'features:markdownToHtml.title',
     descriptionKey: 'features:markdownToHtml.description',
     themeColorKey: 'secondary',
-    icon: <CodeIcon sx={{ fontSize: 20 }} />,
+    icon: CodeIcon,
     defaultVisible: true,
     components: {
       popup: MarkdownToHtmlPage,
@@ -174,7 +175,7 @@ export const FEATURES: FeatureConfig[] = [
     labelKey: 'features:htmlToMarkdown.title',
     descriptionKey: 'features:htmlToMarkdown.description',
     themeColorKey: 'secondary',
-    icon: <ArticleIcon sx={{ fontSize: 20 }} />,
+    icon: ArticleIcon,
     defaultVisible: true,
     components: {
       popup: HtmlToMarkdownPage,