// 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 { BareLayout } from 'site/components/layouts/bare.mjs' import { ForceAccountCheck } from 'shared/components/account/force-account-check.mjs' import { OkIcon, DesignIcon, ShowcaseIcon, DocsIcon, HelpIcon, ChatIcon, } 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 { PleaseSubscribe } from 'shared/components/patrons/please-subscribe.mjs' import Link from 'next/link' const ns = nsMerge(pageNs, 'patrons', 'common', 'homepage', 'signup', 'errors') const CardLink = ({ bg, textColor, href, title, text, icon }) => (

{icon} {title}

{text}

) /* * 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

{t('homepage:whyBother')}

    {[1, 2, 3, 4].map((i) => (
  • {t(`homepage:why${i}`)}
    • ))}

{t('whatIsFreeSewing')}

{t('homepage:what1')}

{t('homepage:what3')}

{t('whatIsFreeSewingNot')}

{t('homepage:whatNot1')}

{t('homepage:whatNot2')}

{t('howDoesItWork')}

} text="Browse our collection of designs, and turn them into sewing patterns that are made-to-measure just for you." /> } text="Get inspiration from the FreeSewing community, and see how others have applied their creativity to our designs." /> } text="FreeSewing.org is unlike any sewing pattern website you know. Read this short guide to get the most our of our platform." /> } text="Some of the questions that come up often when people discover our platform are answered here." />
} text="While we are all volunteers, we have a good track record of helping people. So don't be shy to reach out." />
) } export default HomePage export async function getStaticProps({ locale }) { return { props: { ...(await serverSideTranslations(locale, ns)), page: { locale, path: [], }, }, } }