Internationalized NoRent primary pages #1405
Conversation
There was a problem hiding this comment.
Noooice this looks good! Just a few comments, some of them somewhat meandering/blathery. I'm not sure how translators will react to this so a lot of it is speculative too, feel free to disagree!
It might be helpful to also run yarn lingui:extract and just look at the resulting messages.po files--but not commit them--to see what the translators will see? As I mention in one of the comments it might be good not to have the message IDs be too massive but I'm not sure.
| <Trans> | ||
| <NorentLogo size="is-64x64" color="white" />{" "} | ||
| <span>brought to you by JustFix.nyc</span> | ||
| </Trans> |
There was a problem hiding this comment.
I wonder if it might make sense to add a comment="This is the NoRent logo followed by the text 'brought to you by justfix.nyc'" attribute or something here, just so translators know that the first tag (which will show up as like, <0> or something nonsensical) has meaning to the translation... hmmm.
There was a problem hiding this comment.
This will be resolved once I implement your fix from below! https://github.com/JustFixNYC/tenants2/pull/1405/files#r421808840
| <Trans> | ||
| <NorentLogo size="is-96x96" color="dark" />{" "} | ||
| <span className="subtitle"> | ||
| letters sent by tenants across the USA | ||
| </span> | ||
| <p className="is-uppercase">Since April 2020</p> | ||
| </Trans> |
There was a problem hiding this comment.
It's probably obvious to translators, but it might mayyybe be useful to add a comment attribute to the <Trans> explaining that a number appears before the translated text? I dunno just a thought.
| <Trans> | ||
| Here’s what you can do with <NorentLogo size="is-128x128" /> | ||
| </Trans> |
There was a problem hiding this comment.
Again, I wonder if a comment attribute would help the translator make better sense of this? Or on the other hand, Crowdin does make the file and line number visible to the translator, but it doesn't seem to have any way of providing a hyperlink directly to the location on GitHub... it would be cool if it did, at least then the translator could click on it to see the <NorentLogo>.
There was a problem hiding this comment.
OH WAIT! You know what might be awesome?!! If this JSX actually read like this:
<Trans>
Here's what you can do with <NorentLogo size="is-128x128">NoRent</NorentLogo>
</Trans>The <NorentLogo> could simply not render its children, but instead use the children as its alt text. And this would show up to translators as something like:
Here's what you can do with <0>NoRent</0>
That would be a lot easier for them to understand than the current code, which I think would read to translators as:
Here's what you can do with <0>
it would also allow them to easily change the alt text I guess, although I'm not sure if that's desirable or not.
Anyways just an idea.
There was a problem hiding this comment.
Err if you actually think this idea is good, I would hold on actually implementing it for another PR though...
There was a problem hiding this comment.
That's a really good idea!! Ok I'll save this for another PR to work on next week.
| notice, the COVID-19 emergency may impact my ability to | ||
| pay rent. | ||
| </p> | ||
| <br /> |
There was a problem hiding this comment.
These <br/>s inside <Trans> content concern me a bit because they're essentially formatting/styling rather than content, and they could confuse translators (especially since they can't see the actual type of tag and will just see e.g. <1>... and if we ever remove them, it will cause translators to have to re-translate the text, which could be frustrating. It'd be nice to get rid of them but I also don't want this PR to have to also tackle CSS stuff, so maybe file an issue to address it later?
There was a problem hiding this comment.
Hey hey, any thoughts on this? I think it's the only part of my review that you haven't addressed but I might have missed something.
There was a problem hiding this comment.
Oooh sorry! I filed an issue for this as you suggested (#1424) but forgot to circle back and link it here.
|
@toolness, thanks for your thoughtful review! I ran into some problems adding in |
|
@toolness as I suspected, Tahnee does have a specific framing and system for when we use Title case vs. Sentence case. I summed up as best I could here: When we use Sentence case:
When we use Title case:
Given that, it seems that the only error in the content so far was the section titles on the About page. I changed that so we should be good to go. Let me know if you have any qualms about this and we can try and set up a time to talk through it together. |
Ok, I just dug into this and discovered that the docs on Lingui's website actually appear to be for the bleeding-edge, in-development version of Lingui, not the latest official release, and I guess in the meantime there's really nothing we can do to improve these messages, except maybe splitting them up into separate catalogs for localizers, but that might be a bleeding-edge new feature too for all I know, so let's just shelve the idea for now. Thanks for the explanation on sentence case vs. title case--we definitely need to make a content guide at some point that spells all this out! I guess that's one for #323, which really ought to be in Clubhouse at this point... |
|
Ahhh damn, I wanna be on the "bleeding-edge" too! Makes sense though as to why we cant use those features yet... ok well in that case, this should be good to go for merging right? With the exception of #1405 (comment) which I'll do in a separate PR after we merge this one into master. |
This PR implements @toolness's suggesstion from #1405 (comment). It refactors our <NorentLogo> component to take its child and use it as the alt text for the image. Now, translators on CrowdIn can also see the alt text, which will help give context when they translate sections that include the NoRent logo inline.
This PR internationalizes the homepage, "The Letter" page, about page, faqs page, and log out page on the NoRent site. It also internationalizes any component referenced in the primary pages (like our social share icons) as well as the header and footer.