Subjects should be labelled by a localizable title string in the UI and not their ID

[phette23]

Package version (if known): all known versions

Describe the bug

Where they appear in the UI—for instance in the deposit form's subjects dropdown menu (
SubjectsField.js in the invenio-rdm-records repo and in the "keywords and subjects" lists in the record display of subjects.html in this repo—subjects are labelled by their id property and not by a localized string. Identifiers make very poor labels for a number of reasons:

• they generally should not change or are very hard to change whereas labels frequently change over time
• they aren't translatable/localizable
• they tend to be terse and inscrutable
• they are usually not understandable by end users
• developers are not used to ids being exposed to end users

All of these issues are obvious in the demo instance and default demo InvenioRDM setup with its FOS subject. How many end users know what FOS means? Would someone in a non-scientific field known FOS? FOS is only the English-language acronym for this subject and does not make sense in any other language. If FOS is ever renamed, the label will be outdated. It is, in fact, already outdated since technology fields are also included so "FOST" is a more accurate acronym. FOS is an acronym and in ideal HTML it is rendered as <abbr title="Fields of Science and Technology">FOS</abbr> but that is also not supported by InvenioRDM currently.

Steps to Reproduce

1. Contribute a record
2. Scroll down to the Keywords and subjects field and note the subject IDs in the Suggest from dropdown menu or as the parenthetical prefix in the subject autocomplete field
3. Add the minimal required fields and at least one subject then publish a record
4. Note the subject ID in the list under the Keywords and subjects section in the right-hand side of the record display

Expected behavior

1. The immediate, simple fix: subject vocabularies should use theirname property instead of id wherever present in the UI. I don't know if name is a required property but a backwards-compatible fix if it's not would be to use name if it exists and fall back to id if it does not.

2. The larger, internationalized solution: subjects should use a required name or title property which has one or more language codes mapped to a title string. This is consistent with how actual subject vocabulary terms are handled; the UI does not display the id field, it uses such a title property.

# vocabularies.yaml
subjects:
  pid-type: sub
  schemes:
    - id: FOS
      name:
        - en: Fields of Science and Technology
        - es: Campos de Ciencia y Tecnología
      uri: "http://www.oecd.org/science/inno/38235147.pdf"
      data-file: vocabularies/subjects_oecd_fos.yaml

For us personally, as an English-language institution, the first solution is sufficient and I would rather that be added quickly than a more involved fix which deals with multiple modules and takes longer.

Additional context

As mentioned in the description, this issue affects invenio-rdm-records. The language string solution would also affect the structure of subjects vocabularies in invenio-vocabularies.

I mentioned the bug in discord and received some helpful pointers to the frontend code where the issue manifests.