fix: Fix i18n

public/locales/en-US/common.json

@@ -43,6 +43,8 @@
     }
   },
   "messages": {
+    "successMessage": "Success!",
+    "deletedObject": "Deleted successfully!",
     "errors": {
       "unknown": "An unknown error occurred.",
       "copyFailed": "Copying to clipboard did not work. Please copy the text manually."
@@ -68,7 +70,10 @@
     "experimentalFeatureExplanation": "This is an experimental feature.",
     "saveLabel": "Save",
     "resetLabel": "Reset",
-    "loading": "Loading..."
+    "loading": "Loading...",
+    "actionNotUndoable": "This action cannot be undone!",
+    "appError": "We are sorry but there was an error. Please try again later.",
+    "emptyValue": "-"
   },
   "noSearchResults": {
     "title": "Nothing found",

public/locales/en-US/components.json

@@ -29,5 +29,13 @@
         "submit": "Add"
       }
     }
+  },
+  "SelectField": {
+    "values": {
+      "true": "Yes",
+      "false": "No"
+    },
+    "valueSelection": "<{{ value }}>",
+    "valueSelectionIsDefault": "Default <{{ value }}>"
   }
 }

src/components/widgets/DeleteAPIButton.tsx

@@ -35,14 +35,14 @@ export default function DeleteAPIButton({
 	description,
 	navigateTo = "/aliases",
 }: DeleteAPIButtonProps): ReactElement {
-	const {t} = useTranslation()
+	const {t} = useTranslation("common")
 	const {showError, showSuccess} = useErrorSuccessSnacks()
 	const navigate = useNavigate()
 
 	const {mutate} = useMutation<void, AxiosError, void>(onDelete, {
 		onError: showError,
 		onSuccess: () => {
-			showSuccess(successMessage || t("general.deletedSuccessfully"))
+			showSuccess(successMessage || t("messages.deletedObject"))
 			navigate(navigateTo)
 		},
 	})

src/components/widgets/ErrorPage.tsx

@@ -5,7 +5,7 @@ import {IoSad} from "react-icons/io5"
 import {Grid, Typography} from "@mui/material"
 
 export default function ErrorPage(): ReactElement {
-	const {t} = useTranslation()
+	const {t} = useTranslation("common")
 
 	return (
 		<Grid

src/components/widgets/LoadingData.tsx

@@ -3,12 +3,8 @@ import {useTranslation} from "react-i18next"
 
 import {CircularProgress, Grid, Typography} from "@mui/material"
 
-export interface LoadingDataProps {
+export default function LoadingData(): ReactElement {
-	message?: string
+	const {t} = useTranslation("common")
-}
-
-export default function LoadingData({message = "Loading"}: LoadingDataProps): ReactElement {
-	const {t} = useTranslation()
 
 	return (
 		<Grid container spacing={2} direction="column" alignItems="center">

src/components/widgets/LoadingPage.tsx

@@ -6,7 +6,7 @@ import {Grid, Typography} from "@mui/material"
 import {ReactComponent as Logo} from "../../../public/logo.svg"
 
 export default function LoadingPage(): ReactElement {
-	const {t} = useTranslation()
+	const {t} = useTranslation("common")
 
 	return (
 		<Grid

src/components/widgets/MutationStatusSnackbar.tsx

@@ -30,7 +30,7 @@ export default function MutationStatusSnackbar<
 	successMessage,
 	errorMessage,
 }: MutationStatusSnackbarProps<TData, TError, TVariables, TContext>): ReactElement {
-	const {t} = useTranslation()
+	const {t} = useTranslation("common")
 
 	const $severity = useRef<AlertProps["severity"]>()
 	const $message = useRef<string>()
@@ -60,12 +60,12 @@ export default function MutationStatusSnackbar<
 					return (
 						errorMessage ||
 						(mutation.error.response?.data as any).detail ||
-						t("general.defaultError")
+						t("messages.errors.unknown")
 					)
 				}
 
 				if (mutation.isSuccess) {
-					return successMessage ?? mutation.data?.detail ?? t("general.defaultSuccess")
+					return successMessage ?? mutation.data?.detail ?? t("messages.successMessage")
 				}
 			})()
 		}

src/components/widgets/SimpleOverlayInformation.tsx

@@ -16,7 +16,7 @@ export default function SimpleOverlayInformation({
 	icon,
 	children,
 }: SimpleOverlayInformationProps): ReactElement {
-	const {t} = useTranslation()
+	const {t} = useTranslation("common")
 	const emptyTextValue = emptyText ?? t("general.emptyValue")
 
 	return (

src/hooks/use-error-success-snacks.ts

@@ -12,7 +12,7 @@ export interface UseErrorSuccessSnacksResult {
 }
 
 export default function useErrorSuccessSnacks(): UseErrorSuccessSnacksResult {
-	const {t} = useTranslation()
+	const {t} = useTranslation("common")
 	const {enqueueSnackbar, closeSnackbar} = useSnackbar()
 	const $errorSnackbarKey = useRef<SnackbarKey | null>(null)
 
@@ -40,7 +40,7 @@ export default function useErrorSuccessSnacks(): UseErrorSuccessSnacksResult {
 			} catch (e) {}
 		}
 
-		$errorSnackbarKey.current = enqueueSnackbar(message || t("general.defaultError"), {
+		$errorSnackbarKey.current = enqueueSnackbar(message || t("messages.errors.unknown"), {
 			variant: "error",
 			autoHideDuration: ERROR_SNACKBAR_SHOW_DURATION,
 		})

src/route-widgets/AliasDetailRoute/SelectField.tsx

@@ -30,10 +30,10 @@ export default function SelectField({
 	valueTextMap: parentValueTextMap,
 }: SelectFieldProps): ReactElement {
 	const user = useUser()
-	const {t} = useTranslation()
+	const {t} = useTranslation("components")
 	const BOOLEAN_SELECT_TEXT_MAP: Record<string, string> = {
-		true: "general.booleanSelection.true",
+		true: "SelectField.values.true",
-		false: "general.booleanSelection.false",
+		false: "SelectField.values.false",
 	}
 	const valueTextMap = parentValueTextMap ?? BOOLEAN_SELECT_TEXT_MAP
 
@@ -76,7 +76,7 @@ export default function SelectField({
 				renderValue={value =>
 					value === "null" ? (
 						<i>
-							{t("general.defaultValueSelectionRaw", {
+							{t("SelectField.valueSelection", {
 								value: defaultValueText,
 							})}
 						</i>
@@ -87,7 +87,7 @@ export default function SelectField({
 			>
 				<MenuItem value="null">
 					<i>
-						{t("general.defaultValueSelection", {
+						{t("SelectField.valueSelectionIsDefault", {
 							value: defaultValueText,
 						})}
 					</i>