49 lines
2.1 KiB
TypeScript
49 lines
2.1 KiB
TypeScript
'use client'
|
|
|
|
import { RiCheckLine, RiCloseLine } from '@remixicon/react'
|
|
import type { AttemptResult, Translate } from './types'
|
|
|
|
type AttemptHistoryItemProps = {
|
|
attempt: AttemptResult
|
|
t: Translate
|
|
}
|
|
|
|
export default function AttemptHistoryItem({ attempt, t }: AttemptHistoryItemProps) {
|
|
return (
|
|
<div className={`rounded-lg border p-4 ${attempt.success ? 'border-util-colors-green-green-500 bg-util-colors-green-green-50' : 'border-util-colors-orange-orange-500 bg-util-colors-orange-orange-50'}`}>
|
|
<div className='flex items-start gap-3'>
|
|
{attempt.success ? (
|
|
<RiCheckLine className='h-5 w-5 shrink-0 text-util-colors-green-green-600' />
|
|
) : (
|
|
<RiCloseLine className='h-5 w-5 shrink-0 text-util-colors-orange-orange-600' />
|
|
)}
|
|
<div className='flex-1'>
|
|
<div className='flex items-center justify-between'>
|
|
<div className={`mb-1 font-medium ${attempt.success ? 'text-util-colors-green-green-700' : 'text-util-colors-orange-orange-700'}`}>
|
|
{attempt.success ? t('challenges.player.status.success') : t('challenges.player.status.failed')}
|
|
</div>
|
|
<div className='text-xs text-text-tertiary'>
|
|
{new Date(attempt.timestamp).toLocaleTimeString()}
|
|
</div>
|
|
</div>
|
|
{attempt.thinking && (
|
|
<div className='bg-components-panel-bg/60 mt-3 space-y-2 rounded-md border border-divider-subtle p-3'>
|
|
<div className='text-xs font-medium uppercase tracking-wide text-text-tertiary'>
|
|
{t('challenges.player.modelThinking', 'Thinking')}
|
|
</div>
|
|
<div className='whitespace-pre-wrap text-sm text-text-secondary'>{attempt.thinking}</div>
|
|
</div>
|
|
)}
|
|
{attempt.message && (
|
|
<div className='mt-3 whitespace-pre-wrap text-sm text-text-secondary'>{attempt.message}</div>
|
|
)}
|
|
{attempt.rating !== undefined && (
|
|
<div className='mt-2 text-sm text-text-tertiary'>
|
|
{t('challenges.leaderboard.rating')}: {attempt.rating}/10
|
|
</div>
|
|
)}
|
|
</div>
|
|
</div>
|
|
</div>
|
|
)
|
|
}
|