Adding Text Properties to a React Component

Create brilliant localization and other text properties for your custom React component.

To upload a text properties file for a component, you can either add a manual or use a GraphQL mutation. Overrides to the core Text keys go to the text/text.json file (for example, text/text.en.json).

New text keys added for a component are placed behind the component’s directory in the text subdirectory.

If you have added an English text properties file for the ReactSample component, it is placed in the components/ReactSample/text/text.en.json file.

Here is an example of the contents you would find in this type of file:

{
  "button.title": "Cat fact!"
}

Uploading a text properties file for a component via GraphQL

To upload a text properties file for a component, you run the mutation. This mutation must be a multipart/form-data request with a file attachment.

Here is an example cURL script that accomplishes this:

curl --location 'https://community.mine.com/t5/s/api/2.1/graphql' \
--header 'Authorization: Bearer r8iuFP51VSVMkBztKC7dqy40hFQQF66hV+pGotPHG8U=;' \
--header 'Content-Type: multipart/form-data' \
--form 'operations="{ \"query\": \"mutation($templateId: String!, $locale: Locale!, $assetPart: Upload!) { saveComponentTextAssetFromUpload(templateId:$templateId locale: $locale assetPart: $assetPart){result {name directoryName subDirectoryName feature size lastModified revision mimeType url } errors {...on Error { message fields }}}}\", \"variables\": {\"templateId\": \"ReactSample\", \"locale\": \"en\", \"assetPart\": null} }"' \
--form 'map="{\"file\":[\"variables.assetPart\"]}"' \
--form 'file=@"text.en.json"'