fix(i18n): add i18next keys for ShowProjectLinks

[errmayank]

Checklist:

• I have read freeCodeCamp's contribution guidelines.
• My pull request has a descriptive title (not a vague title like Update index.md)
• My pull request targets the main branch of freeCodeCamp.
• All the files I changed are in the same world language, for example: only English changes, or only Chinese changes, etc.

Closes #41155

• The translation.json file for Chinese and Spanish uses English values for now.
• I've used the project title as a key in translations.json, certification => project => title => 'Project Title' to translate project titles let me know if there's a better way to do this.
• In ShowProjectLinks.js I've used the t function to translate simple texts and for more complex (nested) cases I've used the <Trans /> component.

[gitpod-io]

[moT01]

I believe these title are already translated in the challenge files - probably be pretty tough to pull them from there though.

I guess they should get translated automatically by crowdin I think, since the strings will match what has already been translated. Just thinking out loud here.

[ojeytonwilliams]

I believe these title are already translated in the challenge files - probably be pretty tough to pull them from there though.

That's definitely how it should be done. Then there would be no need to use Trans for the titles as they'd already be translated. That said, it's not trivial, so it may take a while to implement.

@RandellDawson how much extra work are we generating by temporarily changing translations.json?

[ojeytonwilliams]

Hi @errmayank nice work on this PR. I have a few suggestions on how it could be simplified slightly:

[errmayank]

@ojeytonwilliams Thanks for the help! I've made the necessary changes.

[ojeytonwilliams]

Hey @errmayank thanks again for your hard work on this.

As well as the suggestions below, could you revert the changes to /chinese/translations.json and /espanol/translations.json? We just changed our approach so we default to English #41246 which means we're better off leaving those files alone and relying on the defaults.

[errmayank]

@ojeytonwilliams cool! just to make sure, I should keep /english/translations.json as it is right now with project titles right?

[errmayank]

@ojeytonwilliams weird but after changing the footnote to what you suggested and adding those default values, the text does not render properly

[errmayank]

Here's how I was able to make this work by using fragments

"footnote": "If you suspect that any of these projects violate the <1>academic honesty policy</1>, please <3>report this to our team</3>."

<Trans i18nKey='certification.project.footnote'>
  <>If you suspect that any of these projects violate the </>
  <a
    href='https://www.freecodecamp.org/news/academic-honesty-policy/'
    target='_blank'
    rel='noreferrer'
  >
    academic honesty policy
  </a>
  <>, please </>
  <a
    href={`/user/${username}/report-user`}
    target='_blank'
    rel='noreferrer'
  >
    report this to our team
  </a>
  <>.</>
</Trans>

[ojeytonwilliams]

cool! just to make sure, I should keep /english/translations.json as it is right now with project titles right?

Yes, that's exactly right, thanks.

Here's how I was able to make this work by using fragments

Nice job getting that to work, but we can get away without using fragments here. The trick is to find the correct numbers for the translation string and that's explained here. Long story short: we have to look at the children of the <Trans> component to find those numbers.

[ojeytonwilliams]

I've updated my suggestion - if that doesn't work for you, just let me know and I'll make 100% it works locally and push a commit!

[moT01]

Random component from the landing page:

You can use the react dev tools to see the children - as it states in the linked docs. Nice to get a visualization some times.

[errmayank]

@ojeytonwilliams great! the updated replacement tags that you suggested is working, I've pushed my changes.

[errmayank]

The Lint Source Files test failed due to missing keys in chinese and espanol translations.json

[RandellDawson]

@ojeytonwilliams I thought we had changed it so we no longer have to add the non-English keys. Instead, the fallback was English and then when the English source file gets uploaded to Crowdin gets uploaded, the file would get the English version at first until translated/approved.

[ojeytonwilliams]

@RandellDawson so did I, but it looks like we just agreed that that was the plan.

@errmayank thanks again for bearing with us on this. As far as I'm concerned this PR is done, so I'll take care of the validation problem myself and rebase this PR once that's complete.

[RandellDawson]

@raisedadead Can you confirm that we still want to have to add changes to the non-English files for translations.json? I thought we were going to stick with using English as the fallback for any missing keys, then once Crowdin downloads the translations, the translations for the key values would be used.

[naomi-lgbt]

English is currently set to be the fallback value - if we choose to go this direction, I can disable the linting specifically for the intro.json and translation.json files.

[raisedadead]

Yes - @nhcarrigan you can go ahead and remove the linting. Maybe we can downgrade that to a warning or something just as an FYI, but it should not throw.

[errmayank]

I guess instead of throw new Error() in schema-validation.js#L135 we could just do a console.warn()?

[ojeytonwilliams]

GitHub actions are currently down, so we may need to restart them once that is resolved.

[naomi-lgbt]

Looks to be resolved now, according to their status page.

[gitpod-io]

[ojeytonwilliams]

LGTM 👍

[ojeytonwilliams]

@errmayank Congrats on your first pull request (PR)! 🎉

Thank you for your contribution to the page! 👍
We're happy to accept these changes, and look forward to future contributions. 📝