41 lines
956 B
TypeScript
41 lines
956 B
TypeScript
interface MilestoneData {
|
|
skillCode: string
|
|
reachedAt: string
|
|
}
|
|
|
|
const skillLabels: Record<string, string> = {
|
|
"vocal-a": "Letra A",
|
|
"vocal-e": "Letra E",
|
|
"vocal-i": "Letra I",
|
|
"vocal-o": "Letra O",
|
|
"vocal-u": "Letra U",
|
|
"numero-1": "Número 1",
|
|
"numero-2": "Número 2",
|
|
"numero-3": "Número 3",
|
|
"numero-4": "Número 4",
|
|
"numero-5": "Número 5",
|
|
}
|
|
|
|
export function MilestonesList({ data }: { data: MilestoneData[] }) {
|
|
if (!data || data.length === 0) {
|
|
return (
|
|
<div className="text-center text-muted-foreground italic py-4">
|
|
Todavía no hay logros
|
|
</div>
|
|
)
|
|
}
|
|
|
|
return (
|
|
<div className="flex flex-wrap gap-2">
|
|
{data.map((m) => (
|
|
<div
|
|
key={m.skillCode}
|
|
className="bg-primary/10 border border-primary/20 rounded-xl px-3 py-2 text-sm font-display font-medium"
|
|
>
|
|
{skillLabels[m.skillCode] || m.skillCode}
|
|
</div>
|
|
))}
|
|
</div>
|
|
)
|
|
}
|