feat: implement skill management system with database schema, server actions, and dynamic tech stack section

This commit is contained in:
Yolando
2026-04-03 17:54:02 +07:00
parent 43858ce798
commit 9f3510df8f
9 changed files with 102 additions and 36 deletions

View File

@@ -29,7 +29,7 @@ export default async function AdminSkillsPage() {
}
const skills = await prisma.skill.findMany({
orderBy: [{ category: "asc" }, { name: "asc" }],
orderBy: [{ category: "asc" }, { sortOrder: "asc" }, { name: "asc" }],
});
return (
@@ -84,13 +84,18 @@ export default async function AdminSkillsPage() {
<SkillIcon iconName={skill.iconName} name={skill.name} />
<div>
<p className="font-semibold text-sm">{skill.name}</p>
<span
className={`text-[10px] font-mono font-bold px-2 py-0.5 rounded-full ${
CATEGORY_COLORS[skill.category] ?? "text-muted-foreground bg-muted"
}`}
>
{CATEGORY_LABELS[skill.category] ?? skill.category}
</span>
<div className="flex items-center gap-1.5">
<span
className={`text-[10px] font-mono font-bold px-2 py-0.5 rounded-full ${
CATEGORY_COLORS[skill.category] ?? "text-muted-foreground bg-muted"
}`}
>
{CATEGORY_LABELS[skill.category] ?? skill.category}
</span>
<span className="text-[10px] font-mono text-muted-foreground bg-muted px-1.5 py-0.5 rounded-full">
#{skill.sortOrder}
</span>
</div>
</div>
</div>
<div className="flex items-center gap-1 opacity-0 group-hover:opacity-100 transition-opacity">