Automatisch-übersetzen-Button nur bei konfiguriertem DEEPL_API_KEY

Statt den Button immer anzuzeigen und erst nach Klick auf die
fehlende Konfiguration hinzuweisen, wird er serverseitig anhand von
process.env.DEEPL_API_KEY ein-/ausgeblendet (Gerichte, Allergene,
Zusatzstoffe). Die dadurch überflüssige "translateUnavailable"-
Meldung wurde aus allen drei Sprachen entfernt.
This commit is contained in:
2026-07-18 08:14:49 +02:00
parent 868a5d2fcf
commit 51fdb93e97
5 changed files with 55 additions and 68 deletions
+27 -30
View File
@@ -29,7 +29,11 @@ const EMPTY_FORM: DishForm = {
additives: [],
};
export default function DishManager() {
export default function DishManager({
translateEnabled,
}: {
translateEnabled: boolean;
}) {
const supabase = useMemo(() => createClient(), []);
const dict = useDict();
const locale = useLocale();
@@ -42,9 +46,9 @@ export default function DishManager() {
const [selected, setSelected] = useState<Set<string>>(new Set());
const [bulkBusy, setBulkBusy] = useState(false);
const [search, setSearch] = useState("");
const [translateState, setTranslateState] = useState<
"idle" | "busy" | "done" | "unavailable"
>("idle");
const [translateState, setTranslateState] = useState<"idle" | "busy" | "done">(
"idle"
);
// Live-Suche: filtert die Liste bereits während des Tippens
const visible = useMemo(() => {
@@ -199,10 +203,6 @@ export default function DishManager() {
});
const data = await res.json();
if (!res.ok) throw new Error(data?.error ?? `Fehler (${res.status})`);
if (data.configured === false) {
setTranslateState("unavailable");
return;
}
setForm((prev) =>
prev ? { ...prev, nameEn: data.en ?? prev.nameEn, namePl: data.pl ?? prev.namePl } : prev
);
@@ -296,28 +296,25 @@ export default function DishManager() {
/>
</div>
</div>
<div>
<button
type="button"
className="btn btn-neutral"
onClick={autoTranslate}
disabled={translateState === "busy" || !form.name.trim()}
>
{translateState === "busy"
? dict.dishManager.translating
: dict.dishManager.autoTranslate}
</button>
{translateState === "done" && (
<span className="ml-2 text-sm text-green-700">
{dict.dishManager.translated}
</span>
)}
{translateState === "unavailable" && (
<span className="ml-2 text-sm text-gray-500">
{dict.dishManager.translateUnavailable}
</span>
)}
</div>
{translateEnabled && (
<div>
<button
type="button"
className="btn btn-neutral"
onClick={autoTranslate}
disabled={translateState === "busy" || !form.name.trim()}
>
{translateState === "busy"
? dict.dishManager.translating
: dict.dishManager.autoTranslate}
</button>
{translateState === "done" && (
<span className="ml-2 text-sm text-green-700">
{dict.dishManager.translated}
</span>
)}
</div>
)}
<ChipPicker
label={dict.codeList.allergensTitle}