Translating embed HubSpot form emailSuggestion


#1

Hey there, Here's the recap of my adventure on embed HubSpot form

Problem: Missing translation on emailSuggestion field.

what happens when I try to translate this?

   translations: {
                et: {
                    required: "Palun täida see väli",
                    invalidEmail: "Palun kontrolli sisestatud emaili",
                    invalidEmailFormat: "Palun kontrolli sisestatud emaili",
                    phoneInvalidCharacters: "Võib sisaldada ainult numbreid, +()-. ja x-i",
                    emailSuggestion: "Kas sa mõtlesid {{ email }}?"
                }
            }      

All I get is: Kas sa mõtlesid ? and missing the email in the end

Why is this happening? Well I did some digging and found out the reason:

here's the i18nTranslate function:

(function() {
    var e, t, n, r;
    n = window.React;
    e = window.I18n;
    t = {
        i18nTranslate: function(t, n, r) {
            var i, o;
            if (this.props.translations) {
                i = t.replace("formsNext.", "").split(".");
                o = i.reduce(function(e, t) {
                    return null != e ? e[t] : void 0
                }, this.props.translations)
            }
            return o || r || e.translate(t, n)
        }
    };
    null == hubspot.form && (hubspot.form = {});
    null == (r = hubspot.form).mixins && (r.mixins = {});
    hubspot.form.mixins.I18nMixin = t
}
).call(this);

It seems like it's missing the feature of adding variables to embed translation.
When debugging, I noticed, while using emailSuggestion in embed it returns it as o in the upper function

even if the e.translate(t, n) would be before the o in the return statement. It would still not work, because there is no such translation in the formsNext.emailSuggestion so it would use english again.