雨霖铃
de7da9f1db
- 在 tailwind.config.js 中启用 darkMode: 'class' 并扩展语义化颜色变量 - 将全项目硬编码颜色（bg-white、text-gray-*、border-gray-* 等）替换为语义化类名 - 修复 popup/index.html 硬编码浅色背景色 - 同步更新相关单元测试中的类名断言
41 lines
1.3 KiB
TypeScript
41 lines
1.3 KiB
TypeScript
import { CheckCircle, XCircle } from 'lucide-react';
|
|
import type { CleaningResult } from '@/types/storage';
|
|
import { formatCleaningResult } from '@/utils/storageCleaner';
|
|
import { useLazyTranslation } from '@/utils/useLazyTranslation';
|
|
|
|
interface CleaningResultProps {
|
|
result: CleaningResult | null;
|
|
}
|
|
|
|
export default function CleaningResult({ result }: CleaningResultProps) {
|
|
const { t } = useLazyTranslation('storageCleaner');
|
|
if (!result) return null;
|
|
|
|
const isSuccess = result.success;
|
|
|
|
return (
|
|
<div className="mt-3 animate-in fade-in duration-300">
|
|
<div
|
|
className={`flex items-start gap-3 rounded-lg py-3 px-4 shadow-sm ${
|
|
isSuccess ? 'bg-green-50 border border-green-200' : 'bg-red-50 border border-red-200'
|
|
}`}
|
|
>
|
|
{isSuccess ? (
|
|
<CheckCircle className="h-5 w-5 text-green-500 flex-shrink-0 mt-0.5" />
|
|
) : (
|
|
<XCircle className="h-5 w-5 text-red-500 flex-shrink-0 mt-0.5" />
|
|
)}
|
|
<span
|
|
className={`text-sm font-semibold leading-relaxed ${
|
|
isSuccess ? 'text-green-600' : 'text-red-700'
|
|
}`}
|
|
>
|
|
{isSuccess
|
|
? formatCleaningResult(result, t)
|
|
: result.error || t('storageCleaner:partialFailure')}
|
|
</span>
|
|
</div>
|
|
</div>
|
|
);
|
|
}
|