fix: render enum labels as proper title case

formatEnumLabel was leaving inputs uppercase ("TECHNOLOGY_INNOVATION"
became "TECHNOLOGY INNOVATION"); lowercasing first yields proper
title case ("Technology Innovation") and improves labels app-wide.
Apply it on the project mentor page for Ocean Issue + Category.
This commit is contained in:
Matt
2026-04-28 16:28:30 +02:00
parent 26ff8ed111
commit e37f3a5874
2 changed files with 8 additions and 3 deletions

View File

@@ -37,7 +37,7 @@ import {
Sparkles, Sparkles,
Users, Users,
} from 'lucide-react' } from 'lucide-react'
import { getInitials } from '@/lib/utils' import { getInitials, formatEnumLabel } from '@/lib/utils'
interface PageProps { interface PageProps {
params: Promise<{ id: string }> params: Promise<{ id: string }>
@@ -164,11 +164,15 @@ function MentorAssignmentContent({ projectId }: { projectId: string }) {
<div className="grid grid-cols-2 gap-x-6 gap-y-3 text-sm md:grid-cols-3"> <div className="grid grid-cols-2 gap-x-6 gap-y-3 text-sm md:grid-cols-3">
<div> <div>
<div className="text-muted-foreground text-xs uppercase tracking-wide">Ocean Issue</div> <div className="text-muted-foreground text-xs uppercase tracking-wide">Ocean Issue</div>
<div className="font-medium">{project.oceanIssue ?? '—'}</div> <div className="font-medium">
{project.oceanIssue ? formatEnumLabel(project.oceanIssue) : '—'}
</div>
</div> </div>
<div> <div>
<div className="text-muted-foreground text-xs uppercase tracking-wide">Category</div> <div className="text-muted-foreground text-xs uppercase tracking-wide">Category</div>
<div className="font-medium">{project.competitionCategory ?? '—'}</div> <div className="font-medium">
{project.competitionCategory ? formatEnumLabel(project.competitionCategory) : '—'}
</div>
</div> </div>
<div> <div>
<div className="text-muted-foreground text-xs uppercase tracking-wide">Country</div> <div className="text-muted-foreground text-xs uppercase tracking-wide">Country</div>

View File

@@ -50,6 +50,7 @@ export function formatFileSize(bytes: number): string {
export function formatEnumLabel(value: string): string { export function formatEnumLabel(value: string): string {
return value return value
.toLowerCase()
.replace(/_/g, ' ') .replace(/_/g, ' ')
.replace(/\b\w/g, (c) => c.toUpperCase()) .replace(/\b\w/g, (c) => c.toUpperCase())
} }