// Dependencies
import { serverSideTranslations } from 'next-i18next/serverSideTranslations'
import { nsMerge } from 'shared/utils.mjs'
import { recentBlogPosts, BlogPreview } from 'site/pages/blog/index.mjs'
import { pages as blogPosts } from 'site/prebuild/blog.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,
NoIcon,
DesignIcon,
ShowcaseIcon,
DocsIcon,
HelpIcon,
ChatIcon,
NewsletterIcon,
FreeSewingIcon,
} from 'shared/components/icons.mjs'
import { HowDoesItWorkAnimation } from 'shared/components/animations/how-does-it-work.mjs'
import { SignUp, ns as susiNs } from 'shared/components/susi/sign-up.mjs'
import { PleaseSubscribe, ns as subNs } from 'shared/components/patrons/please-subscribe.mjs'
import { CardLink } from 'shared/components/link.mjs'
import { ns as nlNs } from 'shared/components/newsletter/index.mjs'
const ns = nsMerge(pageNs, subNs, susiNs, nlNs, 'homepage')
const Card = ({ bg = 'bg-base-200', textColor = 'text-base-content', title, children, icon }) => (
{title}
{icon}
{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)
useEffect(() => {
// Do this here to avoid hydration issues
if (account.username) setUser(account.username)
}, [account.username])
return (
FreeSewing.org
FreeSewing
{t('homepage:freePatterns')}
}
>
{t('homepage:what1')}
{t('homepage:what3')}
}
>
{t('homepage:whatNot1')}
{t('homepage:whatNot2')}
{!user && (
{t('homepage:whyBother')}
{[1, 2, 3, 4].map((i) => (
-
{t(`homepage:why${i}`)}
))}
)}
}
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={t('newsletter:subscribePitch')}
/>
}
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: [],
},
},
}
}