72 lines
2.8 KiB
TypeScript
72 lines
2.8 KiB
TypeScript
import type { ObjectMeta, Sentence } from '../types'
|
|
|
|
interface Props {
|
|
obj: ObjectMeta | null
|
|
objects: ObjectMeta[]
|
|
sentences: Sentence[]
|
|
}
|
|
|
|
function DetailRow({ label, value }: { label: string; value?: string }) {
|
|
return (
|
|
<div className="sidebar-row">
|
|
<label>{label}</label>
|
|
<div className="detail-value">{value || ''}</div>
|
|
</div>
|
|
)
|
|
}
|
|
|
|
export default function DetailsPanel({ obj, objects, sentences }: Props) {
|
|
const latestSentence = sentences.length > 0 ? sentences[sentences.length - 1] : null
|
|
|
|
const parentDisplay = obj?.parent_id
|
|
? (() => {
|
|
const parent = objects.find(o => o.id === obj.parent_id)
|
|
return parent ? `${parent.index} - ${parent.title_de || 'ohne Titel'}` : ''
|
|
})()
|
|
: ''
|
|
|
|
return (
|
|
<>
|
|
<div className="sidebar-section">
|
|
<h2>Details</h2>
|
|
<DetailRow label="Titel" value={obj?.title_de} />
|
|
<DetailRow label="Position" value={obj?.position_de} />
|
|
<DetailRow label="Status (sitzt/schwimmt/segelt)" value={obj?.action_de} />
|
|
<DetailRow label="Zustand (alt/jung/rostig)" value={obj?.condition_de} />
|
|
<DetailRow label="Hierarchie" value={obj?.hierarchy != null ? String(obj.hierarchy) : ''} />
|
|
<div className="sidebar-row">
|
|
<label>Gehört zu (Parent-Index)</label>
|
|
<div className="detail-value">{parentDisplay}</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div className="sidebar-section">
|
|
<h2>KI-Details</h2>
|
|
<DetailRow label="Label (EN)" value={obj?.label_en} />
|
|
<DetailRow label="Label (DE)" value={obj?.label_de} />
|
|
<DetailRow label="Label (SE)" value={obj?.label_se} />
|
|
<DetailRow label="Farbe (EN)" value={obj?.color_en} />
|
|
<DetailRow label="Adjektiv (EN)" value={obj?.adjective_en} />
|
|
<DetailRow label="Action Verb (EN)" value={obj?.action_verb_en} />
|
|
<DetailRow label="Präposition (EN)" value={obj?.preposition_en} />
|
|
<DetailRow label="Relative Position (EN)" value={obj?.relative_position_en} />
|
|
<DetailRow label="Season (EN)" value={obj?.season_en} />
|
|
</div>
|
|
|
|
<div className="sidebar-section">
|
|
<h2>KI-Sentence</h2>
|
|
<h3 style={{ fontSize: '0.9rem', marginTop: 0, marginBottom: 8, color: '#475569' }}>
|
|
Einfach (für Kinder)
|
|
</h3>
|
|
<DetailRow label="Question (EN)" value={latestSentence?.question_simple_en} />
|
|
<DetailRow label="Answer (EN)" value={latestSentence?.answer_simple_en} />
|
|
<h3 style={{ fontSize: '0.9rem', marginTop: 12, marginBottom: 8, color: '#475569' }}>
|
|
Fortgeschritten
|
|
</h3>
|
|
<DetailRow label="Question (EN)" value={latestSentence?.question_advanced_en} />
|
|
<DetailRow label="Answer (EN)" value={latestSentence?.answer_advanced_en} />
|
|
</div>
|
|
</>
|
|
)
|
|
}
|