// Dependencies
import { serverSideTranslations } from 'next-i18next/serverSideTranslations'
import { nsMerge } from 'shared/utils.mjs'
// Hooks
import { useTranslation } from 'next-i18next'
import { useAccount } from 'shared/hooks/use-account.mjs'
import { useEffect, useState } from 'react'
// Components
import Head from 'next/head'
import { PageWrapper, ns as pageNs } from 'shared/components/wrappers/page.mjs'
//import { PageLink } from 'shared/components/page-link.mjs'
import { BareLayout } from 'site/components/layouts/bare.mjs'
import { ForceAccountCheck } from 'shared/components/account/force-account-check.mjs'
import { OkIcon } from 'shared/components/icons.mjs'
import { FreeSewingAnimation } from 'shared/components/animations/freesewing.mjs'
import { HowDoesItWorkAnimation } from 'shared/components/animations/how-does-it-work.mjs'
import { SignUp } from 'shared/components/susi/sign-up.mjs'
import { Subscribe, ns as patronsNs } from 'shared/components/patrons/subscribe.mjs'
const ns = nsMerge(pageNs, patronsNs, 'common', 'homepage', 'signup', 'errors', 'patrons')
const BoldLink = ({ href, children }) => (
{children}
)
/*
* Each page MUST be wrapped in the PageWrapper component.
* You also MUST spread props.page into this wrapper component
* when path and locale come from static props (as here)
* or set them manually.
*/
const HomePage = ({ page }) => {
const { t } = useTranslation(ns)
const { account } = useAccount()
const [user, setUser] = useState(false)
// Duration of the FreeSewing animation
const duration = 6.66
useEffect(() => {
// Do this here to avoid hydration issues
if (account.username) setUser(account.username)
}, [account.username])
return (
FreeSewing.org
Why bother?
Free of charge.
No ads. No tracking. No nonsense.
Store your measurements sets and patterns.
Personalize your user experience.
One-click account removal.
{t('whatIsFreeSewing')}
{t('homepage:what1')}
{t('homepage:what3')}
{t('whatIsFreeSewingNot')}
{t('homepage:whatNot1')}
{t('homepage:whatNot2')}
{t('howDoesItWork')}
{user ? t('hiUsername', { username: user }) : t('hiFriend')}
👋