refactor(StorageCleaner): 规范化页面组件目录结构
- 将子组件移至 components/ 子目录(OptionItem、AutoRefreshToggle、CleaningResult、StorageCleanerConfirm、StorageOptionsGrid、ErrorDisplay) - 创建 __tests__/ 目录结构 - 更新所有相关导入路径 Co-authored-by: Cursor <cursoragent@cursor.com>
This commit is contained in:
@@ -0,0 +1,66 @@
|
||||
/**
|
||||
* 自动刷新开关行
|
||||
*
|
||||
* 用于 StorageCleaner 页面的操作区域内(非独立卡片),
|
||||
* 控制清理后是否自动刷新页面。左侧为标签文本,右侧为 shadcn/ui Switch 开关。
|
||||
*
|
||||
* @example
|
||||
* ```tsx
|
||||
* <AutoRefreshToggle
|
||||
* reloadAfterClean={reloadAfterClean}
|
||||
* onChange={(checked) => setReloadAfterClean(checked)}
|
||||
* />
|
||||
* ```
|
||||
*/
|
||||
|
||||
import React from 'react';
|
||||
import { useI18n } from '@/utils/chromeI18n';
|
||||
import { cn } from '@/lib/utils';
|
||||
import { Switch } from '@/components/ui/switch';
|
||||
import { Label } from '@/components/ui/label';
|
||||
|
||||
export interface AutoRefreshToggleProps extends Omit<
|
||||
React.HTMLAttributes<HTMLDivElement>,
|
||||
'onChange'
|
||||
> {
|
||||
/** 开关的当前状态(受控) */
|
||||
reloadAfterClean: boolean;
|
||||
/** 状态变化时的回调函数 */
|
||||
onChange: (checked: boolean) => void;
|
||||
}
|
||||
|
||||
/**
|
||||
* 自动刷新开关
|
||||
*
|
||||
* @param reloadAfterClean - 当前开关状态
|
||||
* @param onChange - 状态变化回调,接收新的布尔值
|
||||
* @param className - 额外的 CSS 类名,用于覆盖或扩展样式
|
||||
* @param props - 透传给外层 div 的其他 HTML 属性
|
||||
*/
|
||||
export default function AutoRefreshToggle({
|
||||
reloadAfterClean,
|
||||
onChange,
|
||||
className,
|
||||
...props
|
||||
}: AutoRefreshToggleProps) {
|
||||
const { t } = useI18n('storageCleaner');
|
||||
|
||||
return (
|
||||
<div
|
||||
className={cn(
|
||||
'w-full px-3.5 py-3 border-t border-border flex justify-between items-center',
|
||||
className,
|
||||
)}
|
||||
{...props}
|
||||
>
|
||||
<Label
|
||||
htmlFor="auto-refresh-switch"
|
||||
className="text-xs font-bold text-muted-foreground/90 cursor-pointer select-none tracking-wide uppercase"
|
||||
>
|
||||
{t('storageCleaner:autoRefresh')}
|
||||
</Label>
|
||||
|
||||
<Switch id="auto-refresh-switch" checked={reloadAfterClean} onCheckedChange={onChange} />
|
||||
</div>
|
||||
);
|
||||
}
|
||||
Reference in New Issue
Block a user