mirror of
https://github.com/NanmiCoder/cc-haha
synced 2026-07-16 13:03:31 +08:00
Add a lightweight custom i18n system supporting English (default) and Chinese, with a language switcher in Settings > General. All 35+ UI components internationalized with ~270 translation keys, including 189 Chinese spinner verbs and server error code mapping.
54 lines
2.1 KiB
TypeScript
54 lines
2.1 KiB
TypeScript
import type { CronTask } from '../../types/task'
|
|
import { useTaskStore } from '../../stores/taskStore'
|
|
import { useTranslation } from '../../i18n'
|
|
|
|
type Props = {
|
|
task: CronTask
|
|
}
|
|
|
|
export function TaskRow({ task }: Props) {
|
|
const { deleteTask, updateTask } = useTaskStore()
|
|
const t = useTranslation()
|
|
|
|
const toggleEnabled = () => {
|
|
updateTask(task.id, { enabled: !task.enabled })
|
|
}
|
|
|
|
return (
|
|
<div className="flex items-center justify-between px-4 py-3 border-b border-[var(--color-border-separator)] hover:bg-[var(--color-surface-hover)] transition-colors group">
|
|
<div className="flex items-center gap-3 min-w-0 flex-1">
|
|
{/* Status indicator */}
|
|
<span className={`w-2 h-2 rounded-full flex-shrink-0 ${task.enabled ? 'bg-[var(--color-success)]' : 'bg-[var(--color-text-tertiary)]'}`} />
|
|
|
|
<div className="min-w-0">
|
|
<div className="text-sm font-medium text-[var(--color-text-primary)] truncate">{task.name}</div>
|
|
{task.description && (
|
|
<div className="text-xs text-[var(--color-text-secondary)] truncate">{task.description}</div>
|
|
)}
|
|
</div>
|
|
</div>
|
|
|
|
<div className="flex items-center gap-4 flex-shrink-0">
|
|
{/* Cron expression */}
|
|
<span className="text-xs text-[var(--color-text-tertiary)] font-[var(--font-mono)]">{task.cron}</span>
|
|
|
|
{/* Actions */}
|
|
<div className="flex items-center gap-1 opacity-0 group-hover:opacity-100 transition-opacity">
|
|
<button
|
|
onClick={toggleEnabled}
|
|
className="px-2 py-1 text-xs rounded-[var(--radius-sm)] text-[var(--color-text-secondary)] hover:bg-[var(--color-surface-selected)] transition-colors"
|
|
>
|
|
{task.enabled ? t('common.disable') : t('common.enable')}
|
|
</button>
|
|
<button
|
|
onClick={() => deleteTask(task.id)}
|
|
className="px-2 py-1 text-xs rounded-[var(--radius-sm)] text-[var(--color-error)] hover:bg-red-50 transition-colors"
|
|
>
|
|
{t('common.delete')}
|
|
</button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
)
|
|
}
|