128 lines
4.1 KiB
JavaScript
128 lines
4.1 KiB
JavaScript
// Dependencies
|
|
import { serverSideTranslations } from 'next-i18next/serverSideTranslations'
|
|
// Hooks
|
|
import { useTranslation } from 'next-i18next'
|
|
// Components
|
|
import { PageWrapper, ns as pageNs } from 'shared/components/wrappers/page.mjs'
|
|
import { BareLayout as Layout } from 'site/components/layouts/bare.mjs'
|
|
import { TranslationStatus } from 'site/components/crowdin/status.mjs'
|
|
import { Translators } from 'site/components/crowdin/translators.mjs'
|
|
import { Popout } from 'shared/components/popout.mjs'
|
|
import { Breadcrumbs } from 'shared/components/breadcrumbs.mjs'
|
|
import Link from 'next/link'
|
|
|
|
// Translation namespaces used on this page
|
|
const namespaces = [...new Set(pageNs), 'translation', 'locales']
|
|
|
|
const TranslationPage = ({ page }) => {
|
|
const { t } = useTranslation(namespaces)
|
|
|
|
const title = t('translation:translation')
|
|
|
|
return (
|
|
<PageWrapper {...page} layout={Layout}>
|
|
<div className="max-w-4xl mx-auto p-4 mt-4">
|
|
<Breadcrumbs crumbs={[{ s: 'translation', t: title }]} title={title} />
|
|
|
|
<h1>{title}</h1>
|
|
<p>{t('translation:proudlyMultilingual')}</p>
|
|
|
|
<Popout tip>
|
|
<h5>{t('translation:getInvolved')}</h5>
|
|
<p>{t('translation:teamEffort')}</p>
|
|
<Link href="/translation/join" className="btn btn-accent mr-2">
|
|
{t('translation:joinTheTeam')}
|
|
</Link>
|
|
<a
|
|
href="https://freesewing.dev/guides/translation"
|
|
className="btn btn-accent btn-outline"
|
|
>
|
|
{t('translation:seeTranslationGuide')}
|
|
</a>
|
|
</Popout>
|
|
|
|
<h2 id="status">Translation Status</h2>
|
|
<TranslationStatus />
|
|
<b className="ml-10">Legend</b>
|
|
<ul className="list list-inside ml-4">
|
|
<li className="flex flex-row items-center gap-2">
|
|
<span className="inline-block w-4 h-4 rounded-full bg-primary"></span>
|
|
<span>{t('translation:translatedAndApproved')}</span>
|
|
</li>
|
|
<li className="flex flex-row items-center gap-2">
|
|
<span className="inline-block w-4 h-4 rounded-full bg-primary bg-opacity-70"></span>
|
|
<span>{t('translation:translatedOnly')}</span>
|
|
</li>
|
|
<li className="flex flex-row items-center gap-2">
|
|
<span className="inline-block w-4 h-4 rounded-full bg-primary bg-opacity-30"></span>
|
|
<span>{t('translation:notTranslated')}</span>
|
|
</li>
|
|
</ul>
|
|
<br />
|
|
|
|
<h2 id="team">Translation Team</h2>
|
|
<Translators />
|
|
|
|
<h2>Supported Languages</h2>
|
|
<p>We currently support the following five languages:</p>
|
|
<ul className="list list-inside list-disc ml-4">
|
|
<li>
|
|
<b>{t('locales:en')}</b>
|
|
<small> ({t('translation:defaultLanguage')}</small>
|
|
</li>
|
|
<li>
|
|
<b>{t('locales:nl')}</b>
|
|
</li>
|
|
<li>
|
|
<b>{t('locales:de')}</b>
|
|
</li>
|
|
<li>
|
|
<b>{t('locales:fr')}</b>
|
|
</li>
|
|
<li>
|
|
<b>{t('locales:es')}</b>
|
|
</li>
|
|
</ul>
|
|
<p>
|
|
In addition, comminity members have started initiatives to add the following langauges:
|
|
</p>
|
|
<ul className="list list-inside list-disc ml-4">
|
|
<li>
|
|
<b>{t('locales:uk')}</b>
|
|
</li>
|
|
</ul>
|
|
<Popout tip>
|
|
<h5>{t('translation:addLanguage1')}</h5>
|
|
<p>
|
|
{t('translation:addLanguage2')}
|
|
<br />
|
|
{t('translation:addLanguage3')}
|
|
</p>
|
|
<Link href="/translation/suggest-language" className="btn btn-accent mr-2">
|
|
{t('translation:suggestLanguage')}
|
|
</Link>
|
|
<a
|
|
href="https://freesewing.dev/guides/translation"
|
|
className="btn btn-accent btn-outline"
|
|
>
|
|
{t('translation:seeTranslationGuide')}
|
|
</a>
|
|
</Popout>
|
|
</div>
|
|
</PageWrapper>
|
|
)
|
|
}
|
|
|
|
export default TranslationPage
|
|
|
|
export async function getStaticProps({ locale }) {
|
|
return {
|
|
props: {
|
|
...(await serverSideTranslations(locale, namespaces)),
|
|
page: {
|
|
locale,
|
|
path: ['translation'],
|
|
},
|
|
},
|
|
}
|
|
}
|