Files
biggus-dickus/web/src/components/label-editor.tsx
T

45 lines
1.5 KiB
TypeScript

import { useId } from "react";
import { useTranslation } from "react-i18next";
import type { components } from "../api/schema";
import { useConfig } from "../config/config-context";
import { Input } from "@/components/ui/input";
import { Label } from "@/components/ui/label";
type LabelInput = components["schemas"]["LabelInput"];
/** Single-language label editor. Authors one label at the instance default language.
* Editing only touches the default-language entry — labels in other languages on the
* same record are preserved (not collapsed), so editing a term/authority that already
* has e.g. an English label keeps it. */
export function LabelEditor({
value,
onChange,
}: {
value: LabelInput[];
onChange: (labels: LabelInput[]) => void;
}) {
const { t } = useTranslation();
const inputId = useId();
const { default_language } = useConfig();
const current = value.find((l) => l.lang === default_language)?.label ?? "";
const hasOtherLanguages = value.some((l) => l.lang !== default_language);
const set = (label: string) =>
onChange([
...value.filter((l) => l.lang !== default_language),
...(label.trim() ? [{ lang: default_language, label }] : []),
]);
return (
<div className="space-y-1">
<Label htmlFor={inputId}>{t("labels.label")}</Label>
<Input id={inputId} value={current} onChange={(e) => set(e.target.value)} />
{hasOtherLanguages && (
<p className="text-xs text-muted-foreground">{t("labels.otherLanguages")}</p>
)}
</div>
);
}