Cross referencing data models / binding existing labels to data models

[pasquej]

We have a host of existing localized texts, stored by label in a data model (we did this through the write API). The model entry looks like:

{    
     messages: {
          "key-1": <<localized text>>,
          "key-2": <<localized-text>>
     }
}

(where the model just defines the “messages” field as a map)

Using these directly in the visual editor is easy. Just connect the labels data entry, and bind the particular key.

This gets tricky when integrating with another data model. Say we define a data model that looks like

{
    people: [{
        name: <<text>>,
        title: ??
    }]
}

The people data model will then be iterated over in the visual editor to make a card per person.

How do I create people entries whose titles can point to those localized texts? This can either be by reference or just being copied over.

Some things I have tried:

1. Create a “titleLabel” field on the people data model, which just contains the label key which is the key in the localized messages map. Then, in the data binding, I had to manually edit the code to be effectively state.labels[state.people.titleLabel][state.locale]. This technically worked, but is an AWFUL solution for any non-engineer trying to implement this.
2. Split up the localized messages into one data model per message (So the model entry would be “key-1”, and would have a “value” field that is the localized text), and then within the people data model use the “reference” type to point to that entry. That technically worked to connect the two, but then within the visual editor I couldn’t get the actual text out of it (The dropdown only included the type, @id, and model as referencible fields).

I am definitely open to other solutions for this, that could even include not using the messages data model at all.

[alexander]

Hello,

If I understand the problem correctly, you require a unique, localized title for each instance of your “People” data model. A non-engineer friendly solution would be to use Field-level, or inline, localization - Builder.io

You can configure the title field to be localizable from within the data model:

And then when you go to create an instance of the People data model, you can adjust the title based on the locale:

Let me know if this answers your question

[pasquej]

The problem I see is that this doesn’t incorporate our existing labels. So the designer has to go and find the label for each language and paste it in, instead of just referencing a label by key from our labels model (the key points to the 5 different values in each language).

[pasquej]

One option I have been considering:

When creating the people data entry, is it possible to pull in the value from a different data entry? It doesn’t even have to permanently reference that value. I just want it to be easier to bind the localized values. So for example, when filling out the data entry “title” field, you could select a key from the label set data entry, and populate the values that way.

I don’t think this is doable with the current setup, but I wonder if that’s a custom data type that we could create with a plugin?

[alexander]

It’s possible to reference values from different data entries using the built-in reference field type: Custom fields - Builder.io

Could you provide an example of your messages map so I can understand the structure better? From your initial message it looked like one key corresponded to one message.

[pasquej]

No so I tried that but you can’t actually reference values within an entity you can only reference the id, name, or type of the entry.

okay our labels entry looks one of two ways (I can do either if we can use either to work).

{
    messages: {
        "math-teacher-title": {
            "en": "Math Professor",
            "es": "Profesor de Matematicas",
            ...
            "type": "@builder.io/core:LocalizedValue"

        }
        "science-teacher-title": {
            ...
        }
    }
}

OR

{
    messages: {
        "en": {
            "math-teacher-title": "Math Professor",
            "science-teacher-title": "Science Professor"
        },
        "es": {
            "math-teacher-title": "Profesor de Matematicas",
            "science-teacher-title": "Profesor de Siencia"
        },
        ...,
        "type": "@builder.io/core:LocalizedValue"
    }
}

The data entry I want to use it in looks like this:

{
    experts: [{
        "name": "Joe Schmoe",
        "title": "<<Somehow the localized value for the math teacher title>>",
    }, {
        "name" :"Jeff Smith",
        "title": "<<Somehow the localized value for the science teacher>>"
    }]
}

[pasquej]

Ideally, with the latest solution, in the UI when filling out the fields for Joe Schmoe, the “title” section would be a type of something like “inject localized field”. You would click from a drop down to select the labels entry, and then would click to select the key, and you would get the LocalizedValue for the text.

[manish-sharma]

Hello @pasquej,

If you’re using a reference field approach, the values of the messages model fields may not be directly accessible. However, you can still retrieve and bind them to your data.