tabshift/payload
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fixes up remaining translation strings

Browse Source
This commit is contained in:
Jarrod Flesch
2024-01-16 12:15:09 -05:00
parent 13313028b5
commit b781e5cc88
28 changed files with 259 additions and 239 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
packages/next/src/pages/Account/Default/index.tsx
View File

@@ -56,7 +56,7 @@ export const DefaultAccount: React.FC<DefaultAccountViewProps> = (props) => {
return (
<React.Fragment>
{/* <Meta description={t('accountOfCurrentUser')} keywords={t('account')} title={t('account')} /> */}
{/* <Meta description={i18n.t('authentication:accountOfCurrentUser')} keywords={t('authentication:account')} title={t('authentication:account')} /> */}
{/* <LoadingOverlayToggle name="account" show={isLoading} type="withoutNav" /> */}
<OperationProvider operation="update">
<Form

15
packages/next/src/pages/CreateFirstUser/index.tsx
View File

@@ -29,8 +29,8 @@ export const generateMetadata = async ({
})
return meta({
title: t('createFirstUser'),
description: t('createFirstUser'),
title: t('authentication:createFirstUser'),
description: t('authentication:createFirstUser'),
keywords: t('general:create'),
config,
})
@@ -69,22 +69,19 @@ export const CreateFirstUser: React.FC<{
const fields = [
{
name: 'email',
label: 'Email Address',
// label: t('general:emailAddress'),
label: t('general:emailAddress'),
required: true,
type: 'email',
},
{
name: 'password',
label: 'Password',
// label: t('general:password'),
label: t('general:password'),
required: true,
type: 'password',
},
{
name: 'confirm-password',
label: 'Confirm Password',
// label: t('confirmPassword'),
label: t('authentication:confirmPassword'),
required: true,
type: 'confirmPassword',
},
@@ -103,7 +100,7 @@ export const CreateFirstUser: React.FC<{
return (
<MinimalTemplate className={baseClass}>
<h1>{t('general:welcome')}</h1>
<p>{t('beginCreateFirstUser')}</p>
<p>{t('authentication:beginCreateFirstUser')}</p>
<Form
action={`${serverURL}${api}/${userSlug}/first-register`}
method="POST"

2
packages/next/src/pages/Document/index.tsx
View File

@@ -15,7 +15,7 @@ import {
import type { EditViewProps } from '@payloadcms/ui'
import queryString from 'qs'
import { notFound } from 'next/navigation'
import { TFunction } from 'i18next'
import { TFunction } from '@payloadcms/translations'
import { AdminViewComponent } from 'payload/config'
import { getViewsFromConfig } from './getViewsFromConfig'
import type { DocumentPermissions } from 'payload/types'

46
packages/next/src/pages/ForgotPassword/index.tsx
View File

@@ -5,8 +5,8 @@ import { SanitizedConfig } from 'payload/types'
import Link from 'next/link'
import { initPage } from '../../utilities/initPage'
import { meta } from '../../utilities/meta'
import i18n from 'i18next'
import { Metadata } from 'next'
import { getNextT } from '../../utilities/getNextT'
const baseClass = 'forgot-password'
@@ -14,13 +14,18 @@ export const generateMetadata = async ({
config,
}: {
config: Promise<SanitizedConfig>
}): Promise<Metadata> =>
meta({
title: i18n.t('forgotPassword'),
description: i18n.t('forgotPassword'),
keywords: i18n.t('forgotPassword'),
}): Promise<Metadata> => {
const t = getNextT({
config: await config,
})
return meta({
title: t('authentication:forgotPassword'),
description: t('authentication:forgotPassword'),
keywords: t('authentication:forgotPassword'),
config,
})
}
export const ForgotPassword: React.FC<{
config: Promise<SanitizedConfig>
@@ -39,7 +44,7 @@ export const ForgotPassword: React.FC<{
// setHasSubmitted(true)
// },
// () => {
// toast.error(t('emailNotValid'))
// toast.error(i18n.t('authentication:emailNotValid'))
// },
// )
// }
@@ -68,8 +73,8 @@ export const ForgotPassword: React.FC<{
// if (hasSubmitted) {
// return (
// <MinimalTemplate className={baseClass}>
// <h1>{t('emailSent')}</h1>
// <p>{t('checkYourEmailForPasswordReset')}</p>
// <h1>{i18n.t('authentication:emailSent')}</h1>
// <p>{i18n.t('authentication:checkYourEmailForPasswordReset')}</p>
// </MinimalTemplate>
// )
// }
@@ -81,30 +86,17 @@ export const ForgotPassword: React.FC<{
// handleResponse={handleResponse}
method="POST"
>
<h1>
Forgot Password
{/* {t('forgotPassword')} */}
</h1>
<p>
Enter your email address and we will send you a link to reset your password.
{/* {t('forgotPasswordEmailInstructions')} */}
</p>
<h1>{i18n.t('authentication:forgotPassword')}</h1>
<p>{i18n.t('authentication:forgotPasswordEmailInstructions')}</p>
<Email
admin={{ autoComplete: 'email' }}
label="Email Address"
// label={t('general:emailAddress')}
label={i18n.t('general:emailAddress')}
name="email"
required
/>
<FormSubmit>
Submit
{/* {t('general:submit')} */}
</FormSubmit>
<FormSubmit>{i18n.t('general:submit')}</FormSubmit>
</Form>
<Link href={`${admin}/login`}>
Back to Login
{/* {t('backToLogin')} */}
</Link>
<Link href={`${admin}/login`}>{i18n.t('authentication:backToLogin')}</Link>
</MinimalTemplate>
)
}

24
packages/next/src/pages/Logout/LogoutClient.tsx
View File

@@ -1,7 +1,7 @@
'use client'
import React, { Fragment, useEffect } from 'react'
import { useAuth } from '../../../../ui/src/providers/Auth'
import { Button } from '@payloadcms/ui'
import { Button, useTranslation } from '@payloadcms/ui'
export const LogoutClient: React.FC<{
inactivity?: boolean
@@ -11,8 +11,8 @@ export const LogoutClient: React.FC<{
const { inactivity, adminRoute, redirect } = props
const [isLoggingOut, setIsLoggingOut] = React.useState<boolean | undefined>(undefined)
const [hasLoggedOut, setHasLoggedOut] = React.useState<boolean | undefined>(undefined)
const { logOut, user } = useAuth()
const { logOut } = useAuth()
const { t } = useTranslation()
useEffect(() => {
if (!isLoggingOut) {
@@ -24,18 +24,8 @@ export const LogoutClient: React.FC<{
if (isLoggingOut) {
return (
<Fragment>
{inactivity && (
<h2>
Logged Out Due To Inactivity
{/* {t('loggedOutInactivity')} */}
</h2>
)}
{!inactivity && (
<h2>
Logged Out Successfully
{/* {t('loggedOutSuccessfully')} */}
</h2>
)}
{inactivity && <h2>{t('authentication:loggedOutInactivity')}</h2>}
{!inactivity && <h2>{t('authentication:loggedOutSuccessfully')}</h2>}
<Button
buttonStyle="secondary"
el="link"
@@ -43,12 +33,12 @@ export const LogoutClient: React.FC<{
redirect && redirect.length > 0 ? `?redirect=${encodeURIComponent(redirect)}` : ''
}`}
>
Log Back In
{/* {t('logBackIn')} */}
{t('authentication:logBackIn')}
</Button>
</Fragment>
)
}
// TODO(i18n): needs translation in all languages
return <Fragment>Logging Out...</Fragment>
}

17
packages/next/src/pages/Logout/index.tsx
View File

@@ -3,10 +3,10 @@ import React from 'react'
import { MinimalTemplate, Button } from '@payloadcms/ui'
import { meta } from '../../utilities/meta'
import './index.scss'
import i18n from 'i18next'
import { Metadata } from 'next'
import { SanitizedConfig } from 'payload/types'
import { LogoutClient } from './LogoutClient'
import { getNextT } from '../../utilities/getNextT'
const baseClass = 'logout'
@@ -14,13 +14,18 @@ export const generateMetadata = async ({
config,
}: {
config: Promise<SanitizedConfig>
}): Promise<Metadata> =>
meta({
title: i18n.t('logout'),
description: `${i18n.t('logoutUser')}`,
keywords: `${i18n.t('logout')}`,
}): Promise<Metadata> => {
const t = getNextT({
config: await config,
})
return meta({
title: t('authentication:logout'),
description: `${t('authentication:logoutUser')}`,
keywords: `${t('authentication:logout')}`,
config,
})
}
export const Logout: React.FC<{
inactivity?: boolean

24
packages/next/src/pages/NotFound/index.tsx
View File

@@ -1,7 +1,7 @@
'use client'
import React from 'react'
import { Button, Gutter, useStepNav, useConfig } from '@payloadcms/ui'
import { Button, Gutter, useStepNav, useConfig, useTranslation } from '@payloadcms/ui'
// import Meta from '../../utilities/Meta'
import './index.scss'
@@ -13,6 +13,7 @@ const NotFound: React.FC<{
const { marginTop } = props
const { setStepNav } = useStepNav()
const { t } = useTranslation()
const {
routes: { admin },
@@ -21,7 +22,7 @@ const NotFound: React.FC<{
// useEffect(() => {
// setStepNav([
// {
// label: t('notFound'),
// label: t('general:notFound'),
// },
// ])
// }, [setStepNav, t])
@@ -33,22 +34,15 @@ const NotFound: React.FC<{
.join(' ')}
>
{/* <Meta
description={t('pageNotFound')}
keywords={`404 ${t('notFound')}`}
title={t('notFound')}
description={t('general:pageNotFound')}
keywords={`404 ${t('general:notFound')}`}
title={t('general:notFound')}
/> */}
<Gutter className={`${baseClass}__wrap`}>
<h1>
Nothing Found
{/* {t('nothingFound')} */}
</h1>
<p>
Sorry, we couldn't find what you were looking for.
{/* {t('sorryNotFound')} */}
</p>
<h1>{t('general:nothingFound')}</h1>
<p>{t('general:sorryNotFound')}</p>
<Button className={`${baseClass}__button`} el="link" to={`${admin}`}>
Back to Dashboard
{/* {t('backToDashboard')} */}
{t('general:backToDashboard')}
</Button>
</Gutter>
</div>

40
packages/next/src/pages/ResetPassword/index.tsx
View File

@@ -14,9 +14,9 @@ import './index.scss'
import { SanitizedConfig } from 'payload/types'
import Link from 'next/link'
import { initPage } from '../../utilities/initPage'
import i18n from 'i18next'
import { Metadata } from 'next'
import { meta } from '../../utilities/meta'
import { getNextT } from '../../utilities/getNextT'
const baseClass = 'reset-password'
@@ -24,19 +24,24 @@ export const generateMetadata = async ({
config,
}: {
config: Promise<SanitizedConfig>
}): Promise<Metadata> =>
meta({
title: i18n.t('resetPassword'),
description: i18n.t('resetPassword'),
keywords: i18n.t('resetPassword'),
}): Promise<Metadata> => {
const t = getNextT({
config: await config,
})
return meta({
title: t('authentication:resetPassword'),
description: t('authentication:resetPassword'),
keywords: t('authentication:resetPassword'),
config,
})
}
export const ResetPassword: React.FC<{
config: Promise<SanitizedConfig>
token: string
}> = async ({ config: configPromise, token }) => {
const { config, user } = await initPage({ configPromise })
const { config, user, i18n } = await initPage({ configPromise })
const {
admin: { logoutRoute, user: userSlug },
@@ -50,7 +55,7 @@ export const ResetPassword: React.FC<{
// history.push(`${admin}`)
// } else {
// history.push(`${admin}/login`)
// toast.success(t('general:updatedSuccessfully'), { autoClose: 3000 })
// toast.success(i18n.t('general:updatedSuccessfully'), { autoClose: 3000 })
// }
// }
@@ -58,10 +63,7 @@ export const ResetPassword: React.FC<{
return (
<MinimalTemplate className={baseClass}>
<div className={`${baseClass}__wrap`}>
<h1>
Already Logged In
{/* {t('alreadyLoggedIn')} */}
</h1>
<h1>{i18n.t('authentication:alreadyLoggedIn')}</h1>
<p>
<Translation
t={i18n.t}
@@ -73,8 +75,7 @@ export const ResetPassword: React.FC<{
</p>
<br />
<Button buttonStyle="secondary" el="link" to={admin}>
Back to Dashboard
{/* {t('general:backToDashboard')} */}
{i18n.t('general:backToDashboard')}
</Button>
</div>
</MinimalTemplate>
@@ -84,8 +85,7 @@ export const ResetPassword: React.FC<{
return (
<MinimalTemplate className={baseClass}>
<div className={`${baseClass}__wrap`}>
Reset Password
{/* <h1>{t('resetPassword')}</h1> */}
<h1>{i18n.t('authentication:resetPassword')}</h1>
<Form
action={`${serverURL}${api}/${userSlug}/reset-password`}
method="POST"
@@ -94,17 +94,13 @@ export const ResetPassword: React.FC<{
>
<Password
autoComplete="off"
label="New Password"
// label={t('newPassword')}
label={i18n.t('authentication:newPassword')}
name="password"
required
/>
<ConfirmPassword />
<HiddenInput name="token" value={token} />
<FormSubmit>
Reset Password
{/* {t('resetPassword')} */}
</FormSubmit>
<FormSubmit>{i18n.t('authentication:resetPassword')}</FormSubmit>
</Form>
</div>
</MinimalTemplate>

18
packages/next/src/pages/Unauthorized/UnauthorizedClient.tsx Normal file
View File

@@ -0,0 +1,18 @@
'use client'
import React from 'react'
import { Button, useTranslation } from '@payloadcms/ui'
export const UnauthorizedClient: React.FC<{ logoutRoute: string }> = ({ logoutRoute }) => {
const { t } = useTranslation()
return (
<>
<h2>{t('error:unauthorized')}</h2>
<p>{t('error:notAllowedToAccessPage')}</p>
<br />
<Button el="link" to={logoutRoute}>
{t('authentication:logOut')}
</Button>
</>
)
}

34
packages/next/src/pages/Unauthorized/index.tsx
View File

@@ -1,22 +1,28 @@
import React from 'react'
import { MinimalTemplate, Button } from '@payloadcms/ui'
import { MinimalTemplate } from '@payloadcms/ui'
import { SanitizedConfig } from 'payload/types'
import { meta } from '../../utilities/meta'
import { Metadata } from 'next'
import i18n from 'i18next'
import { getNextT } from '../../utilities/getNextT'
import { UnauthorizedClient } from './UnauthorizedClient'
export const generateMetadata = async ({
config,
}: {
config: Promise<SanitizedConfig>
}): Promise<Metadata> =>
meta({
title: i18n.t('error:unauthorized'),
description: i18n.t('error:unauthorized'),
keywords: i18n.t('error:unauthorized'),
}): Promise<Metadata> => {
const t = getNextT({
config: await config,
})
return meta({
title: t('error:unauthorized'),
description: t('error:unauthorized'),
keywords: t('error:unauthorized'),
config,
})
}
export const Unauthorized: React.FC<{
config: Promise<SanitizedConfig>
@@ -30,19 +36,7 @@ export const Unauthorized: React.FC<{
return (
<MinimalTemplate className="unauthorized">
<h2>
Unauthorized
{/* {t('error:unauthorized')} */}
</h2>
<p>
Not Allowed
{/* {t('error:notAllowedToAccessPage')} */}
</p>
<br />
<Button el="link" to={`${admin}${logoutRoute}`}>
Log out
{/* {t('authentication:logOut')} */}
</Button>
<UnauthorizedClient logoutRoute={`${admin}${logoutRoute}`} />
</MinimalTemplate>
)
}

29
packages/next/src/pages/Verify/index.tsx
View File

@@ -6,8 +6,8 @@ import { initPage } from '../../utilities/initPage'
import { SanitizedConfig } from 'payload/types'
import { redirect } from 'next/navigation'
import { Metadata } from 'next'
import i18n from 'i18next'
import { meta } from '../../utilities/meta'
import { getNextT } from '../../utilities/getNextT'
const baseClass = 'verify'
@@ -15,13 +15,18 @@ export const generateMetadata = async ({
config,
}: {
config: Promise<SanitizedConfig>
}): Promise<Metadata> =>
meta({
description: i18n.t('verifyUser'),
keywords: i18n.t('verify'),
title: i18n.t('verify'),
}): Promise<Metadata> => {
const t = getNextT({
config: await config,
})
return meta({
description: t('authentication:verifyUser'),
keywords: t('authentication:verify'),
title: t('authentication:verify'),
config,
})
}
export const Verify: React.FC<{
config: Promise<SanitizedConfig>
@@ -30,7 +35,7 @@ export const Verify: React.FC<{
config: configPromise,
// token
}) => {
const { config, user } = await initPage({ configPromise })
const { config, user, i18n } = await initPage({ configPromise })
const {
admin: { user: userSlug },
@@ -60,10 +65,9 @@ export const Verify: React.FC<{
}
const getText = () => {
return 'Verify'
// if (verifyResult?.status === 200) return t('verifiedSuccessfully')
// if (verifyResult?.status === 202) return t('alreadyActivated')
// return t('unableToVerify')
if (verifyResult?.status === 200) return i18n.t('authentication:verifiedSuccessfully')
if (verifyResult?.status === 202) return i18n.t('authentication:alreadyActivated')
return i18n.t('authentication:unableToVerify')
}
return (
@@ -74,8 +78,7 @@ export const Verify: React.FC<{
<h2>{getText()}</h2>
{verifyResult?.status === 200 && (
<Button buttonStyle="secondary" el="link" to={`${adminRoute}/login`}>
Login
{/* {t('login')} */}
{i18n.t('authentication:login')}
</Button>
)}
</MinimalTemplate>

18
packages/next/src/pages/Version/Default/index.tsx
View File

@@ -9,6 +9,7 @@ import fieldComponents from '../RenderFieldsToDiff/fields'
import Restore from '../Restore'
import './index.scss'
import { mostRecentVersionOption } from '../shared'
import { getTranslation } from '@payloadcms/translations'
const baseClass = 'view-version'
@@ -52,8 +53,7 @@ export const DefaultVersionView: React.FC<DefaultVersionsViewProps> = ({
docLabel = mostRecentDoc[useAsTitle]
}
} else {
docLabel = 'Untitled'
// docLabel = `[${t('general:untitled')}]`
docLabel = `[${i18n.t('general:untitled')}]`
}
} else {
docLabel = mostRecentDoc.id
@@ -62,9 +62,7 @@ export const DefaultVersionView: React.FC<DefaultVersionsViewProps> = ({
nav = [
{
label:
typeof collectionConfig.labels.plural === 'string' ? collectionConfig.labels.plural : '', // TODO: fix this (see below)
// label: getTranslation(collectionConfig.labels.plural, i18n),
label: getTranslation(collectionConfig.labels.plural, i18n),
url: `${admin}/collections/${collectionConfig.slug}`,
},
{
@@ -139,10 +137,9 @@ export const DefaultVersionView: React.FC<DefaultVersionsViewProps> = ({
<Gutter className={`${baseClass}__wrap`}>
<div className={`${baseClass}__header-wrap`}>
<p className={`${baseClass}__created-at`}>
Version Created On
{/* {t('versionCreatedOn', {
version: t(doc?.autosave ? 'autosavedVersion' : 'version'),
})} */}
{i18n.t('versionCreatedOn', {
version: i18n.t(doc?.autosave ? 'autosavedVersion' : 'version'),
})}
</p>
<header className={`${baseClass}__header`}>
<h2>{formattedCreatedAt}</h2>
@@ -184,6 +181,9 @@ export const DefaultVersionView: React.FC<DefaultVersionsViewProps> = ({
: []
}
version={doc?.version}
i18n={i18n}
locale={locale}
config={config}
/>
)}
</Gutter>

18
packages/next/src/pages/Version/RenderFieldsToDiff/fields/Iterable/index.tsx
View File

@@ -20,6 +20,8 @@ const Iterable: React.FC<Props & { field: ArrayField | BlockField }> = ({
locales,
permissions,
version,
i18n,
config,
}) => {
const versionRowCount = Array.isArray(version) ? version.length : 0
const comparisonRowCount = Array.isArray(comparison) ? comparison.length : 0
@@ -30,8 +32,7 @@ const Iterable: React.FC<Props & { field: ArrayField | BlockField }> = ({
{field.label && (
<Label>
{locale && <span className={`${baseClass}__locale-label`}>{locale}</span>}
{field.label}
{/* {getTranslation(field.label, i18n)} */}
{getTranslation(field.label, i18n)}
</Label>
)}
{maxRows > 0 && (
@@ -48,8 +49,7 @@ const Iterable: React.FC<Props & { field: ArrayField | BlockField }> = ({
subFields = [
{
name: 'blockType',
label: 'Block Type', // TODO: i18n
// label: t('fields:blockType'),
label: i18n.t('fields:blockType'),
type: 'text',
},
]
@@ -86,6 +86,9 @@ const Iterable: React.FC<Props & { field: ArrayField | BlockField }> = ({
)}
locales={locales}
version={versionRow}
i18n={i18n}
locale={locale}
config={config}
/>
</div>
)
@@ -94,12 +97,11 @@ const Iterable: React.FC<Props & { field: ArrayField | BlockField }> = ({
)}
{maxRows === 0 && (
<div className={`${baseClass}__no-rows`}>
No rows found
{/* {t('noRowsFound', {
{i18n.t('noRowsFound', {
label: field.labels?.plural
? getTranslation(field.labels?.plural, i18n)
: t('general:rows'),
})} */}
: i18n.t('general:rows'),
})}
</div>
)}
</div>

11
packages/next/src/pages/Version/RenderFieldsToDiff/fields/Nested/index.tsx
View File

@@ -19,17 +19,15 @@ const Nested: React.FC<Props & { field: FieldWithSubFields }> = ({
locales,
permissions,
version,
i18n,
config,
}) => {
// const { i18n } = useTranslation()
return (
<div className={baseClass}>
{field.label && (
<Label>
{locale && <span className={`${baseClass}__locale-label`}>{locale}</span>}
{field.label}
// TODO(i18n)
{/* {getTranslation(field.label, i18n)} */}
{getTranslation(field.label, i18n)}
</Label>
)}
<div
@@ -44,6 +42,9 @@ const Nested: React.FC<Props & { field: FieldWithSubFields }> = ({
fields={field.fields}
locales={locales}
version={version}
i18n={i18n}
locale={locale}
config={config}
/>
</div>
</div>

12
packages/next/src/pages/Version/RenderFieldsToDiff/fields/Relationship/index.tsx
View File

@@ -1,8 +1,6 @@
'use client'
import React from 'react'
import { getTranslation } from '@payloadcms/translations'
import ReactDiffViewer from 'react-diff-viewer-continued'
import { useTranslation } from '@payloadcms/ui'
import type { RelationshipField, SanitizedCollectionConfig } from 'payload/types'
import type { Props } from '../types'
@@ -10,7 +8,6 @@ import type { Props } from '../types'
import { fieldAffectsData, fieldIsPresentationalOnly } from 'payload/types'
import Label from '../../Label'
import { diffStyles } from '../styles'
import { useConfig, useLocale } from '@payloadcms/ui'
import './index.scss'
@@ -72,14 +69,13 @@ const Relationship: React.FC<Props & { field: RelationshipField }> = ({
comparison,
field,
version,
i18n,
locale,
config: { collections },
}) => {
const { collections } = useConfig()
const { i18n, t } = useTranslation()
const { code: locale } = useLocale()
let placeholder = ''
if (version === comparison) placeholder = `[${t('general:noValue')}]`
if (version === comparison) placeholder = `[${i18n.t('general:noValue')}]`
let versionToRender = version
let comparisonToRender = comparison

26
packages/next/src/pages/Version/RenderFieldsToDiff/fields/Select/index.tsx
View File

@@ -1,6 +1,4 @@
import type { i18n as Ii18n } from 'i18next'
import { getTranslation } from '@payloadcms/translations'
import { getTranslation, I18n } from '@payloadcms/translations'
import React from 'react'
import { DiffMethod } from 'react-diff-viewer-continued'
@@ -34,31 +32,21 @@ const getOptionsToRender = (
const getTranslatedOptions = (
options: (OptionObject | string)[] | OptionObject | string,
i18n: Ii18n,
i18n: I18n,
): string => {
if (Array.isArray(options)) {
return (
options
// TODO: fix this
// @ts-ignore-next-line
return options
.map((option) => (typeof option === 'string' ? option : getTranslation(option.label, i18n)))
.join(', ')
)
}
// TODO: fix this
// @ts-ignore-next-line
return typeof options === 'string' ? options : getTranslation(options.label, i18n)
}
const Select: React.FC<Props> = ({ comparison, diffMethod, field, locale, version }) => {
const Select: React.FC<Props> = ({ comparison, diffMethod, field, locale, version, i18n }) => {
let placeholder = ''
// const { i18n, t } = useTranslation('general')
const t = (key: string) => key // TODO
const i18n = {
options: {},
} as Ii18n // TODO
if (version === comparison) placeholder = `[${t('noValue')}]`
if (version === comparison) placeholder = `[${i18n.t('general:noValue')}]`
const comparisonToRender =
typeof comparison !== 'undefined'
@@ -73,8 +61,6 @@ const Select: React.FC<Props> = ({ comparison, diffMethod, field, locale, versio
<div className={baseClass}>
<Label>
{locale && <span className={`${baseClass}__locale-label`}>{locale}</span>}
{/* TODO: fix this
@ts-ignore-next-line */}
{getTranslation(field.label, i18n)}
</Label>
<DiffViewer

9
packages/next/src/pages/Version/RenderFieldsToDiff/fields/Tabs/index.tsx
View File

@@ -15,6 +15,9 @@ const Tabs: React.FC<Props & { field: TabsField }> = ({
locales,
permissions,
version,
i18n,
config,
locale,
}) => (
<div className={baseClass}>
<div className={`${baseClass}__wrap`}>
@@ -29,6 +32,9 @@ const Tabs: React.FC<Props & { field: TabsField }> = ({
locales={locales}
permissions={permissions}
version={version?.[tab.name]}
i18n={i18n}
config={config}
locale={locale}
/>
)
}
@@ -42,6 +48,9 @@ const Tabs: React.FC<Props & { field: TabsField }> = ({
key={i}
locales={locales}
version={version}
i18n={i18n}
config={config}
locale={locale}
/>
)
})}

8
packages/next/src/pages/Version/RenderFieldsToDiff/fields/Text/index.tsx
View File

@@ -17,12 +17,11 @@ const Text: React.FC<Props> = ({
isRichText = false,
locale,
version,
i18n,
}) => {
let placeholder = ''
const t = (key: string) => key // TODO
const i18n = {} // TODO
if (version === comparison) placeholder = `[${t('noValue')}]`
if (version === comparison) placeholder = `[${i18n.t('general:noValue')}]`
let versionToRender = version
let comparisonToRender = comparison
@@ -37,8 +36,7 @@ const Text: React.FC<Props> = ({
<Label>
{locale && <span className={`${baseClass}__locale-label`}>{locale}</span>}
{typeof field.label === 'string' ? field.label : '[field-label]' /* TODO */}
// TODO(i18n)
{/* {getTranslation(field.label, i18n)} */}
{getTranslation(field.label, i18n)}
</Label>
<DiffViewer
comparisonToRender={comparisonToRender}

6
packages/next/src/pages/Version/RenderFieldsToDiff/fields/types.ts
View File

@@ -2,6 +2,8 @@ import type React from 'react'
import type { DiffMethod } from 'react-diff-viewer-continued'
import type { FieldPermissions } from 'payload/auth'
import type { I18n } from '@payloadcms/translations'
import { SanitizedConfig } from 'payload/types'
export type FieldComponents = Record<string, React.FC<Props>>
@@ -12,8 +14,10 @@ export type Props = {
field: any
fieldComponents: FieldComponents
isRichText?: boolean
locale?: string
locale: string
locales?: string[]
permissions?: Record<string, FieldPermissions>
version: any
i18n: I18n
config: SanitizedConfig
}

14
packages/next/src/pages/Version/RenderFieldsToDiff/index.tsx
View File

@@ -18,6 +18,9 @@ const RenderFieldsToDiff: React.FC<Props> = ({
fields,
locales,
version,
i18n,
locale,
config,
}) => {
return (
<div className={baseClass}>
@@ -60,6 +63,8 @@ const RenderFieldsToDiff: React.FC<Props> = ({
locales={locales}
permissions={subFieldPermissions}
version={versionLocaleValue}
i18n={i18n}
config={config}
/>
</div>
</div>
@@ -80,6 +85,9 @@ const RenderFieldsToDiff: React.FC<Props> = ({
locales={locales}
permissions={subFieldPermissions}
version={versionValue}
i18n={i18n}
locale={locale}
config={config}
/>
</div>
)
@@ -96,6 +104,9 @@ const RenderFieldsToDiff: React.FC<Props> = ({
key={i}
locales={locales}
version={version}
i18n={i18n}
locale={locale}
config={config}
/>
)
}
@@ -112,6 +123,9 @@ const RenderFieldsToDiff: React.FC<Props> = ({
locales={locales}
permissions={fieldPermissions}
version={version}
i18n={i18n}
locale={locale}
config={config}
/>
)
}

6
packages/next/src/pages/Version/RenderFieldsToDiff/types.ts
View File

@@ -1,6 +1,7 @@
import type { FieldPermissions } from 'payload/auth'
import type { Field } from 'payload/types'
import type { Field, SanitizedConfig } from 'payload/types'
import type { FieldComponents } from './fields/types'
import type { I18n } from '@payloadcms/translations'
export type Props = {
comparison: Record<string, any>
@@ -9,4 +10,7 @@ export type Props = {
fields: Field[]
locales: string[]
version: Record<string, any>
i18n: I18n
config: SanitizedConfig
locale: string
}

27
packages/next/src/pages/Versions/index.tsx
View File

@@ -6,12 +6,13 @@ import {
PerPage,
Table,
SetDocumentStepNav as SetStepNav,
EditViewProps,
} from '@payloadcms/ui'
import { buildVersionColumns } from './columns'
import './index.scss'
import { EditViewProps } from '@payloadcms/ui'
import { notFound } from 'next/navigation'
import { getTranslation } from '@payloadcms/translations'
const baseClass = 'versions'
@@ -58,7 +59,7 @@ export const VersionsView: React.FC<EditViewProps> = async (props) => {
}
docURL = `${serverURL}${api}/${slug}/${id}`
// entityLabel = getTranslation(collectionConfig.labels.singular, i18n)
entityLabel = getTranslation(collectionConfig.labels.singular, i18n)
editURL = `${admin}/collections/${collectionSlug}/${id}`
}
@@ -85,7 +86,7 @@ export const VersionsView: React.FC<EditViewProps> = async (props) => {
}
docURL = `${serverURL}${api}/globals/${globalSlug}`
// entityLabel = getTranslation(globalConfig.label, i18n)
entityLabel = getTranslation(globalConfig.label, i18n)
editURL = `${admin}/globals/${globalSlug}`
}
@@ -108,24 +109,28 @@ export const VersionsView: React.FC<EditViewProps> = async (props) => {
globalSlug={globalConfig?.slug}
id={id}
isEditing
view="Versions" // TODO; i18n
pluralLabel={collectionConfig?.labels?.plural}
// view={t('versions')}
view={i18n.t('version:versions')}
/>
{/* <LoadingOverlayToggle name="versions" show={isLoadingVersions} /> */}
<main className={baseClass}>
{/* <Meta description={metaDesc} title={metaTitle} /> */}
<Gutter className={`${baseClass}__wrap`}>
{versionCount === 0 && (
<div className={`${baseClass}__no-versions`}>{/* {t('noFurtherVersionsFound')} */}</div>
<div className={`${baseClass}__no-versions`}>
{i18n.t('version:noFurtherVersionsFound')}
</div>
)}
{versionCount > 0 && (
<React.Fragment>
{/* <div className={`${baseClass}__version-count`}>
{t(versionCount === 1 ? 'versionCount_one' : 'versionCount_many', {
<div className={`${baseClass}__version-count`}>
{i18n.t(
versionCount === 1 ? 'version:versionCount_one' : 'version:versionCount_many',
{
count: versionCount,
})}
</div> */}
},
)}
</div>
<Table
columns={buildVersionColumns({
config,
@@ -154,7 +159,7 @@ export const VersionsView: React.FC<EditViewProps> = async (props) => {
{versionsData.totalPages > 1 && versionsData.totalPages !== versionsData.page
? versionsData.limit * versionsData.page
: versionsData.totalDocs}{' '}
{/* {t('of')} {versionsData.totalDocs} */}
{i18n.t('general:of')} {versionsData.totalDocs}
</div>
<PerPage
limit={limit ? Number(limit) : 10}

22
packages/payload/src/fields/validations.ts
View File

@@ -181,15 +181,15 @@ const validateArrayLength: any = (
if (!required && arrayLength === 0) return true
if (minRows && arrayLength < minRows) {
return t('validation:requiresAtLeast', { count: minRows, label: t('rows') })
return t('validation:requiresAtLeast', { count: minRows, label: t('general:rows') })
}
if (maxRows && arrayLength > maxRows) {
return t('validation:requiresNoMoreThan', { count: maxRows, label: t('rows') })
return t('validation:requiresNoMoreThan', { count: maxRows, label: t('general:rows') })
}
if (required && !arrayLength) {
return t('validation:requiresAtLeast', { count: 1, label: t('row') })
return t('validation:requiresAtLeast', { count: 1, label: t('general:row') })
}
return true
@@ -218,11 +218,11 @@ export const number: Validate<unknown, unknown, NumberField> = (
const numberValue = parseFloat(number as unknown as string)
if (typeof max === 'number' && numberValue > max) {
return t('validation:greaterThanMax', { label: t('value'), max, value })
return t('validation:greaterThanMax', { label: t('general:value'), max, value })
}
if (typeof min === 'number' && numberValue < min) {
return t('validation:lessThanMin', { label: t('value'), min, value })
return t('validation:lessThanMin', { label: t('general:value'), min, value })
}
}
@@ -382,11 +382,19 @@ export const relationship: Validate<unknown, unknown, RelationshipField> = async
if (Array.isArray(value) && value.length > 0) {
if (minRows && value.length < minRows) {
return t('validation:lessThanMin', { label: t('rows'), min: minRows, value: value.length })
return t('validation:lessThanMin', {
label: t('general:rows'),
min: minRows,
value: value.length,
})
}
if (maxRows && value.length > maxRows) {
return t('validation:greaterThanMax', { label: t('rows'), max: maxRows, value: value.length })
return t('validation:greaterThanMax', {
label: t('general:rows'),
max: maxRows,
value: value.length,
})
}
}

15
packages/ui/src/elements/DocumentControls/index.tsx
View File

@@ -74,16 +74,12 @@ export const DocumentControls: React.FC<{
{collectionConfig && !isEditing && !isAccountView && (
<li className={`${baseClass}__list-item`}>
<p className={`${baseClass}__value`}>
Creating new{' '}
{typeof collectionConfig?.labels?.singular === 'string'
? collectionConfig.labels.singular
: 'Doc'}
{/* {t('creatingNewLabel', {
{i18n.t('creatingNewLabel', {
label:
typeof collectionConfig?.labels?.singular === 'string'
? collectionConfig.labels.singular
: 'document',
})} */}
})}
</p>
</li>
)}
@@ -123,7 +119,7 @@ export const DocumentControls: React.FC<{
data?.updatedAt ? formatDate(data?.updatedAt, dateFormat, i18n.language) : ''
}
>
<p className={`${baseClass}__label`}>{/* {t('lastModified')}:&nbsp; */}</p>
<p className={`${baseClass}__label`}>{i18n.t('general:lastModified')}:&nbsp;</p>
{data?.updatedAt && (
<p className={`${baseClass}__value`}>
{formatDate(data.updatedAt, dateFormat, i18n.language)}
@@ -138,7 +134,7 @@ export const DocumentControls: React.FC<{
data?.createdAt ? formatDate(data?.createdAt, dateFormat, i18n.language) : ''
}
>
<p className={`${baseClass}__label`}>{/* {t('created')}:&nbsp; */}</p>
<p className={`${baseClass}__label`}>{i18n.t('general:created')}:&nbsp;</p>
{data?.createdAt && (
<p className={`${baseClass}__value`}>
{formatDate(data?.createdAt, dateFormat, i18n.language)}
@@ -213,8 +209,7 @@ export const DocumentControls: React.FC<{
id="action-create"
to={`${adminRoute}/collections/${collectionConfig?.slug}/create`}
>
Create New
{/* {t('createNew')} */}
{i18n.t('general:createNew')}
</PopupList.Button>
{!collectionConfig?.admin?.disableDuplicate && isEditing && (
<DuplicateDocument

16
packages/ui/src/forms/RenderFields/index.tsx
View File

@@ -1,16 +1,22 @@
import React from 'react'
import { fieldAffectsData } from 'payload/types'
import type { Props } from './types'
import { RenderCustomComponent } from '../../elements/RenderCustomComponent'
import './index.scss'
import { getTranslation } from '@payloadcms/translations'
const baseClass = 'render-fields'
const RenderFields: React.FC<Props> = (props) => {
const { className, fieldTypes, forceRender, margins, data, user, state } = props
const { className, fieldTypes, forceRender, margins, data, user, state, i18n } = props
if ('fields' in props) {
if (!i18n) {
console.error('Need to implement i18n when calling RenderFields')
}
return (
<div
className={[
@@ -73,11 +79,13 @@ const RenderFields: React.FC<Props> = (props) => {
return (
<div className="missing-field" key={fieldIndex}>
{/* {t('error:noMatchedField', {
{i18n
? i18n.t('error:noMatchedField', {
label: fieldAffectsData(field)
? getTranslation(field.label || field.name, i18n)
: field.path,
})} */}
})
: 'Need to implement i18n when calling RenderFields'}
</div>
)
})}

2
packages/ui/src/forms/RenderFields/types.ts
View File

@@ -3,6 +3,7 @@ import type { Document, Field, FieldWithPath } from 'payload/types'
import type { ReducedField } from './filterFields'
import { Fields } from '../Form/types'
import { FieldTypes } from 'payload/config'
import { I18n } from '@payloadcms/translations'
export type Props = {
className?: string
@@ -18,6 +19,7 @@ export type Props = {
}
| FieldPermissions
readOnly?: boolean
i18n?: I18n
} & (
| {
// Fields to be filtered by the component

6
packages/ui/src/views/Edit/index.tsx
View File

@@ -5,7 +5,7 @@ import Form from '../../forms/Form'
import { OperationProvider } from '../../providers/OperationProvider'
import './index.scss'
// import { getTranslation } from 'payload/utilities'
// import { getTranslation } from '@payloadcms/translations'
import { DocumentControls } from '../../elements/DocumentControls'
import { DocumentFields } from '../../elements/DocumentFields'
import { LeaveWithoutSaving } from '../../elements/LeaveWithoutSaving'
@@ -114,12 +114,12 @@ export const DefaultEditView: React.FC<EditViewProps> = async (props) => {
/>
{/* <Meta
description={`${isEditing ? t('editing') : t('creating')} - ${getTranslation(
description={`${isEditing ? t('general:editing') : t('general:creating')} - ${getTranslation(
collection.labels.singular,
i18n,
)}`}
keywords={`${getTranslation(collection.labels.singular, i18n)}, Payload, CMS`}
title={`${isEditing ? t('editing') : t('creating')} - ${getTranslation(
title={`${isEditing ? t('general:editing') : t('general:creating')} - ${getTranslation(
collection.labels.singular,
i18n,
)}`}

19
packages/ui/src/views/List/index.tsx
View File

@@ -39,7 +39,7 @@ export const DefaultList: React.FC<DefaultListViewProps> = (props) => {
useAsTitle,
} = {},
fields,
labels: { plural: pluralLabel },
labels: { plural: pluralLabel, singular: singularLabel } = {},
slug: collectionSlug,
},
customHeader,
@@ -104,15 +104,15 @@ export const DefaultList: React.FC<DefaultListViewProps> = (props) => {
{customHeader && customHeader}
{!customHeader && (
<Fragment>
<h1>{typeof pluralLabel === 'string' ? pluralLabel : pluralLabel['en']}</h1>
{/* <h1>{getTranslation(pluralLabel, i18n)}</h1> */}
<h1>{getTranslation(pluralLabel, i18n)}</h1>
{hasCreatePermission && (
<Pill
// aria-label={t('createNewLabel', { label: getTranslation(singularLabel, i18n) })}
aria-label={i18n.t('general:createNewLabel', {
label: getTranslation(singularLabel, i18n),
})}
to={newDocumentURL}
>
Create New
{/* {t('createNew')} */}
{i18n.t('general:createNew')}
</Pill>
)}
{/* {!smallBreak && (
@@ -152,11 +152,10 @@ export const DefaultList: React.FC<DefaultListViewProps> = (props) => {
)}
{data.docs && data.docs.length === 0 && (
<div className={`${baseClass}__no-results`}>
{/* <p>{t('noResults', { label: getTranslation(pluralLabel, i18n) })}</p> */}
<p>{i18n.t('general:noResults', { label: getTranslation(pluralLabel, i18n) })}</p>
{hasCreatePermission && newDocumentURL && (
<Button el="link" to={newDocumentURL}>
Create New
{/* {t('createNewLabel', { label: getTranslation(singularLabel, i18n) })} */}
{i18n.t('general:createNewLabel', { label: getTranslation(singularLabel, i18n) })}
</Button>
)}
</div>
@@ -184,7 +183,7 @@ export const DefaultList: React.FC<DefaultListViewProps> = (props) => {
{data.totalPages > 1 && data.totalPages !== data.page
? data.limit * data.page
: data.totalDocs}{' '}
{/* {t('of')} {data.totalDocs} */}
{i18n.t('general:of')} {data.totalDocs}
</div>
<PerPage
handleChange={handlePerPageChange}