diff --git a/imports/plugins/core/ui/client/components/translation/translation.js b/imports/plugins/core/ui/client/components/translation/translation.js
index d05050f3d6d..507db1f0185 100644
--- a/imports/plugins/core/ui/client/components/translation/translation.js
+++ b/imports/plugins/core/ui/client/components/translation/translation.js
@@ -8,6 +8,22 @@ const Translation = ({ i18nKey, defaultValue, ...rest }) => {
const key = i18nKey || camelCase(defaultValue);
const translation = i18next.t(key, { defaultValue });
+ // i18next returns 'undefined' if the default value happens to be the key for a set of definitions
+ // ```
+ // "components": {
+ // "componentDef": "Translated Component Def"
+ // }
+ // ```
+ // In this case, a request for i18next.t("components", "defaultValue") will return undefined
+ // but i18next.t("components.componentDef", "defaultValue") will return correctly
+ //
+ // This checks to see if translation is undefined and returns the default value instead
+ if (typeof translation === "undefined") {
+ return (
+ {defaultValue}
+ );
+ }
+
return (
{translation}
);