enabled i18n for all components

app/ui/LocationDeleteForm.tsx

@@ -1,11 +1,12 @@
 "use client";
 
-import { FC } from "react";
+import { FC, ReactNode } from "react";
 import { BillingLocation } from "../lib/db-types";
 import { deleteLocationById } from "../lib/actions/locationActions";
 import { useFormState } from "react-dom";
 import { gotoUrl } from "../lib/actions/navigationActions";
 import Link from "next/link";
+import { useTranslations } from "next-intl";
 
 export interface LocationDeleteFormProps {
     /** location which should be deleted */
@@ -16,6 +17,8 @@ export const LocationDeleteForm:FC<LocationDeleteFormProps> = ({ location }) =>
 {
     const handleAction = deleteLocationById.bind(null, location._id, location.yearMonth);
     const [ state, dispatch ] = useFormState(handleAction, null);
+    const t = useTranslations("location-delete-form");
+
 
     const handleCancel = () => {
         gotoUrl(`/location/${location._id}/edit/`);
@@ -26,11 +29,16 @@ export const LocationDeleteForm:FC<LocationDeleteFormProps> = ({ location }) =>
             <div className="card-body">
                 <form action={dispatch}>
                     <p className="py-6 px-6">
-                        Please confirm deletion of location “<strong>{location.name}</strong>”.
+                    {
+                        t.rich("text", {
+                            name:location.name,
+                            strong: (chunks:ReactNode) => `<strong>${chunks}</strong>`,
+                        })
+                    }
                     </p>
                     <div className="pt-4 text-center">
-                        <button className="btn btn-primary w-[5.5em]">Confim</button>
-                        <Link className="btn btn-neutral w-[5.5em] ml-3" href={`/location/${location._id}/edit/`}>Cancel</Link>
+                        <button className="btn btn-primary w-[5.5em]">{t("confirm-button")}</button>
+                        <Link className="btn btn-neutral w-[5.5em] ml-3" href={`/location/${location._id}/edit/`}>{t("cancel-button")}</Link>
                     </div>
                 </form>
             </div>