I'm going to present an issue regarding the strings in staging.busy.org. There are cases when the id of the used string does not match the string in the locale JSON files. It results in text that is translated but the translation is not visible on the site.

## VoteActionMessage.js

|VoteActionMessage.js|en.json|text|
|-|-|-|
|user_upvoted_post|user_upvoted|"{username} upvoted"|
|user_downvoted_post|user_downvoted|"{username} downvoted"|
|user_unvoted_post|user_unvoted|"{username} unvoted"|
|voting_weight|vote_weight|"Vote weight"|

![image.png](https://res.cloudinary.com/hpiynhbhq/image/upload/v1513024607/oifbrxjbul9agqgliexe.png)

![image.png](https://res.cloudinary.com/hpiynhbhq/image/upload/v1513024612/i6bkbzqqalhbgem7bkel.png)

![image.png](https://res.cloudinary.com/hpiynhbhq/image/upload/v1513024617/jj0ycs8uufsuitrde37x.png)

![image.png](https://res.cloudinary.com/hpiynhbhq/image/upload/v1513024932/ddod7sa287ymmbnmtvo7.png)

You can see [here](https://github.com/busyorg/busy/blob/master/src/client/locales/cs.json) that the strings were translated to Czech. The mismatching IDs causes trouble and the strings would actually not be seen as translated.

Another issue is that the messages with IDs in {upvoted, downvoted, unvoted} are capitalized although the text should have only the first letter in capital.

## Error401.js

This file contains a message for the page warning the user that hey have to login to proceed. You can see it if you go to <staging.busy.org/wallet> while not logged in.

|Error401.js|en.json|
|-|-|
|`@statics/need_login`|missing|
|`@statics/here_link`|missing|
|`@statics/homepage`|missing|

You can see that I tried to fix this minor issue in a [PR](https://github.com/busyorg/busy/pull/1163) but Sekhmet also suggested another change that would require more knowledge. First new ids were suggested so that they are easier to recognize.

|old ID| new ID|
|-|-|
|need_login|login_required|
|homepage|homepage_link|
|here_link|??|

![image.png](https://res.cloudinary.com/hpiynhbhq/image/upload/v1513028075/rvcslhiuro2b1w6rtfnv.png)

```
<p>
  <FormattedMessage
    id="@statics/need_login"
    defaultMessage="You need to login to use this feature, please"
  />{' '}
  <a href={SteemConnect.getLoginURL()}>
  <FormattedMessage id="login" defaultMessage="Login" />
  </a>
  <br />
  <FormattedMessage id="@statics/here_link" defaultMessage="Here's a link to the" />
  <Link to="/">
  <FormattedMessage id="@statics/homepage" defaultMessage="home page" />
  </Link>
   .
</p>
```

I had one solution in mind regarding no prior knowledge of JS or React. I changed the ids and merged some strings together in order to work with them easily. This, however, doesn't work well.

```
<FormattedMessage
  id="login_required"
  defaultMessage="You need to {login} to use this feature."
  values={{
    login: <Link to={SteemConnect.getLoginURL()}>login</Link>,
  }}
/>
<br />
<FormattedMessage
  id="homepage_link"
  defaultMessage="Here's a link to the {home_page}."
  values={{
    home_page: <Link to="/">home page</Link>,
  }}
/>
```

To have the link embedded in the string, it should probably look like this. This is probably incorrect way of doing it but it is only a suggestion and my way of understanding the issue. Those sentences must be easy to manipulate so that they can be translated without difficulties.

```
<FormattedMessage
  id="login_required"
  defaultMessage="You need to <a href="{SteemConnect.getLoginURL()}">login</a> to use this feature."
/>
<br />
<FormattedMessage
  id="homepage_link"
  defaultMessage="Here's a link to the <a href="/">home page</a>."
/>
```

<br /><hr/><em>Posted on <a href="https://utopian.io/utopian-io/@espoem/string-ids-in-the-site-do-not-match-ids-in-json-files">Utopian.io -  Rewarding Open Source Contributors</a></em><hr/>