feat(i18n): make admin and catalog components translatable

src/app/admin/sounds/sounds-client.tsx

@@ -10,6 +10,7 @@ import {
 	Trash2,
 	Upload,
 } from "lucide-react";
+import { useTranslations } from "next-intl";
 import { useRouter } from "next/navigation";
 import { useMemo, useRef, useState } from "react";
 import { toast } from "sonner";
@@ -82,6 +83,7 @@ export function SoundsClient({
 	canEdit: boolean;
 	baseUrl: string;
 }) {
+	const t = useTranslations("pages.admin.sounds.soundsClient");
 	const router = useRouter();
 	const { run, isPending } = useServerAction();
 
@@ -122,8 +124,8 @@ export function SoundsClient({
 		if (!deleting) return;
 		const id = deleting.id;
 		run(() => deleteSoundtrack({ id }), {
-			successMessage: `Song disk #${id} deleted.`,
-			errorMessage: `Unable to delete song disk #${id}.`,
+			successMessage: t("deleteSuccess", { id }),
+			errorMessage: t("deleteError", { id }),
 			onSuccess: () => {
 				invalidateSongPickerCache();
 				setDeleting(null);
@@ -140,7 +142,7 @@ export function SoundsClient({
 					<Input
 						value={query}
 						onChange={(e) => setQuery(e.target.value)}
-						placeholder="Search by name, author, code or id…"
+						placeholder={t("searchPlaceholder")}
 						className="pl-8"
 					/>
 				</div>
@@ -152,12 +154,14 @@ export function SoundsClient({
 						<SelectValue />
 					</SelectTrigger>
 					<SelectContent>
-						<SelectItem value="all">All ({soundtracks.length})</SelectItem>
+						<SelectItem value="all">
+							{t("filterAll", { count: soundtracks.length })}
+						</SelectItem>
 						<SelectItem value="single">
-							Single MP3s ({counts.single})
+							{t("filterSingle", { count: counts.single })}
 						</SelectItem>
 						<SelectItem value="composition">
-							Composition ({counts.composition})
+							{t("filterComposition", { count: counts.composition })}
 						</SelectItem>
 					</SelectContent>
 				</Select>