text-provider
text-provider copied to clipboard
A react component which provides all the string constants using provider pattern

text-provider
A component which provides all the string constants using provider pattern
Text provider is a library to place all the string constants of an application in a single place and use them inside the components in a memory friendly way.
It provides two components:
- TextProvider
- FormattedMessage
Install
npm i text-provider
Usage
- Import the string constants required for the particular presentational component:
const sampleText = require("src/nls/sample-text.json");
- Use the TextProvider to make it available for all the components:
<TextProvider globalText={sampleText} >
<MyPresentationalComponent />
</TextProvider>
- Use it inside the presentational component:
<FormattedMessage id="Random Id"/>
const randomId = "Random Id";
const values = {
"valueToBeInjected": "Random Value"
};
<FormattedMessage id={randomId} values={values}/>
Works like a format string also. Example JSON:
{
"Random Id": "<b>Random Text Returns</b> {valueToBeInjected} for each text)"
}
Then ${valueToBeInjected}
gets replaced with the value specified in values
.
Make sure that a string by the same id
exists in the JSON file.