Add appWithTranslation HOC to pages
This commit is contained in:
parent
80089843a3
commit
62edc6ca5c
4 changed files with 52 additions and 4 deletions
|
|
@ -1,5 +1,6 @@
|
|||
import { useEffect } from 'react'
|
||||
import { useCookies, CookiesProvider } from 'react-cookie'
|
||||
import { appWithTranslation } from 'next-i18next'
|
||||
|
||||
import type { AppProps } from 'next/app'
|
||||
import Layout from '~components/Layout'
|
||||
|
|
@ -37,4 +38,4 @@ function MyApp({ Component, pageProps }: AppProps) {
|
|||
)
|
||||
}
|
||||
|
||||
export default MyApp
|
||||
export default appWithTranslation(MyApp)
|
||||
|
|
|
|||
|
|
@ -1,6 +1,8 @@
|
|||
import React from 'react'
|
||||
import Party from '~components/Party'
|
||||
|
||||
import { serverSideTranslations } from 'next-i18next/serverSideTranslations'
|
||||
|
||||
const NewRoute = () => {
|
||||
function callback(path: string) {
|
||||
// This is scuffed, how do we do this natively?
|
||||
|
|
@ -14,4 +16,13 @@ const NewRoute = () => {
|
|||
)
|
||||
}
|
||||
|
||||
export async function getStaticProps({ locale }: { locale: string }) {
|
||||
return {
|
||||
props: {
|
||||
...(await serverSideTranslations(locale, ['common'])),
|
||||
// Will be passed to the page component as props
|
||||
},
|
||||
}
|
||||
}
|
||||
|
||||
export default NewRoute
|
||||
|
|
@ -1,5 +1,6 @@
|
|||
import React from 'react'
|
||||
import { useRouter } from 'next/router'
|
||||
import { serverSideTranslations } from 'next-i18next/serverSideTranslations'
|
||||
|
||||
import Party from '~components/Party'
|
||||
|
||||
|
|
@ -30,4 +31,23 @@ const PartyRoute: React.FC = () => {
|
|||
// }
|
||||
}
|
||||
|
||||
export async function getStaticPaths() {
|
||||
return {
|
||||
paths: [
|
||||
// Object variant:
|
||||
{ params: { party: 'string' } },
|
||||
],
|
||||
fallback: true,
|
||||
}
|
||||
}
|
||||
|
||||
export async function getStaticProps({ locale }: { locale: string }) {
|
||||
return {
|
||||
props: {
|
||||
...(await serverSideTranslations(locale, ['common'])),
|
||||
// Will be passed to the page component as props
|
||||
},
|
||||
}
|
||||
}
|
||||
|
||||
export default PartyRoute
|
||||
|
|
@ -1,9 +1,15 @@
|
|||
import React, { useCallback, useEffect, useState } from 'react'
|
||||
import Head from 'next/head'
|
||||
|
||||
import { useRouter } from 'next/router'
|
||||
import { useCookies } from 'react-cookie'
|
||||
|
||||
import { useTranslation } from 'next-i18next'
|
||||
import { serverSideTranslations } from 'next-i18next/serverSideTranslations'
|
||||
|
||||
import clonedeep from 'lodash.clonedeep'
|
||||
|
||||
|
||||
import api from '~utils/api'
|
||||
|
||||
import GridRep from '~components/GridRep'
|
||||
|
|
@ -12,6 +18,7 @@ import FilterBar from '~components/FilterBar'
|
|||
|
||||
const TeamsRoute: React.FC = () => {
|
||||
const router = useRouter()
|
||||
const { t } = useTranslation('common')
|
||||
|
||||
// Cookies
|
||||
const [cookies] = useCookies(['account'])
|
||||
|
|
@ -148,7 +155,7 @@ const TeamsRoute: React.FC = () => {
|
|||
return (
|
||||
<div id="Teams">
|
||||
<Head>
|
||||
<title>Discover Teams</title>
|
||||
<title>{ t('teams.title') }</title>
|
||||
|
||||
<meta property="og:title" content="Discover Teams" />
|
||||
<meta property="og:description" content="Find different Granblue Fantasy teams by raid, element or recency" />
|
||||
|
|
@ -161,7 +168,7 @@ const TeamsRoute: React.FC = () => {
|
|||
<meta name="twitter:description" content="Find different Granblue Fantasy teams by raid, element or recency" />
|
||||
</Head>
|
||||
<FilterBar onFilter={receiveFilters} scrolled={scrolled}>
|
||||
<h1>Discover Teams</h1>
|
||||
<h1>{t('teams.title')}</h1>
|
||||
</FilterBar>
|
||||
|
||||
<section>
|
||||
|
|
@ -188,7 +195,7 @@ const TeamsRoute: React.FC = () => {
|
|||
|
||||
{ (parties.length == 0) ?
|
||||
<div id="NotFound">
|
||||
<h2>{ (loading) ? 'Loading teams...' : 'No teams found' }</h2>
|
||||
<h2>{ (loading) ? t('teams.loading') : t('teams.not_found') }</h2>
|
||||
</div>
|
||||
: '' }
|
||||
</section>
|
||||
|
|
@ -196,4 +203,13 @@ const TeamsRoute: React.FC = () => {
|
|||
)
|
||||
}
|
||||
|
||||
export async function getStaticProps({ locale }: { locale: string }) {
|
||||
return {
|
||||
props: {
|
||||
...(await serverSideTranslations(locale, ['common'])),
|
||||
// Will be passed to the page component as props
|
||||
},
|
||||
}
|
||||
}
|
||||
|
||||
export default TeamsRoute
|
||||
Loading…
Reference in a new issue