Skip to content

Add some l18n #114

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Open
mathieuhendey wants to merge 1 commit into
base: master
Choose a base branch
from
Open

Add some l18n #114

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
1 commit
Select commit
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
11 changes: 10 additions & 1 deletion gatsby-config.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -102,7 +102,16 @@ module.exports = {
}
},
`gatsby-plugin-offline`,
`gatsby-plugin-react-helmet`
`gatsby-plugin-react-helmet`,
{
resolve: `gatsby-plugin-intl`,
options: {
path: `${__dirname}/src/intl`,
languages: ["en", "fr"],
defaultLanguage: "en",
redirect: true
}
}
],
mapping: {
"MarkdownRemark.frontmatter.author": `AuthorYaml`
Expand Down
Empty file added l18n.js
View file
Open in desktop
Empty file.
1 change: 1 addition & 0 deletions package.json
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -16,6 +16,7 @@
"gatsby-plugin-emotion": "^4.0.3",
"gatsby-plugin-feed": "^2.0.13",
"gatsby-plugin-google-analytics": "^2.0.20",
"gatsby-plugin-intl@beta": "^0.1.7",
"gatsby-plugin-mailchimp": "^5.1.0",
"gatsby-plugin-manifest": "^2.0.18",
"gatsby-plugin-netlify-cms": "^3.0.12",
Expand Down
31 changes: 17 additions & 14 deletions src/components/HomeIntro/index.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -5,16 +5,18 @@ import Styles from "./Styles.module.scss";
import Typist from "react-typist";
import TypistLoop from "react-typist-loop";
import HomeBanner from "./homeBanner.svg";
import { formatMessage } from "gatsby-plugin-intl";
import { injectIntl } from "react-intl";

import ConvincedButton from "../ConvincedButton";

const HomeIntro = () => {
const HomeIntro = ({ intl }) => {
const [mounted, setMounted] = useState(false);

useEffect(() => {
setTimeout(() => {
setMounted(true);
}, 2000);
}, 4000);
}, []);

return (
Expand All @@ -26,24 +28,25 @@ const HomeIntro = () => {
{!mounted ? (
<span className={Styles.titleEmphasis}>mass extinctions</span>
) : (
<TypistLoop interval={0}>
<TypistLoop interval={3000}>
{[
"extreme weather",
"water shortages",
"crop failures",
"extreme_weather",
"water_shortages",
"crop_failures",
"wildfires",
"mass migrations",
"sea level rises",
"mass extinctions"
"mass_migrations",
"sea_level rises",
"mass_extinctions"
].map(text => (
<Typist
className={Styles.typist}
key={text}
key={{ text }}
cursor={{ show: false }}
avgTypingDelay={45}
interval={1000}
>
<span className={Styles.titleEmphasis}>{text}</span>
<Typist.Backspace count={text.length} delay={3000} />
<span className={Styles.titleEmphasis}>
{intl.formatMessage({ id: { text }.text })}
</span>
</Typist>
))}
</TypistLoop>
Expand Down Expand Up @@ -78,4 +81,4 @@ const HomeIntro = () => {
);
};

export default HomeIntro;
export default injectIntl(HomeIntro);
24 changes: 14 additions & 10 deletions src/components/Navbar/index.js
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,12 +1,13 @@
import React, { useState } from "react";
import { Link } from "gatsby";
import MenuIcon from "../Images/Icons/MenuIcon";
import GlobalStyles from "../../styles/Global.module.scss";
import ButtonStyles from "../../styles/Buttons.module.scss";
import Styles from "./Styles.module.scss";
import Logo from "./LogoOnDark.svg";
import { Link, FormattedMessage } from "gatsby-plugin-intl";
import { injectIntl } from "react-intl";

function Navbar() {
const Navbar = ({ intl }) => {
const [navOpen, setNavOpen] = useState(false);

function toggleNav(e) {
Expand All @@ -22,7 +23,7 @@ function Navbar() {
>
<div className={`${GlobalStyles.inner} ${Styles.inner}`}>
<div className={Styles.logo}>
<Link to="/" title="Go back home">
<Link to="/" title={intl.formatMessage({ id: "link_to_root" })}>
<img src={Logo} alt="ClimateChoice" />
</Link>
</div>
Expand All @@ -39,13 +40,16 @@ function Navbar() {
className={`${Styles.navList} ${navOpen ? Styles.navListOpen : ""}`}
>
<li className={`${Styles.navItem} ${Styles.navItemLink}`}>
<Link to="/contact#contribute" title="Contribute to ClimateChoice">
Contribute
<Link
to="/contact#contribute"
title={intl.formatMessage({ id: "contribute" })}
>
{intl.formatMessage({ id: "contribute" })}
</Link>
</li>
<li className={`${Styles.navItem} ${Styles.navItemLink}`}>
<Link to="/donate" title="Donate to climate causes">
Donate
<Link to="/donate" title={intl.formatMessage({ id: "donate" })}>
<FormattedMessage id="donate" />
</Link>
</li>
<li className={`${Styles.navItem} ${Styles.navItemAction}`}>
Expand All @@ -55,14 +59,14 @@ function Navbar() {
ButtonStyles.btnHeader
} `}
>
View your choices
<FormattedMessage id="choices" />
</button>
</a>
</li>
</ul>
</div>
</nav>
);
}
};

export default Navbar;
export default injectIntl(Navbar);
8 changes: 8 additions & 0 deletions src/components/Redirect/redirect.js
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,8 @@
import React from "react";
import { injectIntl } from "gatsby-plugin-intl";

const Redirect = ({ intl }) => {
return <SEO title={`${intl.formatMessage({ id: "title" })}`} />;
};

export default injectIntl(Redirect);
13 changes: 13 additions & 0 deletions src/intl/en.json
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,13 @@
{
"link_to_root": "Go back home",
"contribute": "Contribute to ClimateChoice",
"donate": "Donate to climate causes",
"choices": "Your choices",
"extreme_weather": "extreme weather",
"water_shortages": "water shortages",
"crop_failures": "crop failures",
"wildfires": "wildfires",
"mass_migrations": "mass migrations",
"sea_level_rises": "sea-level rises",
"mass_extinctions": "mass extinctions"
}
13 changes: 13 additions & 0 deletions src/intl/fr.json
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,13 @@
{
"link_to_root": "Acceuil",
"contribute": "Contribuer à ClimateChoice",
"donate": "Donner à climate causes",
"choices": "Vos choix",
"extreme_weather": "des conditions climatiques extrèmes",
"water_shortages": "une pénurie d'eau",
"crop_failures": "des mauvaises récoltes",
"wildfires": "des feux de forêt",
"mass_migrations": "l'immigration de masse",
"sea_level_rises": "des hausses du nieveau de la mer",
"mass_extinctions": "l'extinction en masse'"
}
64 changes: 61 additions & 3 deletions yarn.lock
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -717,7 +717,7 @@
dependencies:
regenerator-runtime "^0.13.2"

"@babel/runtime@7.4.5":
"@babel/runtime@7.4.5", "@babel/runtime@^7.4.5":
version "7.4.5"
resolved "https://registry.yarnpkg.com/@babel/runtime/-/runtime-7.4.5.tgz#582bb531f5f9dc67d2fcb682979894f75e253f12"
integrity sha512-TuI4qpWZP6lGOGIuGWtp9sPluqYICmbk8T/1vpSysqJxRPkudh/ofFWyqdcMsDf2s7KvDL4/YHgKyvcS3g9CJQ==
Expand Down Expand Up @@ -2328,6 +2328,13 @@ brorand@^1.0.1:
resolved "https://registry.yarnpkg.com/brorand/-/brorand-1.1.0.tgz#12c25efe40a45e3c323eb8675a0a0ce57b22371f"
integrity sha1-EsJe/kCkXjwyPrhnWgoM5XsiNx8=

browser-lang@^0.0.1:
version "0.0.1"
resolved "https://registry.yarnpkg.com/browser-lang/-/browser-lang-0.0.1.tgz#9cccc756a562fb7f271b87d3b2740f468c4d9b92"
integrity sha512-ozdbsXd3q/7gUb98LzM80Y1Y/GRzy9GMucBdT92KRoWLjICxCpJU7RJgqFm+dRXWW8hxTGgnLfb9M4QSrcq5gw==
dependencies:
lodash "^4.17.10"

browserify-aes@^1.0.0, browserify-aes@^1.0.4:
version "1.2.0"
resolved "https://registry.yarnpkg.com/browserify-aes/-/browserify-aes-1.2.0.tgz#326734642f403dabc3003209853bb70ad428ef48"
Expand Down Expand Up @@ -5503,6 +5510,17 @@ gatsby-plugin-google-analytics@^2.0.20:
dependencies:
"@babel/runtime" "^7.0.0"

gatsby-plugin-intl@beta@^0.1.7:
version "0.2.0-beta.1"
resolved "https://registry.yarnpkg.com/gatsby-plugin-intl/-/gatsby-plugin-intl-0.2.0-beta.1.tgz#8bd36f3b005b1745ea407e0826cb017630069116"
integrity sha512-S2Z+vViQdW4GvaHtMM7IOEZmo8cd0gfOMFi6Ul60Q6ndXu6/T75T4GtHsAY1Lkj7ovxFN/PlM/Bbk8MRGPossQ==
dependencies:
"@babel/runtime" "^7.4.5"
browser-lang "^0.0.1"
intl "^1.2.5"
react "^16.8.6"
react-intl "^2.9.0"

gatsby-plugin-mailchimp@^5.1.0:
version "5.1.0"
resolved "https://registry.npm.taobao.org/gatsby-plugin-mailchimp/download/gatsby-plugin-mailchimp-5.1.0.tgz#10e5235d0d807ec1bd681c8c0fa636f4a6064491"
Expand Down Expand Up @@ -7090,6 +7108,35 @@ internal-ip@^4.2.0:
default-gateway "^4.2.0"
ipaddr.js "^1.9.0"

intl-format-cache@^2.0.5:
version "2.2.9"
resolved "https://registry.yarnpkg.com/intl-format-cache/-/intl-format-cache-2.2.9.tgz#fb560de20c549cda20b569cf1ffb6dc62b5b93b4"
integrity sha512-Zv/u8wRpekckv0cLkwpVdABYST4hZNTDaX7reFetrYTJwxExR2VyTqQm+l0WmL0Qo8Mjb9Tf33qnfj0T7pjxdQ==

intl-messageformat-parser@1.4.0:
version "1.4.0"
resolved "https://registry.yarnpkg.com/intl-messageformat-parser/-/intl-messageformat-parser-1.4.0.tgz#b43d45a97468cadbe44331d74bb1e8dea44fc075"
integrity sha1-tD1FqXRoytvkQzHXS7Ho3qRPwHU=

intl-messageformat@^2.0.0, intl-messageformat@^2.1.0:
version "2.2.0"
resolved "https://registry.yarnpkg.com/intl-messageformat/-/intl-messageformat-2.2.0.tgz#345bcd46de630b7683330c2e52177ff5eab484fc"
integrity sha1-NFvNRt5jC3aDMwwuUhd/9eq0hPw=
dependencies:
intl-messageformat-parser "1.4.0"

intl-relativeformat@^2.1.0:
version "2.2.0"
resolved "https://registry.yarnpkg.com/intl-relativeformat/-/intl-relativeformat-2.2.0.tgz#6aca95d019ec8d30b6c5653b6629f9983ea5b6c5"
integrity sha512-4bV/7kSKaPEmu6ArxXf9xjv1ny74Zkwuey8Pm01NH4zggPP7JHwg2STk8Y3JdspCKRDriwIyLRfEXnj2ZLr4Bw==
dependencies:
intl-messageformat "^2.0.0"

intl@^1.2.5:
version "1.2.5"
resolved "https://registry.yarnpkg.com/intl/-/intl-1.2.5.tgz#82244a2190c4e419f8371f5aa34daa3420e2abde"
integrity sha1-giRKIZDE5Bn4Nx9ao02qNCDiq94=

into-stream@^3.1.0:
version "3.1.0"
resolved "https://registry.yarnpkg.com/into-stream/-/into-stream-3.1.0.tgz#96fb0a936c12babd6ff1752a17d05616abd094c6"
Expand All @@ -7098,7 +7145,7 @@ into-stream@^3.1.0:
from2 "^2.1.1"
p-is-promise "^1.1.0"

invariant@^2.0.0, invariant@^2.1.0, invariant@^2.2.0, invariant@^2.2.2, invariant@^2.2.3, invariant@^2.2.4:
invariant@^2.0.0, invariant@^2.1.0, invariant@^2.1.1, invariant@^2.2.0, invariant@^2.2.2, invariant@^2.2.3, invariant@^2.2.4:
version "2.2.4"
resolved "https://registry.yarnpkg.com/invariant/-/invariant-2.2.4.tgz#610f3c92c9359ce1db616e538008d23ff35158e6"
integrity sha512-phJfQVBuaJM5raOpJjSfkiD6BpbCE4Ns//LaXl6wGYtUBY83nWS6Rf9tXm2e8VaK60JEjYldbPif/A2B1C2gNA==
Expand Down Expand Up @@ -11118,6 +11165,17 @@ react-input-autosize@^2.2.1:
dependencies:
prop-types "^15.5.8"

react-intl@^2.9.0:
version "2.9.0"
resolved "https://registry.yarnpkg.com/react-intl/-/react-intl-2.9.0.tgz#c97c5d17d4718f1575fdbd5a769f96018a3b1843"
integrity sha512-27jnDlb/d2A7mSJwrbOBnUgD+rPep+abmoJE511Tf8BnoONIAUehy/U1zZCHGO17mnOwMWxqN4qC0nW11cD6rA==
dependencies:
hoist-non-react-statics "^3.3.0"
intl-format-cache "^2.0.5"
intl-messageformat "^2.1.0"
intl-relativeformat "^2.1.0"
invariant "^2.1.1"

react-is@16.8.5:
version "16.8.5"
resolved "https://registry.yarnpkg.com/react-is/-/react-is-16.8.5.tgz#c54ac229dd66b5afe0de5acbe47647c3da692ff8"
Expand Down Expand Up @@ -11350,7 +11408,7 @@ react-waypoint@^8.1.0:
prop-types "^15.0.0"
react-is "^16.6.3"

react@^16.8.2, react@^16.8.4:
react@^16.8.2, react@^16.8.4, react@^16.8.6:
version "16.8.6"
resolved "https://registry.yarnpkg.com/react/-/react-16.8.6.tgz#ad6c3a9614fd3a4e9ef51117f54d888da01f2bbe"
integrity sha512-pC0uMkhLaHm11ZSJULfOBqV4tIZkx87ZLvbbQYunNixAAvjnC+snJCg0XQXn9VIsttVsbZP/H/ewzgsd5fxKXw==
Expand Down