theodesp

{
  "Gatsby I18next": "Gatsby I18next στα Ελληνικά",
  "Go back to the homepage": "Πήγαινε πίσω",
  "Go to page 2": "Πήγαινε στην σελίδα 2",
  "Hi from the second page": "Γιά σας από την πρώτη σελίδα",
  "Hi people": "Γειά σας φίλοι",
  "Now go build something great.": "Τώρα φτιάξτε κάτι εκπληκτικό.",
  "Welcome to page 2": "Καλωσήλθατε στην σελίδα 2",
  "Welcome to your new Gatsby site.": "Καλωσήλθατε στη νέα Ιστιοσελίδα μας",
  "This is Gatsby with I18next": "Αυτό είναι το Gatsby με I18next"

theodesp

import React from 'react';
import { graphql } from 'gatsby';
import { Translation } from 'react-i18next';
import { Link } from '@wapps/gatsby-plugin-i18next';
import { withI18next } from 'gatsby-plugin-i18next';

import Layout from '../components/layout';

const IndexPage = () => (
  <Translation>

theodesp

import React from 'react';
import { graphql } from 'gatsby';
import { Translation } from 'react-i18next';
import { Link } from '@wapps/gatsby-plugin-i18next';

import Layout from '../components/layout';

const SecondPage = () => (
  <Translation>
    {t => (

theodesp

import React from 'react';
import { graphql } from 'gatsby';
import { withTranslation } from 'react-i18next';
import {withI18next} from '@wapps/gatsby-plugin-i18next';

const NotFoundPage = ({ t }) => (
  <Layout>
    <h1>{t('NOT FOUND')}</h1>
    <p>{t('You just hit a route that doesn\'t exist... the sadness.')}</p>
  </Layout>

theodesp

import React from 'react';
import PropTypes from 'prop-types';
import { withTranslation } from 'react-i18next';
import { Head } from '@wapps/gatsby-plugin-i18next';
import { PhraseAppInitializer } from 'react-i18next-phraseapp';

import Header from './header';
import './layout.css';

const Layout = ({ children, data, t }) => (

theodesp

import React, { Component } from 'react';
import { I18nextProvider } from 'react-i18next';
import { I18nProvider } from '@wapps/gatsby-i18n';
import { PhraseAppProvider } from 'react-i18next-phraseapp';

import setupI18next from './setupI18next';

const withI18nextPhraseApp = (options = {}) => Comp => {
  class I18n extends Component {
    constructor(props) {

theodesp

import i18next from 'i18next';

function setupI18next(fallbackLng, i18nextOptions) {
  i18next.init({
    debug: false,
    defaultNS: 'messages',
    fallbackLng,
    react: {
      useSuspense: false,
    },

theodesp

<script
          dangerouslySetInnerHTML={{
            __html: `
             window.PHRASEAPP_ENABLED = true;
             window.PHRASEAPP_CONFIG = {
               projectId: <project_id>,
               prefix: "[[__",
               suffix: "__]]",
               fullReparse: true
             };

theodesp

import React from 'react';
import { graphql } from 'gatsby';
import { Translation } from 'react-i18next';
import { Link } from '@wapps/gatsby-plugin-i18next';
import withI18nextPhraseApp from '../i18n/with18next';

import Layout from '../components/layout';

const SecondPage = () => (
  <Translation>

theodesp

$ npm install react-i18next-phraseapp --save