Issues for internationalization of Steemit condenser
A few days ago, I submitted a PR to add Japanese locale to Steemit condenser.
As mentioned in the previous post, I had planned to launch a Japanese front end for steem platform.
Therefore, I gained more knowledge than simply translating it.
When I was developing it, I was in trouble with many issues.
This post is list of issues for internationalization of Steemit condenser I noticed.
I classified them into four types.
1. The translation is not reflected.
This is Bug.
Flag descriptions are seems to be translatable, but they are not actually translated.
I changed language setting to Russian, but it is displaied in English.
Related code is here.
https://github.com/steemit/condenser/blob/master/src/app/components/elements/Voting.jsx
It should be translated, I don't know why it's not translated.
2. Hard-coded strings
There are a lot of hard-coded strings in the code of Steemit condenser.
These may not be bugs, but they can't be translated.
For example: "Fill convert request" is one of hard-coded strings.
https://github.com/steemit/condenser/blob/master/src/app/components/cards/TransferHistoryRow.jsx
Another example: on witness page.
It seems to correctly, but there are also hard-coded strings.
https://github.com/steemit/condenser/blob/master/src/app/components/pages/Witnesses.jsx
Period and space are hard-coded.
For languages which use alphabet similar to English, these are not problem, but for some languages such as Japanese and Chinese these are not needed.
They uses "。" instead of ".".
These symbols also must be included to locales files.
Here I list hard-coded strings that become problems in translation.
This list is not complete, but it contains many of hard-coded strings.
But it may contain messages which is not visible to users.
https://github.com/steemit/condenser/blob/master/src/app/components/cards/PostFull.jsx
line 216: content_body = 'Not available for legal reasons.'
https://github.com/steemit/condenser/blob/master/src/app/components/cards/TransferHistoryRow.jsx
line 98: description_start += `Claim rewards: ${rewards_str}`;
line 103: description_start += `Fill convert request: ${data.amount_in} for ${data.amount_out}`;
line 107: description_start += `Paid ${data.open_pays} for ${data.current_pays}`;
line 110: description_start += `Paid ${data.current_pays} for ${data.open_pays}`;
line 115: description_start += `${benefactor_reward} STEEM POWER for ${data.author}/${data.permlink}`;
https://github.com/steemit/condenser/blob/master/src/app/components/elements/ChangePassword.jsx
line 53: nameError: "Account name can't be verified right now due to server failure. Please try again later."
https://github.com/steemit/condenser/blob/master/src/app/components/elements/ConvertToSteem.jsx
line 45: <p>{tt('converttosteem_jsx.DEBT_TOKEN_will_be_unavailable', {DEBT_TOKEN})}.</p>
period
line 47: <p>{tt('converttosteem_jsx.this_is_a_price_feed_conversion')}.</p>
period
https://github.com/steemit/condenser/blob/master/src/app/components/elements/ReplyEditor.jsx
line 238: this.setState({progress: {error: 'Please insert only image files.'}})
line 569: errorCallback('HTML posts must begin with <html> and end with </html>')
line 582: errorCallback('Please remove the following HTML elements from your post: ' + Array(...rtags.htmltags).map(tag => `<${tag}>`).join(', '))
https://github.com/steemit/condenser/blob/master/src/app/components/elements/SidebarLinks.jsx
line 6: <h3 className="c-sidebar__h3">Links</h3>;
line 10: <li className="c-sidebar__list-item"><a className="c-sidebar__link" href={'/@' + username}>My blog</a></li>
line 11: <li className="c-sidebar__list-item"><a className="c-sidebar__link" href={'/@' + username + '/transfers'}>My wallet</a></li>
https://github.com/steemit/condenser/blob/master/src/app/components/elements/SidebarNewUsers.jsx
line 6: <h3 className="c-sidebar__h3">New to Steemit?</h3>
line 10: <li className="c-sidebar__list-item"><a className="c-sidebar__link" href="/welcome">Quick start guide</a></li>
line 11: <li className="c-sidebar__list-item"><a className="c-sidebar__link" href="https://steem.io">The blockchain</a></li>
line 12: <li className="c-sidebar__list-item"><a className="c-sidebar__link" href="/faq.html">FAQs</a></li>
line 13: <li className="c-sidebar__list-item"><a className="c-sidebar__link" href="/pick_account">Sign up</a></li>
https://github.com/steemit/condenser/blob/master/src/app/components/elements/Voting.jsx
line 154: <a href="#" onClick={this.voteDown} className="button outline" title="Flag">Flag</a>
https://github.com/steemit/condenser/blob/master/src/app/components/modules/PromotePost.jsx
line 75: <p>{tt('promote_post_jsx.spend_your_DEBT_TOKEN_to_advertise_this_post', {DEBT_TOKEN})}.</p>
period
https://github.com/steemit/condenser/blob/master/src/app/components/modules/SidebarModule.jsx
line 9: <h3 className="c-sidebar__h3">Links React Component</h3>
https://github.com/steemit/condenser/blob/master/src/app/components/modules/SignUp.jsx
line 16: <p>Due to server maintenance we are running in read only mode. We are sorry for the inconvenience.</p></div>
and many other hard-coded strings in this file. You can find them easily.
https://github.com/steemit/condenser/blob/master/src/app/components/modules/TermsAgree.jsx
line 34: <h4>Terms and Service</h4>
and many other hard-coded strings in this file. You can find them easily.
https://github.com/steemit/condenser/blob/master/src/app/components/modules/UserWallet.jsx
line 276: Your current rewards: {rewards_str}
https://github.com/steemit/condenser/blob/master/src/app/components/pages/Approval.jsx
line 22: <h4>Thanks for confirming your email!</h4>
<p>After validating your sign up request with us we'll look it over for approval. As soon as your turn is up and you're approved, you'll be sent a link to finalize your account!</p>
<p>You'll be among the earliest members of the Steemit community!</p>
line 28: <h4>Thanks for confirming your phone number!</h4>
<p>You're a few steps away from getting to the top of the list. Check your email and click the email validation link.</p>
<p>After validating your sign up request with us we'll look it over for approval. As soon as your turn is up and you're approved, you'll be sent a link to finalize your account!</p>
<p>You'll be among the earliest members of the Steemit community!</p>
https://github.com/steemit/condenser/blob/master/src/app/components/pages/CreateAccount.jsx
line 152: name_error: "Account name can't be verified right now due to server failure. Please try again later."
line 184: <p>Membership to Steemit.com is now under invitation only because of unexpectedly high sign up rate.</p>
line 194: <h4>Cryptography test failed</h4>
<p>We will be unable to create your Steem account with this browser.</p>
<p>The latest versions of <a href="https://www.google.com/chrome/">Chrome</a> and <a href="https://www.mozilla.org/en-US/firefox/new/">Firefox</a>
are well tested and known to work with steemit.com.</p>
line 208: <p>You need to <a href="#" onClick={logout}>Logout</a> before you can create another account.</p>
<p>Please note that Steemit can only register one account per verified user.</p>
and many other hard-coded strings in this file. You can find them easily.
https://github.com/steemit/condenser/blob/master/src/app/components/pages/NotFound.jsx
line 28: <h4 className="NotFound__header">Sorry! This page doesn't exist.</h4>
<p>Not to worry. You can head back to <a style={{fontWeight: 800}} href="/">our homepage</a>,
or check out some great posts.
</p>
line 33: <li><a href="/created">new posts</a></li>
line 34: <li><a href="/hot">hot posts</a></li>
line 35: <li><a href="/trending">trending posts</a></li>
line 36: <li><a href="/promoted">promoted posts</a></li>
line 37: <li><a href="/active">active posts</a></li>
https://github.com/steemit/condenser/blob/master/src/app/components/pages/PickAccount.jsx
line 72: return res && res.length > 0 ? 'Account name is not available' : '';
line 80: name_error: "Account name can't be verified right now due to server failure. Please try again later."
line 91: <p className="text-center">LOADING..</p>
line 110: <p>The creation of new accounts is temporarily disabled.</p>
and many other hard-coded strings in this file. You can find them easily.
https://github.com/steemit/condenser/blob/master/src/app/components/pages/Post.jsx
line 82: <p onClick={this.showAnywayClick}>{tt('promote_post_jsx.this_post_was_hidden_due_to_low_ratings')}.{' '}
period and space
line 115: {showNegativeComments ? tt('post_jsx.now_showing_comments_with_low_ratings') : tt('post_jsx.comments_were_hidden_due_to_low_ratings')}.{' '}
period and space
line 142: <h4 className="NotFound__header">Sorry! This page doesnt exist.</h4>
<p>Not to worry. You can head back to <a style={{fontWeight: 800}} href="/">our homepage</a>,
or check out some great posts.
</p>
line 147: <li><a href="/created">new posts</a></li>
line 148: <li><a href="/hot">hot posts</a></li>
line 149: <li><a href="/trending">trending posts</a></li>
line 150: <li><a href="/promoted">promoted posts</a></li>
line 151: <li><a href="/active">active posts</a></li>
line 167: {tt('g.next_7_strings_single_block.authors_get_paid_when_people_like_you_upvote_their_post')}.
period
https://github.com/steemit/condenser/blob/master/src/app/components/pages/PostsIndex.jsx
line 97: emptyText = <div>{'No ' + topics_order + (category ? ' #' + category : '') + ' posts found'}</div>;
line 177: <small><a className="c-sidebar__more-link" onClick={this.onShowSpam}>{showSpam ? tt('g.next_3_strings_together.show_less') : tt('g.next_3_strings_together.show_more')}</a>{' ' + tt('g.next_3_strings_together.value_posts')}</small>
space
https://github.com/steemit/condenser/blob/master/src/app/components/pages/Privacy.jsx
line 8: <h1>Steemit, Inc Privacy Policy</h1>
and many other hard-coded strings in this file. You can find them easily.
https://github.com/steemit/condenser/blob/master/src/app/components/pages/RecoverAccountStep1.jsx
line 195: {show_social_login === 'both' ? <p>{tt('recoveraccountstep1_jsx.login_with_facebook_or_reddit_media_to_verify_identity')}.</p>
period
line 198: })}.</p>}
period
https://github.com/steemit/condenser/blob/master/src/app/components/pages/Support.jsx
line 12: {tt('g.please_email_questions_to')} <a href="mailto:[email protected]">[email protected]</a>.
period
https://github.com/steemit/condenser/blob/master/src/app/components/pages/Tos.jsx
line 8: <h1>Steemit Terms of Service</h1>
and many other hard-coded strings in this file. You can find them easily.
https://github.com/steemit/condenser/blob/master/src/app/components/pages/UserProfile.jsx
line 264: tab_content = <Callout>{tt('user_profile.user_hasnt_had_any_replies_yet', {name: accountname}) + '.'}</Callout>;
period
https://github.com/steemit/condenser/blob/master/src/app/components/pages/Welcome.jsx
line 10: <div className="Welcome__welcome">Welcome to</div>
line 12: <div className="Welcome__caption">Come for the rewards. Stay for the community.</div>
https://github.com/steemit/condenser/blob/master/src/app/components/pages/Witnesses.jsx
line 131: <strong>{tt('witnesses_jsx.you_have_votes_remaining', {count: witness_vote_count})}.</strong>{' '}
period and space
line 132: {tt('witnesses_jsx.you_can_vote_for_maximum_of_witnesses')}.
period
line 157: <p>{tt('witnesses_jsx.if_you_want_to_vote_outside_of_top_enter_account_name')}.</p>
period
line 198: {this.state.proxyFailed && <p className="error">{tt('witnesses_jsx.proxy_update_error')}.</p>}
period
line 236: confirm: proxy.length ? "Set proxy to: " + proxy : "You are about to remove your proxy.",
https://github.com/steemit/condenser/blob/master/src/app/redux/AuthSaga.js
line 117: if (!account) throw new Error('Account not found')
https://github.com/steemit/condenser/blob/master/src/app/redux/Transaction.js
line 54: let errorKey = 'Transaction broadcast error.';
line 59: errorKey = 'You already voted for this post';
line 65: errorKey = 'You may only post once per minute.'
line 71: errorKey = 'Insufficient balance.'
line 76: errorKey = 'Account requires 10x the account creation fee in Steem Power (approximately 300 SP) before it can power down.'
line 94: errorStr = `Transaction failed: ${err_lines[1]}`;
line 100: errorKey = "Steem account doesn't exist.";
line 101: errorStr = "Transaction failed: Steem account doesn't exist.";
line 105: errorKey = "Not your valid active key.";
line 106: errorStr = "Transaction failed: Not your valid active key.";
https://github.com/steemit/condenser/blob/master/src/app/redux/TransactionSaga.js
line 62: if(!memo_private) throw new Error('Unable to encrypt memo, missing memo private key')
line 64: if(!account) throw new Error(`Unknown to account ${operation.to}`)
line 515: onError('Unknown account ' + account)
line 519: onError('Your new password should not be a WIF')
line 523: onError('Your new password should not be a Public Key')
line 578: onError('Account not found')
line 598: onError('Missing old key, not sure what to replace')
line 684: onError(`Incorrect Password`)
line 685: throw new Error('Trying to update a memo without a signing key?')
line 711: onError('Account not found')
line 715: onError(`Incorrect Password`)
line 716: throw new Error('Have to pass owner key in order to change meta')
https://github.com/steemit/condenser/blob/master/src/app/redux/UserSaga.js
line 150: yield put(user.actions.loginError({ error: 'Username does not exist' }))
line 198: yield put(user.actions.loginError({ error: 'Hello. Your account may have been compromised. We are working on restoring an access to your account. Please send an email to [email protected].' }))
line 233: yield put(user.actions.loginError({ error: 'This login gives owner or active permissions and should not be used here. Please provide a posting only login.' }))
line 319: throw 'Login will not be saved, posting key is the same as active key'
line 323: throw 'Login will not be saved, posting key is the same as owner key'
line 464: progress({error: 'Unable to contact the server.'})
https://github.com/steemit/condenser/blob/master/src/app/utils/SlateEditor/Iframe.js
line 109: placeholder="Enter a YouTube or Vimeo URL..."
https://github.com/steemit/condenser/blob/master/src/app/utils/ChainValidation.js
line 24: return 'Use caution sending to this account. Please double check your spelling for possible phishing. ';
line 56: return suffix = 'Do not use private keys in memos. ';
line 59: return suffix = 'Do not use passwords in memos. ';
line 62: return suffix = 'Please do not include what appears to be a private key or password. '
https://github.com/steemit/condenser/blob/master/src/app/utils/ExtractMeta.js
line 67: if(about == null) about = "Join thousands on steemit who share, post and earn rewards.";
line 71: const desc = `The latest posts from ${name}. Follow me at @${account.name}. ${about}`;
https://github.com/steemit/condenser/blob/master/src/app/utils/SanitizeConfig.js
line 32: export const noImageText = '(Image not shown due to low ratings)'
line 81: sanitizeErrors.push('Invalid iframe URL: ' + srcAtty)
line 90: sanitizeErrors.push('An image in this post did not save properly.')
https://github.com/steemit/condenser/blob/master/src/server/api/account_recovery.js
line 23: this.body = 'please provide account name';
https://github.com/steemit/condenser/blob/master/src/server/api/general.js
line 90: this.body = JSON.stringify({error: 'New signups are temporary disabled.'});
line 97: this.body = JSON.stringify({error: 'Unauthorized'});
line 107: this.body = JSON.stringify({error: 'Conflict'});
line 125: throw new Error("We can't find your sign up request. You either haven't started your sign up application or weren't approved yet.");
line 148: throw new Error('Only one Steem account allowed per IP address every 10 minutes');
line 445: this.body = 'missing logged in account';
line 451: if (json.length > 1024) throw new Error('the data is too long');
https://github.com/steemit/condenser/blob/master/src/server/api/oauth.js
line 114: this.body = 'We cannot verify the user account. Please contact [email protected]';
line 119: this.body = 'We cannot verify the user account. Please contact [email protected]';
line 155: this.flash = {success: 'Successfully authenticated with Facebook'};
line 214: this.body = 'We cannot verify the user account. Please contact [email protected]';
line 219: this.body = 'We cannot verify the user account. Please contact [email protected]';
https://github.com/steemit/condenser/blob/master/src/server/sign_up_pages/enter_confirm_email.jsx
line 52: this.flash = { success: "Email has already been verified" };
line 60: this.body = '<!DOCTYPE html>Confirmation code expired. Please <a href="/enter_email">re-submit</a> your email for verification.';
line 157: this.flash = {alert: "Your account has already been created."};
line 165: this.flash = { error: "Your account has not been approved yet." };
line 168: this.flash = { error: "Issue with your sign up status." };
line 173: this.flash = { error: "This is not a valid sign up code. Please click the link in your welcome email." };
line 182: this.flash = { error: "Please select your account name" };
line 189: this.flash = { error: `${picked_account_name} is already taken, please try another name` };
line 205: Your email address, please
line 208: We use this to contact you and verify account ownership if this account is ever compromised. We'll send a confirmation link, so please use a valid email.
line 261: this.flash = { error: "Please provide an email address" };
line 278: error: "Failed captcha verification, please try again"
line 293: this.flash = { error: "Not valid email address" };
https://github.com/steemit/condenser/blob/master/src/server/sign_up_pages/enter_confirm_mobile.jsx
line 58: this.flash = { error: "User session not found, please make sure you have cookies enabled in your browser for this website" };
line 67: this.flash = { error: "Wrong confirmation code" };
line 75: this.flash = { error: "Confirmation code has been expired" };
line 90: this.flash = { error: "This phone number has already been used" };
line 133: Almost there!
line 138: <p>We need to send you a quick text. </p>
line 140: <p>With each Steemit account comes a free initial
grant of Steem Power! Phone verification helps
cut down on spam accounts.</p>
line 144: <p><em>Your phone number will not be used for any
other purpose other than account verification and (potentially) account
recovery should your account ever be compromised.</em></p>
line 150: Country Code
line 154: Phone number
line 158: Examples: 541-754-3010 | 89-636-48018
line 162: * Land lines cannot receive SMS messages
line 165: * Message and data rates may apply
line 190: this.flash = { error: "Your session has been interrupted, please start over" };
line 200: this.flash = { error: "Please select a country code" };
line 206: this.flash = { error: "Please provide a phone number" };
line 241: this.flash = { success: "Phone number has been verified" };
line 254: error: "Confirmation was attempted a moment ago. You can attempt verification again in one minute."
line 315: Thank you for providing your phone number (
line 317: ).
line 320: To continue please enter the SMS code we've sent you.
line 332: Confirmation code
line 337: Didn't receive the verification code?{" "}
line 350: const props = { body, title: "Phone Confirmation", assets, meta: [] };
https://github.com/steemit/condenser/blob/master/src/server/utils/teleSign.js
line 30: error: 'Unable to verify your phone number. Please try a different phone number.',
line 46: return { error: 'Unable to verify phone, please try again later.' };
https://github.com/steemit/condenser/blob/master/src/server/server-error.jsx
line 10: <h4>Sorry.</h4>
<p>Looks like something went wrong on our end.</p>
<p>Head back to <a href="/">Steemit</a> homepage.</p>
3. Fixed word order
This is also a kind of hard-coding.
In some languages, their grammar is vastly different from English, so if word order is fixed , translators cannot make natural translation.
For example:
The order of these words is completely fixed in source code.
https://github.com/steemit/condenser/blob/master/src/app/components/cards/TransferHistoryRow.jsx
I want to translate this message "Transfer 0.200 SBD to inoue" into "inoueに0.200SBDを送りました" in Japanese.
However, because the word order is fixed, I translated it as "送信 0.200 SBD 宛先:inoue" in Japanese.
This is very unnatural.
Another one:
In left side of top page, if the user clicks "Show more", it will change to "Show fewer".
https://github.com/steemit/condenser/blob/master/src/app/components/pages/PostsIndex.jsx
line 177: <small><a className="c-sidebar__more-link" onClick={this.onShowSpam}>{showSpam ? tt('g.next_3_strings_together.show_less') : tt('g.next_3_strings_together.show_more')}</a>{' ' + tt('g.next_3_strings_together.value_posts')}</small>
The order of "Show more" (or "Show fewer") and "low value posts" can not be swapped.
I couldn't translate these into Japanese.
Because Japanese word order is SOV (subject-object-verb).
So I had to write "low value posts" blank and I wrote full text on "Show more" or "Show fewer".
4. Words used in multiple places.
In most cases, this is a smart way.
However, in some cases it will annoy the translators.
For example:
In the top page, this "new" means "new posts".
I want to translate it into "新着" in Japanese.
In Change Password page, this word is also used.
It means "new password", so I want to translate it into "新しい" in Japanese, or to leave it in English.
"新着" is unsuitable.
However, in the souce code, these words are defined by same term 'g.new'.
https://github.com/steemit/condenser/blob/master/src/app/components/modules/Header.jsx
https://github.com/steemit/condenser/blob/master/src/app/components/elements/ChangePassword.jsx
Unless they are used in exactly the same meaning, they should be defined separately.
By solving these issues, Steemit will be able to be fully translated by many languages around the world, and becomes a real international social media platform!
Thank you for reading.
Open Source Contribution posted via Utopian.io
Hello @inoue your contribution has been accepted and posted to the Github issues of Steemit Condenser https://github.com/steemit/condenser/issues/1929
[utopian-moderator]
Thanks @elear
Awesome and thorough report. Thanks for documenting all of these issues.
Sure.
Non-English users expect Steemit internationalization.
I hope this report will be helpful for it.
As a follower of @followforupvotes this post has been randomly selected and upvoted! Enjoy your upvote and have a great day!
Hey @inoue I am @utopian-io. I have just super-voted you at 57% Power!
Suggestions https://utopian.io/rules
-Utopian has detected 1 bot votes. I am the only bot you should love!!
Achievements
-I am a bot...I need someone spotting my bugs!
-Good amount of information. Thank you!
-Much more informative than others in this category. Good job!
-Votes on this contribution are going well. Nice!
-You are having more votes than average for this category. Nice!
-You have a good amount of votes on your contributions. Good job!
-In total you have more votes than average for this category. Bravo!
-You have just unlocked 7 achievements. Yeah!
Up-vote this comment to grow my power and help Open Source contributions like this one.