VSinerva/freesewing
1
0
Fork 0
Code Activity

chore(org): Updates to welcome pages

Browse source
This commit is contained in:
joostdecock 2023-08-25 18:48:34 +02:00
parent 295fbf1b34
commit 831963903a
7 changed files with 45 additions and 84 deletions
Download patch file Download diff file Expand all files Collapse all files

13
sites/org/pages/welcome/bio.mjs
View file

@ -6,6 +6,7 @@ import { PageWrapper, ns as pageNs } from 'shared/components/wrappers/page.mjs'
import { BareLayout } from 'site/components/layouts/bare.mjs' import { BareLayout } from 'site/components/layouts/bare.mjs'
import { ns as authNs } from 'shared/components/wrappers/auth/index.mjs' import { ns as authNs } from 'shared/components/wrappers/auth/index.mjs'
import { ns as bioNs } from 'shared/components/account/bio.mjs' import { ns as bioNs } from 'shared/components/account/bio.mjs'
import { WelcomeWrapper } from './index.mjs'
// Translation namespaces used on this page // Translation namespaces used on this page
const namespaces = [...new Set([...bioNs, ...authNs, ...pageNs])] const namespaces = [...new Set([...bioNs, ...authNs, ...pageNs])]
@ -14,10 +15,6 @@ const namespaces = [...new Set([...bioNs, ...authNs, ...pageNs])]
* Some things should never generated as SSR * Some things should never generated as SSR
* So for these, we run a dynamic import and disable SSR rendering * So for these, we run a dynamic import and disable SSR rendering
*/ */
const DynamicAuthWrapper = dynamic(
() => import('shared/components/wrappers/auth/index.mjs').then((mod) => mod.AuthWrapper),
{ ssr: false }
)
const DynamicBio = dynamic( const DynamicBio = dynamic(
() => import('shared/components/account/bio.mjs').then((mod) => mod.BioSettings), () => import('shared/components/account/bio.mjs').then((mod) => mod.BioSettings),
{ ssr: false } { ssr: false }
@ -31,11 +28,9 @@ const DynamicBio = dynamic(
*/ */
const WelcomeBioPage = ({ page }) => ( const WelcomeBioPage = ({ page }) => (
<PageWrapper {...page} layout={BareLayout} footer={false}> <PageWrapper {...page} layout={BareLayout} footer={false}>
<DynamicAuthWrapper> <WelcomeWrapper>
<div className="m-auto max-w-lg text-center lg:mt-4 p-8"> <DynamicBio title welcome />
<DynamicBio title welcome /> </WelcomeWrapper>
</div>
</DynamicAuthWrapper>
</PageWrapper> </PageWrapper>
) )

13
sites/org/pages/welcome/compare.mjs
View file

@ -6,6 +6,7 @@ import { PageWrapper, ns as pageNs } from 'shared/components/wrappers/page.mjs'
import { BareLayout } from 'site/components/layouts/bare.mjs' import { BareLayout } from 'site/components/layouts/bare.mjs'
import { ns as authNs } from 'shared/components/wrappers/auth/index.mjs' import { ns as authNs } from 'shared/components/wrappers/auth/index.mjs'
import { ns as compareNs } from 'shared/components/account/compare.mjs' import { ns as compareNs } from 'shared/components/account/compare.mjs'
import { WelcomeWrapper } from './index.mjs'
// Translation namespaces used on this page // Translation namespaces used on this page
const namespaces = [...new Set([...compareNs, ...authNs, ...pageNs])] const namespaces = [...new Set([...compareNs, ...authNs, ...pageNs])]
@ -14,10 +15,6 @@ const namespaces = [...new Set([...compareNs, ...authNs, ...pageNs])]
* Some things should never generated as SSR * Some things should never generated as SSR
* So for these, we run a dynamic import and disable SSR rendering * So for these, we run a dynamic import and disable SSR rendering
*/ */
const DynamicAuthWrapper = dynamic(
() => import('shared/components/wrappers/auth/index.mjs').then((mod) => mod.AuthWrapper),
{ ssr: false }
)
const DynamicCompare = dynamic( const DynamicCompare = dynamic(
() => import('shared/components/account/compare.mjs').then((mod) => mod.CompareSettings), () => import('shared/components/account/compare.mjs').then((mod) => mod.CompareSettings),
{ ssr: false } { ssr: false }
@ -31,11 +28,9 @@ const DynamicCompare = dynamic(
*/ */
const WelcomeComparePage = ({ page }) => ( const WelcomeComparePage = ({ page }) => (
<PageWrapper {...page} layout={BareLayout} footer={false}> <PageWrapper {...page} layout={BareLayout} footer={false}>
<DynamicAuthWrapper> <WelcomeWrapper>
<div className="m-auto max-w-lg text-center lg:mt-4 p-8"> <DynamicCompare title welcome />
<DynamicCompare title welcome /> </WelcomeWrapper>
</div>
</DynamicAuthWrapper>
</PageWrapper> </PageWrapper>
) )

25
sites/org/pages/welcome/img.mjs
View file

@ -8,6 +8,7 @@ import { PageWrapper, ns as pageNs } from 'shared/components/wrappers/page.mjs'
import { BareLayout } from 'site/components/layouts/bare.mjs' import { BareLayout } from 'site/components/layouts/bare.mjs'
import { ns as authNs } from 'shared/components/wrappers/auth/index.mjs' import { ns as authNs } from 'shared/components/wrappers/auth/index.mjs'
import { ns as imgNs } from 'shared/components/account/img.mjs' import { ns as imgNs } from 'shared/components/account/img.mjs'
import { WelcomeWrapper } from './index.mjs'
// Translation namespaces used on this page // Translation namespaces used on this page
const namespaces = [...new Set([...imgNs, ...authNs, ...pageNs])] const namespaces = [...new Set([...imgNs, ...authNs, ...pageNs])]
@ -16,10 +17,6 @@ const namespaces = [...new Set([...imgNs, ...authNs, ...pageNs])]
* Some things should never generated as SSR * Some things should never generated as SSR
* So for these, we run a dynamic import and disable SSR rendering * So for these, we run a dynamic import and disable SSR rendering
*/ */
const DynamicAuthWrapper = dynamic(
() => import('shared/components/wrappers/auth/index.mjs').then((mod) => mod.AuthWrapper),
{ ssr: false }
)
const DynamicImg = dynamic( const DynamicImg = dynamic(
() => import('shared/components/account/img.mjs').then((mod) => mod.ImgSettings), () => import('shared/components/account/img.mjs').then((mod) => mod.ImgSettings),
{ ssr: false } { ssr: false }
@ -31,19 +28,13 @@ const DynamicImg = dynamic(
* when path and locale come from static props (as here) * when path and locale come from static props (as here)
* or set them manually. * or set them manually.
*/ */
const WelcomeImgPage = ({ page }) => { const WelcomeImgPage = ({ page }) => (
const { t } = useTranslation(namespaces) <PageWrapper {...page} layout={BareLayout} footer={false}>
<WelcomeWrapper>
return ( <DynamicImg title welcome />
<PageWrapper {...page} title={t('imgTitle')} layout={BareLayout} footer={false}> </WelcomeWrapper>
<DynamicAuthWrapper> </PageWrapper>
<div className="m-auto max-w-lg text-center lg:mt-4 p-8"> )
<DynamicImg title welcome />
</div>
</DynamicAuthWrapper>
</PageWrapper>
)
}
export default WelcomeImgPage export default WelcomeImgPage

14
sites/org/pages/welcome/index.mjs
View file

@ -23,6 +23,12 @@ const DynamicControl = dynamic(
{ ssr: false } { ssr: false }
) )
export const WelcomeWrapper = ({ children }) => (
<DynamicAuthWrapper>
<div className="m-auto max-w-2xl lg:mt-24 p-8">{children}</div>
</DynamicAuthWrapper>
)
/* /*
* Each page MUST be wrapped in the PageWrapper component. * Each page MUST be wrapped in the PageWrapper component.
* You also MUST spread props.page into this wrapper component * You also MUST spread props.page into this wrapper component
@ -31,11 +37,9 @@ const DynamicControl = dynamic(
*/ */
const WelcomePage = ({ page }) => ( const WelcomePage = ({ page }) => (
<PageWrapper {...page} layout={BareLayout} footer={false}> <PageWrapper {...page} layout={BareLayout} footer={false}>
<DynamicAuthWrapper> <WelcomeWrapper>
<div className="m-auto max-w-lg text-center lg:mt-4 p-8"> <DynamicControl title welcome />
<DynamicControl title welcome /> </WelcomeWrapper>
</div>
</DynamicAuthWrapper>
</PageWrapper> </PageWrapper>
) )

26
sites/org/pages/welcome/newsletter.mjs
View file

@ -8,6 +8,7 @@ import { PageWrapper, ns as pageNs } from 'shared/components/wrappers/page.mjs'
import { BareLayout } from 'site/components/layouts/bare.mjs' import { BareLayout } from 'site/components/layouts/bare.mjs'
import { ns as authNs } from 'shared/components/wrappers/auth/index.mjs' import { ns as authNs } from 'shared/components/wrappers/auth/index.mjs'
import { ns as newsletterNs } from 'shared/components/account/newsletter.mjs' import { ns as newsletterNs } from 'shared/components/account/newsletter.mjs'
import { WelcomeWrapper } from './index.mjs'
// Translation namespaces used on this page // Translation namespaces used on this page
const namespaces = [...new Set([...newsletterNs, ...authNs, ...pageNs])] const namespaces = [...new Set([...newsletterNs, ...authNs, ...pageNs])]
@ -16,11 +17,6 @@ const namespaces = [...new Set([...newsletterNs, ...authNs, ...pageNs])]
* Some things should never generated as SSR * Some things should never generated as SSR
* So for these, we run a dynamic import and disable SSR rendering * So for these, we run a dynamic import and disable SSR rendering
*/ */
const DynamicAuthWrapper = dynamic(
() => import('shared/components/wrappers/auth/index.mjs').then((mod) => mod.AuthWrapper),
{ ssr: false }
)
const DynamicNewsletter = dynamic( const DynamicNewsletter = dynamic(
() => import('shared/components/account/newsletter.mjs').then((mod) => mod.NewsletterSettings), () => import('shared/components/account/newsletter.mjs').then((mod) => mod.NewsletterSettings),
{ ssr: false } { ssr: false }
@ -32,19 +28,13 @@ const DynamicNewsletter = dynamic(
* when path and locale come from static props (as here) * when path and locale come from static props (as here)
* or set them manually. * or set them manually.
*/ */
const WelcomeNewsletterPage = ({ page }) => { const WelcomeNewsletterPage = ({ page }) => (
const { t } = useTranslation(namespaces) <PageWrapper {...page} layout={BareLayout} footer={false}>
<WelcomeWrapper>
return ( <DynamicNewsletter title welcome />
<PageWrapper {...page} title={t('title')} layout={BareLayout} footer={false}> </WelcomeWrapper>
<DynamicAuthWrapper> </PageWrapper>
<div className="m-auto max-w-lg text-center lg:mt-4 p-8"> )
<DynamicNewsletter title welcome />
</div>
</DynamicAuthWrapper>
</PageWrapper>
)
}
export default WelcomeNewsletterPage export default WelcomeNewsletterPage

13
sites/org/pages/welcome/units.mjs
View file

@ -6,6 +6,7 @@ import { PageWrapper, ns as pageNs } from 'shared/components/wrappers/page.mjs'
import { BareLayout } from 'site/components/layouts/bare.mjs' import { BareLayout } from 'site/components/layouts/bare.mjs'
import { ns as authNs } from 'shared/components/wrappers/auth/index.mjs' import { ns as authNs } from 'shared/components/wrappers/auth/index.mjs'
import { ns as imperialNs } from 'shared/components/account/imperial.mjs' import { ns as imperialNs } from 'shared/components/account/imperial.mjs'
import { WelcomeWrapper } from './index.mjs'
// Translation namespaces used on this page // Translation namespaces used on this page
const namespaces = [...new Set([...imperialNs, ...authNs, ...pageNs])] const namespaces = [...new Set([...imperialNs, ...authNs, ...pageNs])]
@ -14,10 +15,6 @@ const namespaces = [...new Set([...imperialNs, ...authNs, ...pageNs])]
* Some things should never generated as SSR * Some things should never generated as SSR
* So for these, we run a dynamic import and disable SSR rendering * So for these, we run a dynamic import and disable SSR rendering
*/ */
const DynamicAuthWrapper = dynamic(
() => import('shared/components/wrappers/auth/index.mjs').then((mod) => mod.AuthWrapper),
{ ssr: false }
)
const DynamicImperial = dynamic( const DynamicImperial = dynamic(
() => import('shared/components/account/imperial.mjs').then((mod) => mod.ImperialSettings), () => import('shared/components/account/imperial.mjs').then((mod) => mod.ImperialSettings),
{ ssr: false } { ssr: false }
@ -31,11 +28,9 @@ const DynamicImperial = dynamic(
*/ */
const WelcomeUnitsPage = ({ page }) => ( const WelcomeUnitsPage = ({ page }) => (
<PageWrapper {...page} layout={BareLayout} footer={false}> <PageWrapper {...page} layout={BareLayout} footer={false}>
<DynamicAuthWrapper> <WelcomeWrapper>
<div className="m-auto max-w-lg text-center lg:mt-4 p-8"> <DynamicImperial title welcome />
<DynamicImperial title welcome /> </WelcomeWrapper>
</div>
</DynamicAuthWrapper>
</PageWrapper> </PageWrapper>
) )

25
sites/org/pages/welcome/username.mjs
View file

@ -8,6 +8,7 @@ import { PageWrapper, ns as pageNs } from 'shared/components/wrappers/page.mjs'
import { BareLayout } from 'site/components/layouts/bare.mjs' import { BareLayout } from 'site/components/layouts/bare.mjs'
import { ns as authNs } from 'shared/components/wrappers/auth/index.mjs' import { ns as authNs } from 'shared/components/wrappers/auth/index.mjs'
import { ns as usernameNs } from 'shared/components/account/username.mjs' import { ns as usernameNs } from 'shared/components/account/username.mjs'
import { WelcomeWrapper } from './index.mjs'
// Translation namespaces used on this page // Translation namespaces used on this page
const namespaces = [...new Set([...usernameNs, ...authNs, ...pageNs])] const namespaces = [...new Set([...usernameNs, ...authNs, ...pageNs])]
@ -16,10 +17,6 @@ const namespaces = [...new Set([...usernameNs, ...authNs, ...pageNs])]
* Some things should never generated as SSR * Some things should never generated as SSR
* So for these, we run a dynamic import and disable SSR rendering * So for these, we run a dynamic import and disable SSR rendering
*/ */
const DynamicAuthWrapper = dynamic(
() => import('shared/components/wrappers/auth/index.mjs').then((mod) => mod.AuthWrapper),
{ ssr: false }
)
const DynamicUsername = dynamic( const DynamicUsername = dynamic(
() => import('shared/components/account/username.mjs').then((mod) => mod.UsernameSettings), () => import('shared/components/account/username.mjs').then((mod) => mod.UsernameSettings),
{ ssr: false } { ssr: false }
@ -31,19 +28,13 @@ const DynamicUsername = dynamic(
* when path and locale come from static props (as here) * when path and locale come from static props (as here)
* or set them manually. * or set them manually.
*/ */
const WelcomeUsernamePage = ({ page }) => { const WelcomeUsernamePage = ({ page }) => (
const { t } = useTranslation(namespaces) <PageWrapper {...page} layout={BareLayout} footer={false}>
<WelcomeWrapper>
return ( <DynamicUsername title welcome />
<PageWrapper {...page} title={t('title')} layout={BareLayout} footer={false}> </WelcomeWrapper>
<DynamicAuthWrapper> </PageWrapper>
<div className="m-auto max-w-lg text-center lg:mt-4 p-8"> )
<DynamicUsername title welcome />
</div>
</DynamicAuthWrapper>
</PageWrapper>
)
}
export default WelcomeUsernamePage export default WelcomeUsernamePage