37 lines
1.2 KiB
TypeScript
37 lines
1.2 KiB
TypeScript
|
'use client';
|
||
|
|
|
||
|
|
import { useTranslations } from 'next-intl';
|
||
|
|
import { Badge } from '@/components/ui/shared/Badge';
|
||
|
|
import { formatToothList, prosthesisTypeBadgeStyleFromCatalog } from '@/components/treatment/prosthesisTypeDisplay';
|
||
|
|
import type { ProsthesisTaskGroup } from '@/components/lab/taskListGrouping';
|
||
|
|
import type { ProsthesisCatalogEntry } from '@/types/treatment-catalog';
|
||
|
|
|
||
|
|
interface TaskProsthesisGroupHeaderProps {
|
||
|
|
group: ProsthesisTaskGroup;
|
||
|
|
prosthesisCatalog: readonly ProsthesisCatalogEntry[];
|
||
|
|
}
|
||
|
|
|
||
|
|
export function TaskProsthesisGroupHeader({
|
||
|
|
group,
|
||
|
|
prosthesisCatalog,
|
||
|
|
}: TaskProsthesisGroupHeaderProps) {
|
||
|
|
const t = useTranslations('tasks');
|
||
|
|
|
||
|
|
return (
|
||
|
|
<div className="flex flex-wrap items-center gap-2 px-3 py-1.5 bg-background-secondary/30 border-b border-border/40">
|
||
|
|
<Badge
|
||
|
|
fixedWidth={false}
|
||
|
|
truncate
|
||
|
|
title={group.prosthesisTypeLabel}
|
||
|
|
style={prosthesisTypeBadgeStyleFromCatalog(group.prosthesisTypeCode, prosthesisCatalog)}
|
||
|
|
className="max-w-[10rem]"
|
||
|
|
>
|
||
|
|
{group.prosthesisTypeLabel}
|
||
|
|
</Badge>
|
||
|
|
<span className="text-xs text-text-secondary">
|
||
|
|
{t('teethLabel', { teeth: formatToothList(group.teeth) })}
|
||
|
|
</span>
|
||
|
|
</div>
|
||
|
|
);
|
||
|
|
}
|