File name
Commit message
Commit date
File name
Commit message
Commit date
File name
Commit message
Commit date
File name
Commit message
Commit date
/**
* 코드의 tone(의미 토큰)을 실제 Tailwind 클래스로 바꾼다.
*
* DB에는 'emerald' 같은 이름표만 저장하고 클래스는 여기서 붙인다. DB에 Tailwind 클래스를
* 넣으면 화면 스타일을 손볼 때마다 DB를 고쳐야 하기 때문이다.
*
* 맵을 풀어 쓴 이유는 Tailwind가 `bg-${tone}-50` 같은 조립식 클래스명을 빌드 시점에
* 못 찾아 지워버리기 때문이다. 반드시 문자열 전체가 소스에 보여야 한다.
*/
/** 뱃지: 옅은 배경 + 진한 글씨. 처리결과·담당자 구분이 쓴다. */
const BADGE: Record<string, string> = {
slate: 'bg-slate-100 text-slate-700',
gray: 'bg-gray-100 text-gray-700',
blue: 'bg-blue-50 text-blue-700',
sky: 'bg-sky-50 text-sky-700',
indigo: 'bg-indigo-50 text-indigo-700',
violet: 'bg-violet-50 text-violet-700',
emerald: 'bg-emerald-50 text-emerald-700',
amber: 'bg-amber-50 text-amber-700',
orange: 'bg-orange-50 text-orange-700',
red: 'bg-red-50 text-red-700',
}
/** 색 띠: 칸반 컬럼 상단에 그리는 한 줄. 업무구간이 쓴다. */
const BAR: Record<string, string> = {
slate: 'bg-slate-400',
gray: 'bg-gray-400',
blue: 'bg-blue-400',
sky: 'bg-sky-400',
indigo: 'bg-indigo-400',
violet: 'bg-violet-400',
emerald: 'bg-emerald-400',
amber: 'bg-amber-400',
orange: 'bg-orange-400',
red: 'bg-red-400',
}
const BADGE_FALLBACK = 'bg-gray-100 text-gray-700'
const BAR_FALLBACK = 'bg-gray-300'
/**
* 모르는 tone이 와도 화면이 깨지지 않게 회색으로 떨어뜨린다 - 코드 관리 화면에서
* 오타가 들어가도 색만 밋밋해질 뿐 항목이 사라지지는 않아야 한다.
*/
export function badgeClass(tone: string | null | undefined): string {
return (tone && BADGE[tone]) || BADGE_FALLBACK
}
export function barClass(tone: string | null | undefined): string {
return (tone && BAR[tone]) || BAR_FALLBACK
}