Merge pull request #14 from coderbunker/translation-namespaces

[ADD] Translation namespaces

Author: carms-ng

gatsby-config.js

@@ -49,7 +49,7 @@ module.exports = {
         languages: [`en`, `fr`],
         defaultLanguage: `en`,
         // if you are using Helmet, you must include siteUrl, and make sure you add http:https
-        siteUrl: `https://example.com/`,
+        siteUrl: `https://coderbunker.ca/`,
         // you can pass any i18next options
         i18nextOptions: {
           interpolation: {

locales/en/translation.json

@@ -1,13 +1,5 @@
 {
   "Home": "Accueil",
-  "Hi people": "Bonjour!",
-  "Welcome to your new Gatsby site.": "Bienvenue à votre site Gatsby.",
-  "Now go build something great.": "Allez bâtir quelque chose d'extraordinaire.",
-  "Go to page 2": "Allez à la page 2",
-  "Page two": "Page deux",
-  "Hi from the second page": "Salut de page deux",
-  "Welcome to page 2": "Bienvenue à la page deux",
-  "Go back to the homepage": "Retour à la Maison",
   "Introducing Coderbunker in the ": "Présentation de Coderbunker dans le ",
   "North": "Nord",
   "We empower freelancer community to excel in long term projects.": "Nous permettons à une communauté des pigistes d'exceller dans les projets à long terme.",
@@ -24,14 +16,6 @@
   "Connect": "Connectez-vous",
   " With Us": " avec nous",
   "We fuel your tech capability with our network of freelancers.": "Nous alimentons votre capacité technologique avec notre réseau de pigistes.",
-  "25 years experience in software development": "25 ans d'expérience dans le développement de logiciels",
-  "System Administrator": "Administrateur Système",
-  "Background in university research (quantum chemistry, attosecond science)": "Expérience en recherche universitaire (Chimie Quantique, science attoseconde)",
-  "5 years of experience in software development": "5 ans d'expérience en développement logiciel",
-  "Prototyping, agility, design, R&D": "Prototypage, agilité, design, R&D",
-  "Python, Bash, Javascript, C/C++, Fortran": "Python, Bash, Javascript, C/C++, Fortran",
-  "Devops (Linux, Ansible, Cloud, Docker)": "Devops (Linux, Ansible, Cloud, Docker)",
-  "Data analysis": "Analyse de données",
   "Have a Project? Interested in Joining Force?": "Vous avez un projet? Vous êtes intéressés à vous joindre à nous?",
   "We strive to raise the bar of technical expertise.": "Nous élevons la barre de l'expertise technique",
   "We keep it simple.": "Nous favorisons la simplicité",
@@ -40,5 +24,9 @@
   "Assemble the team based on your problem. Convert dollars to value right away.": "Assemblez une équipe rapidement basé sur vos défis. Convertissez rapidement des dollars en valeur",
   "Iteratively develop": "Développement itératif",
   "Continual improvement to develop a tailored. sustainable and scalable solution.": "Amélioration constante pour développer des solutions durables et évolutives",
-  "We are 50+ International Digital Talents and growing!": "Nous sommes 50+ talents digital international et en croissance"
+  "We are 50+ International Digital Talents and growing!": "Nous sommes 50+ talents digital international et en croissance",
+  "Name": "Nom",
+  "Email": "Courriel",
+  "Message": "Message",
+  "Send": "Envoyer"
 }

locales/fr/translation.json renamed to locales/fr/index.json

@@ -0,0 +1,10 @@
+{
+  "25 years experience in software development": "25 ans d'expérience dans le développement de logiciels",
+  "System Administrator": "Administrateur Système",
+  "Background in university research (quantum chemistry, attosecond science)": "Expérience en recherche universitaire (Chimie Quantique, science attoseconde)",
+  "5 years of experience in software development": "5 ans d'expérience en développement logiciel",
+  "Prototyping, agility, design, R&D": "Prototypage, agilité, design, R&D",
+  "Python, Bash, Javascript, C/C++, Fortran": "Python, Bash, Javascript, C/C++, Fortran",
+  "Devops (Linux, Ansible, Cloud, Docker)": "Devops (Linux, Ansible, Cloud, Docker)",
+  "Data analysis": "Analyse de données"
+}

locales/fr/team.fr.json

@@ -8,7 +8,7 @@ export default function Carousel() {
 
   // query all team pics
   const data = useStaticQuery(graphql`{
-  allFile(filter: {absolutePath: {regex: "/team/"}}, sort: {fields: base}) {
+  allFile(filter: {absolutePath: {regex: "/portraits/"}}, sort: {fields: base}) {
     edges {
       node {
         base

src/assets/images/team/001_ricky_ng_adam.jpg renamed to src/assets/images/portraits/001_ricky_ng_adam.jpg

@@ -1,5 +1,5 @@
 import React, { useState, useEffect } from "react"
-import { Trans } from 'gatsby-plugin-react-i18next';
+import { Trans, useTranslation } from 'gatsby-plugin-react-i18next';
 import styled from 'styled-components';
 
 import { AiOutlineMail } from 'react-icons/ai';
@@ -81,9 +81,10 @@ export default function ContactForm() {
         document.documentElement.style.setProperty("scroll-snap-type", "y mandatory")
       })
     }
-
   }
 
+  const {t} = useTranslation();
+
   return (
     <ContactFormStyles
       onSubmit={handleSubmit}
@@ -130,14 +131,14 @@ export default function ContactForm() {
       <textarea
         name="message"
         rows="3"
-        placeholder="Message"
+        placeholder={t('Message')}
         className="mb-2 md:mb-4"
         onFocus={handleFocus}
         onChange={handleChange}
         value={formState.message}
       />
       <input type="hidden" name="form-name" value="contact" />
-      <ButtonRed dataAos="fade-right" dataAosDelay="200" type="submit" text="Send" style={{ float: `right` }} />
+      <ButtonRed dataAos="fade-right" dataAosDelay="200" type="submit" text={t('Send')} style={{ float: `right` }} />
     </ContactFormStyles>
   )
 }

src/assets/images/team/002_jeremy_viau_trudel.jpg renamed to src/assets/images/portraits/002_jeremy_viau_trudel.jpg

@@ -5,7 +5,7 @@ import { GatsbyImage } from "gatsby-plugin-image";
 export default function StackedAvatar() {
   // query all team pics
   const data = useStaticQuery(graphql`{
-    allFile(filter: {absolutePath: {regex: "/team/"}}, sort: {fields: base}) {
+    allFile(filter: {absolutePath: {regex: "/portraits/"}}, sort: {fields: base}) {
       edges {
         node {
           base

src/components/carousel.js

@@ -35,7 +35,7 @@ export default function IndexPage() {
 
 export const query = graphql`
   query($language: String!) {
-    locales: allLocale(filter: {language: {eq: $language}}) {
+    locales: allLocale(filter: {ns: {in: ["index", "team.fr"]}, language: {eq: $language}}) {
       edges {
         node {
           ns