diff --git a/CHANGELOG.md b/CHANGELOG.md index 66861753bda..9dc8d9fe461 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -57,7 +57,7 @@ A big thanks to the 10 contributors who made this release possible. Here are som - Fix redirection to GitHub example view (#4642) @oliviertassinari - Fix build errors with Next.js 14 (#4594) @bharatkashyap -## CLI +### CLI - Refactor CLI setup (#4597) @bharatkashyap - Fix package.json pretty print (#4644) @rkristelijn diff --git a/docs/data/toolpad/core/components/sign-in-page/LocaleSignInPage.js b/docs/data/toolpad/core/components/sign-in-page/LocaleSignInPage.js index 0e5ff86e899..97e371bf4a5 100644 --- a/docs/data/toolpad/core/components/sign-in-page/LocaleSignInPage.js +++ b/docs/data/toolpad/core/components/sign-in-page/LocaleSignInPage.js @@ -4,9 +4,9 @@ import { SignInPage } from '@toolpad/core/SignInPage'; import hiIN from '@toolpad/core/locales/hiIN'; const providers = [ - { id: 'github', name: 'GitHub' }, - { id: 'google', name: 'Google' }, - { id: 'credentials', name: 'Email and Password' }, + { id: 'github', name: 'गिटहब' }, + { id: 'google', name: 'गूगल' }, + { id: 'credentials', name: 'ईमेल और पासवर्ड' }, ]; const signIn = async (provider) => { @@ -28,7 +28,9 @@ export default function LocaleSignInPage() { `${provider} से साइन इन करें`, + }} /> // preview-end diff --git a/docs/data/toolpad/core/components/sign-in-page/LocaleSignInPage.tsx b/docs/data/toolpad/core/components/sign-in-page/LocaleSignInPage.tsx index cc64d7cc187..30bd309ff82 100644 --- a/docs/data/toolpad/core/components/sign-in-page/LocaleSignInPage.tsx +++ b/docs/data/toolpad/core/components/sign-in-page/LocaleSignInPage.tsx @@ -8,9 +8,9 @@ import { import hiIN from '@toolpad/core/locales/hiIN'; const providers = [ - { id: 'github', name: 'GitHub' }, - { id: 'google', name: 'Google' }, - { id: 'credentials', name: 'Email and Password' }, + { id: 'github', name: 'गिटहब' }, + { id: 'google', name: 'गूगल' }, + { id: 'credentials', name: 'ईमेल और पासवर्ड' }, ]; const signIn: (provider: AuthProvider) => void | Promise = async ( @@ -34,7 +34,9 @@ export default function LocaleSignInPage() { `${provider} से साइन इन करें`, + }} /> // preview-end diff --git a/docs/data/toolpad/core/components/sign-in-page/LocaleSignInPage.tsx.preview b/docs/data/toolpad/core/components/sign-in-page/LocaleSignInPage.tsx.preview index 49d7fc1ee6f..5603422c62e 100644 --- a/docs/data/toolpad/core/components/sign-in-page/LocaleSignInPage.tsx.preview +++ b/docs/data/toolpad/core/components/sign-in-page/LocaleSignInPage.tsx.preview @@ -4,6 +4,8 @@ `${provider} से साइन इन करें`, + }} /> \ No newline at end of file diff --git a/docs/data/toolpad/core/introduction/base-concepts.md b/docs/data/toolpad/core/introduction/base-concepts.md index 463979dfac6..3ff30f94601 100644 --- a/docs/data/toolpad/core/introduction/base-concepts.md +++ b/docs/data/toolpad/core/introduction/base-concepts.md @@ -197,7 +197,12 @@ If you pass a locale text through the `AppProvider` or the theme, and you provid   ```tsx - + `Sign In with ${brandingTitle}`, + accountPreviewTitle: 'Account', + }} +> `${provider} से साइन इन करें`, + }} +/> +``` diff --git a/packages/toolpad-core/src/AppProvider/LocalizationProvider.tsx b/packages/toolpad-core/src/AppProvider/LocalizationProvider.tsx index ab3c07de38c..fea49ee8ec5 100644 --- a/packages/toolpad-core/src/AppProvider/LocalizationProvider.tsx +++ b/packages/toolpad-core/src/AppProvider/LocalizationProvider.tsx @@ -14,11 +14,9 @@ export interface LocaleText { accountPreviewTitle: string; // SignInPage - signInTitle: string; + signInTitle: string | ((brandingTitle?: string) => string); signInSubtitle: string; - oauthSignInTitle: string; - passkeySignInTitle: string; - magicLinkSignInTitle: string; + providerSignInTitle: (provider: string) => string; signInRememberMe: string; // Common authentication labels diff --git a/packages/toolpad-core/src/SignInPage/SignInPage.test.tsx b/packages/toolpad-core/src/SignInPage/SignInPage.test.tsx index ccaa6186ce7..66b84c97de6 100644 --- a/packages/toolpad-core/src/SignInPage/SignInPage.test.tsx +++ b/packages/toolpad-core/src/SignInPage/SignInPage.test.tsx @@ -33,7 +33,7 @@ describe('SignInPage', () => { const emailField = screen.getByRole('textbox', { name: 'Email' }); const passwordField = screen.getByLabelText(/Password/); - const signInButton = screen.getByRole('button', { name: 'Sign in' }); + const signInButton = screen.getByRole('button', { name: 'Sign in with credentials' }); await userEvent.type(emailField, 'john@example.com'); await userEvent.type(passwordField, 'thepassword'); @@ -55,7 +55,7 @@ describe('SignInPage', () => { render(); const emailField = screen.getByRole('textbox', { name: 'Email' }); - const signInButton = screen.getByRole('button', { name: 'Sign in with Email' }); + const signInButton = screen.getByRole('button', { name: 'Sign in with email' }); await userEvent.type(emailField, 'john@example.com'); await userEvent.click(signInButton); diff --git a/packages/toolpad-core/src/SignInPage/SignInPage.tsx b/packages/toolpad-core/src/SignInPage/SignInPage.tsx index 021e692460a..288f4faf850 100644 --- a/packages/toolpad-core/src/SignInPage/SignInPage.tsx +++ b/packages/toolpad-core/src/SignInPage/SignInPage.tsx @@ -137,9 +137,10 @@ const IconProviderMap = new Map([ ]); interface SignInPageLocaleText { - signInTitle: string; + signInTitle: string | ((brandingTitle?: string) => string); signInSubtitle: string; signInRememberMe: string; + providerSignInTitle: (provider: string) => string; email: string; password: string; or: string; @@ -282,8 +283,10 @@ export interface SignInPageProps { } const defaultLocaleText: Pick = { - signInTitle: 'Sign in', + signInTitle: (brandingTitle?: string) => + brandingTitle ? `Sign in to ${brandingTitle}` : 'Sign in', signInSubtitle: 'Please sign in to continue', + providerSignInTitle: (provider: string) => `Sign in with ${provider}`, signInRememberMe: 'Remember me', email: 'Email', password: 'Password', @@ -374,8 +377,9 @@ function SignInPage(props: SignInPageProps) { fontWeight: 600, }} > - {localeText.signInTitle}{' '} - {branding?.title ? `${localeText.to?.toLocaleLowerCase()} ${branding.title}` : null} + {typeof localeText.signInTitle === 'string' + ? localeText.signInTitle + : localeText.signInTitle(branding?.title)} )} {slots?.subtitle ? ( @@ -429,11 +433,7 @@ function SignInPage(props: SignInPageProps) { }} {...slotProps?.oAuthButton} > - - {localeText.oauthSignInTitle || - `${localeText.signInTitle} ${localeText.with}`}{' '} - {provider.name} - + {localeText.providerSignInTitle(provider.name)} ); @@ -504,9 +504,7 @@ function SignInPage(props: SignInPageProps) { }} {...slotProps?.submitButton} > - {localeText.passkeySignInTitle || - `${localeText.signInTitle} ${localeText.with}`}{' '} - {passkeyProvider.name || localeText.passkey} + {localeText.providerSignInTitle(passkeyProvider.name || localeText.passkey)} )} @@ -583,9 +581,9 @@ function SignInPage(props: SignInPageProps) { }} {...slotProps?.submitButton} > - {localeText.magicLinkSignInTitle || - `${localeText.signInTitle} ${localeText.with}`}{' '} - {localeText.email} + {localeText.providerSignInTitle( + (emailProvider.name || localeText.email).toLocaleLowerCase(), + )} )} @@ -712,7 +710,9 @@ function SignInPage(props: SignInPageProps) { }} {...slotProps?.submitButton} > - {localeText.signInTitle} + {localeText.providerSignInTitle( + (credentialsProvider.name || localeText.password).toLocaleLowerCase(), + )} )} diff --git a/packages/toolpad-core/src/locales/en.tsx b/packages/toolpad-core/src/locales/en.tsx index 47d5938e5a2..cde73141187 100644 --- a/packages/toolpad-core/src/locales/en.tsx +++ b/packages/toolpad-core/src/locales/en.tsx @@ -11,12 +11,11 @@ const en: LocaleText = { accountPreviewIconButtonLabel: 'Current User', // SignInPage - signInTitle: 'Sign In', + signInTitle: (brandingTitle?: string) => + brandingTitle ? `Sign in to ${brandingTitle}` : 'Sign in', signInSubtitle: 'Welcome user, please sign in to continue', signInRememberMe: 'Remember Me', - oauthSignInTitle: 'Sign in with OAuth', - passkeySignInTitle: 'Sign in with Passkey', - magicLinkSignInTitle: 'Sign in with Magic Link', + providerSignInTitle: (provider: string) => `Sign in with ${provider}`, // Common authentication labels email: 'Email', diff --git a/packages/toolpad-core/src/locales/hiIN.tsx b/packages/toolpad-core/src/locales/hiIN.tsx index 16175c45125..2315d93f076 100644 --- a/packages/toolpad-core/src/locales/hiIN.tsx +++ b/packages/toolpad-core/src/locales/hiIN.tsx @@ -11,12 +11,11 @@ const hiINLabels: Partial = { accountPreviewIconButtonLabel: 'वर्तमान उपयोगकर्ता', // SignInPage - signInTitle: 'साइन इन करें', + signInTitle: (brandingTitle?: string) => + brandingTitle ? `${brandingTitle} में साइन इन करें ` : `साइन इन करें`, signInSubtitle: 'स्वागत है उपयोगकर्ता, कृपया जारी रखने के लिए साइन इन करें', signInRememberMe: 'मुझे याद रखें', - oauthSignInTitle: 'साइन इन विकल्प', - passkeySignInTitle: 'साइन इन विकल्प', - magicLinkSignInTitle: 'साइन इन विकल्प', + providerSignInTitle: (provider: string) => `${provider} से साइन इन करें`, // Common authentication labels email: 'ईमेल', diff --git a/scripts/generateProptypes.ts b/scripts/generateProptypes.ts index e2836653bf1..a65b61c2cc8 100644 --- a/scripts/generateProptypes.ts +++ b/scripts/generateProptypes.ts @@ -56,6 +56,7 @@ async function generateProptypes( project, shouldResolveObject: ({ name }) => { const propsToNotResolve = ['localeText']; + if (propsToNotResolve.includes(name)) { return false; }