Convert all strings to language translation strings [React]

[Johns Gresham]

Feature details

• All strings in React components use language translation strings. Ex. convert Add Node to t('AddNode'). See some of our React components for real examples.

How to do this:

1. Find the strings (words or sentences) that are in english only
   Open the app and change languages from English to another and take note of all the text that hasn't been converted to the other language and look through all of the components in src/renderer and any text that is shown to the user (in a render method of a component .tsx file)
2. Convert the code so that the string is translated before being shown to the user. Example, change:

<Button label="Next" />

to

const { t } = useTranslation();
...
<Button label={t('Next')} />

Live code example: https://github.com/jgresham/nice-node/blob/3b24921c261ec52f86857a5e31c45702294c57a0/src/renderer/Generics/redesign/Alert/Alert.tsx#L72
3. Add the English version of the text to one of the files in src/assets/locales/en here https://github.com/jgresham/nice-node/tree/3b24921c261ec52f86857a5e31c45702294c57a0/assets/locales/en. If the text is specific to NiceNode, put it in translation.json, if the text is used in a generic component (not specific to NiceNode) put it in genericComponents.json. Depending on which file you put it in, you will need to pass the filename to useTranslation like so const { t } = useTranslation('genericComponents');

When this work is done, Johns will upload the .json files to crowdin.com and anyone can come and translate the English to another language, which can then be used in NiceNode.

[Johns Gresham]

@wolfderechter has started on this

[cornpotage]

resolved with #280