steemit / condenser

The greatest application front-end to the Steem Blockchain.
https://steemit.com
504 stars 429 forks source link

Issues for internationalization of Steemit condenser #1929

Open inoue-a opened 6 years ago

inoue-a commented 6 years ago

Subissues

Metaissue

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-sidebarh3">Links</h3>; line 10: <li className="c-sidebarlist-item"><a className="c-sidebarlink" href={'/@' + username}>My blog</a></li> line 11: <li className="c-sidebarlist-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-sidebarh3">New to Steemit?</h3> line 10: <li className="c-sidebarlist-item"><a className="c-sidebarlink" href="/welcome">Quick start guide</a></li> line 11: <li className="c-sidebarlist-item"><a className="c-sidebarlink" href="https://steem.io"&gt;The blockchain</a></li> line 12: <li className="c-sidebarlist-item"><a className="c-sidebarlink" href="/faq.html">FAQs</a></li> line 13: <li className="c-sidebarlist-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/"&gt;Chrome&lt;/a&gt; and <a href="https://www.mozilla.org/en-US/firefox/new/"&gt;Firefox&lt;/a&gt; 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:contact@steemit.com">contact@steemit.com</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="Welcomewelcome">Welcome to</div> line 12: <div className="Welcomecaption">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 support@steemit.com.' })) 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 support@steemit.com'; line 119: this.body = 'We cannot verify the user account. Please contact support@steemit.com'; line 155: this.flash = {success: 'Successfully authenticated with Facebook'}; line 214: this.body = 'We cannot verify the user account. Please contact support@steemit.com'; line 219: this.body = 'We cannot verify the user account. Please contact support@steemit.com';

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

plink01001 commented 6 years ago

PRs to address these issues would be welcome!

sneak commented 6 years ago

Oh wow, this is an amazing report @inoue-a! Thank you for all of your time and effort putting this together!

sneak commented 6 years ago

@goldibex this should be broken out into subissues. I've been beating the drum for 3 for a long time with no luck. @originated this would be a great thing for you to work on.

bnchdrff commented 6 years ago

oh wow i didn't see this issue; https://github.com/steemit/condenser/issues/2176 is the first sub-issue ;)

goldibex commented 6 years ago

1) is already resolved

goldibex commented 6 years ago

@inoue-a I have broken your issue out into several other issues. We will close this one once we have fixed all the others. 教えてくれてありがとう!

sneak commented 6 years ago

@goldibex i updated the subissues in the OP to reference them with a checkbox list, I think we should do this for all metaissues. It makes a really nice progress bar on the project board.