From 09683ac384764973fd523e99a7d0d6575d41b669 Mon Sep 17 00:00:00 2001 From: Xiao Yijun Date: Wed, 8 Mar 2023 14:55:06 +0800 Subject: [PATCH] Revert "Revert "refactor(ui): hard code the page slogan"" (#3230) --- packages/phrases-ui/src/locales/de.ts | 2 ++ packages/phrases-ui/src/locales/en.ts | 2 ++ packages/phrases-ui/src/locales/fr.ts | 8 +++++--- packages/phrases-ui/src/locales/ko.ts | 2 ++ packages/phrases-ui/src/locales/pt-br.ts | 10 ++++++---- packages/phrases-ui/src/locales/pt-pt.ts | 8 +++++--- packages/phrases-ui/src/locales/ru.ts | 2 ++ packages/phrases-ui/src/locales/tr-tr.ts | 8 +++++--- packages/phrases-ui/src/locales/zh-cn.ts | 10 ++++++---- .../ui/src/components/BrandingHeader/index.test.tsx | 4 +++- packages/ui/src/components/BrandingHeader/index.tsx | 8 ++++++-- .../ui/src/containers/LandingPageContainer/index.tsx | 9 +++++---- packages/ui/src/pages/Register/index.tsx | 2 +- packages/ui/src/pages/SignIn/index.tsx | 2 +- 14 files changed, 51 insertions(+), 26 deletions(-) diff --git a/packages/phrases-ui/src/locales/de.ts b/packages/phrases-ui/src/locales/de.ts index dd816b23a..876652026 100644 --- a/packages/phrases-ui/src/locales/de.ts +++ b/packages/phrases-ui/src/locales/de.ts @@ -97,6 +97,8 @@ const translation = { 'Für zusätzliche Sicherheit, verknüpfe bitte deine Email oder Telefonnummer mit dem Konto.', continue_with_more_information: 'Für zusätzliche Sicherheit, vervollständige bitte deine Informationen.', + create_your_account: 'Create your account', // UNTRANSLATED + welcome_to_sign_in: 'Welcome to sign in', // UNTRANSLATED }, error: { general_required: `{{types, list(type: disjunction;)}} ist erforderlich`, diff --git a/packages/phrases-ui/src/locales/en.ts b/packages/phrases-ui/src/locales/en.ts index 6192e4a59..d3eedb175 100644 --- a/packages/phrases-ui/src/locales/en.ts +++ b/packages/phrases-ui/src/locales/en.ts @@ -93,6 +93,8 @@ const translation = { link_email_or_phone_description: 'For added security, please link your email or phone with the account.', continue_with_more_information: 'For added security, please complete below account details.', + create_your_account: 'Create your account', + welcome_to_sign_in: 'Welcome to sign in', }, error: { general_required: `{{types, list(type: disjunction;)}} is required`, diff --git a/packages/phrases-ui/src/locales/fr.ts b/packages/phrases-ui/src/locales/fr.ts index ef72d73ae..7ed331f9f 100644 --- a/packages/phrases-ui/src/locales/fr.ts +++ b/packages/phrases-ui/src/locales/fr.ts @@ -70,9 +70,9 @@ const translation = { 'The {{type}} {{value}} is linked to another account. Please try another {{type}}', // UNTRANSLATED bind_account_title: 'Link or create account', // UNTRANSLATED social_create_account: 'Pas de compte ? Vous pouvez créer un nouveau compte et un lien.', - social_link_email: 'You can link another email', // UNTRANSLATED, - social_link_phone: 'You can link another phone', // UNTRANSLATED, - social_link_email_or_phone: 'You can link another email or phone', // UNTRANSLATED, + social_link_email: 'You can link another email', // UNTRANSLATED + social_link_phone: 'You can link another phone', // UNTRANSLATED + social_link_email_or_phone: 'You can link another email or phone', // UNTRANSLATED social_bind_with_existing: 'Nous trouvons un compte connexe, vous pouvez le relier directement.', reset_password: 'Réinitialiser le mot de passe', @@ -96,6 +96,8 @@ const translation = { link_email_or_phone_description: 'For added security, please link your email or phone with the account.', // UNTRANSLATED continue_with_more_information: 'For added security, please complete below account details.', // UNTRANSLATED + create_your_account: 'Create your account', // UNTRANSLATED + welcome_to_sign_in: 'Welcome to sign in', // UNTRANSLATED }, error: { general_required: `Le {{types, list(type: disjunction;)}} est requis`, diff --git a/packages/phrases-ui/src/locales/ko.ts b/packages/phrases-ui/src/locales/ko.ts index 25095ff6b..722e2c4b8 100644 --- a/packages/phrases-ui/src/locales/ko.ts +++ b/packages/phrases-ui/src/locales/ko.ts @@ -91,6 +91,8 @@ const translation = { link_email_or_phone_description: '더 나은 보안을 위해 이메일 또는 휴대전화번호를 연동해 주세요.', continue_with_more_information: '더 나은 보안을 위해 아래 자세한 내용을 따라 주세요.', + create_your_account: 'Create your account', // UNTRANSLATED + welcome_to_sign_in: 'Welcome to sign in', // UNTRANSLATED }, error: { general_required: `{{types, list(type: disjunction;)}} 필수예요.`, diff --git a/packages/phrases-ui/src/locales/pt-br.ts b/packages/phrases-ui/src/locales/pt-br.ts index ddef68684..e80e55743 100644 --- a/packages/phrases-ui/src/locales/pt-br.ts +++ b/packages/phrases-ui/src/locales/pt-br.ts @@ -33,7 +33,7 @@ const translation = { switch_to: 'Trocar para {{method}}', sign_in_via_passcode: 'Entrar com código de verificação', sign_in_via_password: 'Entrar com senha', - change: 'Change {{change}}', // UNTRANSLATED, + change: 'Change {{change}}', // UNTRANSLATED link_another_email: 'Link another email', // UNTRANSLATED link_another_phone: 'Link another phone', // UNTRANSLATED link_another_email_or_phone: 'Link another email or phone', // UNTRANSLATED @@ -68,9 +68,9 @@ const translation = { 'The {{type}} {{value}} is linked to another account. Please try another {{type}}', // UNTRANSLATED bind_account_title: 'Link or create account', // UNTRANSLATED social_create_account: 'Sem conta? Você pode criar uma nova conta e link.', - social_link_email: 'You can link another email', // UNTRANSLATED, - social_link_phone: 'You can link another phone', // UNTRANSLATED, - social_link_email_or_phone: 'You can link another email or phone', // UNTRANSLATED, + social_link_email: 'You can link another email', // UNTRANSLATED + social_link_phone: 'You can link another phone', // UNTRANSLATED + social_link_email_or_phone: 'You can link another email or phone', // UNTRANSLATED social_bind_with_existing: 'Encontramos uma conta relacionada, você pode vinculá-la diretamente.', reset_password: 'Redefinir senha', @@ -94,6 +94,8 @@ const translation = { link_email_or_phone_description: 'Para maior segurança, vincule seu e-mail ou telefone à conta.', continue_with_more_information: 'Para maior segurança, preencha os detalhes da conta abaixo.', + create_your_account: 'Create your account', // UNTRANSLATED + welcome_to_sign_in: 'Welcome to sign in', // UNTRANSLATED }, error: { general_required: `{{types, list(type: disjunction;)}} é obrigatório`, diff --git a/packages/phrases-ui/src/locales/pt-pt.ts b/packages/phrases-ui/src/locales/pt-pt.ts index 867861b61..e48b1b4f9 100644 --- a/packages/phrases-ui/src/locales/pt-pt.ts +++ b/packages/phrases-ui/src/locales/pt-pt.ts @@ -68,9 +68,9 @@ const translation = { 'The {{type}} {{value}} is linked to another account. Please try another {{type}}', // UNTRANSLATED bind_account_title: 'Link or create account', // UNTRANSLATED social_create_account: 'Sem conta? Pode criar uma nova e agregar.', - social_link_email: 'You can link another email', // UNTRANSLATED, - social_link_phone: 'You can link another phone', // UNTRANSLATED, - social_link_email_or_phone: 'You can link another email or phone', // UNTRANSLATED, + social_link_email: 'You can link another email', // UNTRANSLATED + social_link_phone: 'You can link another phone', // UNTRANSLATED + social_link_email_or_phone: 'You can link another email or phone', // UNTRANSLATED social_bind_with_existing: 'Encontramos uma conta relacionada, pode agrega-la diretamente.', reset_password: 'Redefinir Password', reset_password_description: @@ -93,6 +93,8 @@ const translation = { link_email_or_phone_description: 'For added security, please link your email or phone with the account.', // UNTRANSLATED continue_with_more_information: 'For added security, please complete below account details.', // UNTRANSLATED + create_your_account: 'Create your account', // UNTRANSLATED + welcome_to_sign_in: 'Welcome to sign in', // UNTRANSLATED }, error: { general_required: `{{types, list(type: disjunction;)}} is necessário`, diff --git a/packages/phrases-ui/src/locales/ru.ts b/packages/phrases-ui/src/locales/ru.ts index e90edd262..6818d00a5 100644 --- a/packages/phrases-ui/src/locales/ru.ts +++ b/packages/phrases-ui/src/locales/ru.ts @@ -95,6 +95,8 @@ const translation = { 'Для дополнительной безопасности, пожалуйста, привяжите свою электронную почту или номер телефона к учетной записи.', continue_with_more_information: 'Для дополнительной безопасности, пожалуйста, заполните приведенные ниже данные учетной записи.', + create_your_account: 'Create your account', // UNTRANSLATED + welcome_to_sign_in: 'Welcome to sign in', // UNTRANSLATED }, error: { general_required: `Введите {{types, list(type: disjunction;)}}`, diff --git a/packages/phrases-ui/src/locales/tr-tr.ts b/packages/phrases-ui/src/locales/tr-tr.ts index 34813738e..1d7cadfff 100644 --- a/packages/phrases-ui/src/locales/tr-tr.ts +++ b/packages/phrases-ui/src/locales/tr-tr.ts @@ -69,9 +69,9 @@ const translation = { 'The {{type}} {{value}} is linked to another account. Please try another {{type}}', // UNTRANSLATED bind_account_title: 'Link or create account', // UNTRANSLATED social_create_account: 'Hesabınız yok mu? Yeni bir hesap ve bağlantı oluşturabilirsiniz.', - social_link_email: 'You can link another email', // UNTRANSLATED, - social_link_phone: 'You can link another phone', // UNTRANSLATED, - social_link_email_or_phone: 'You can link another email or phone', // UNTRANSLATED, + social_link_email: 'You can link another email', // UNTRANSLATED + social_link_phone: 'You can link another phone', // UNTRANSLATED + social_link_email_or_phone: 'You can link another email or phone', // UNTRANSLATED social_bind_with_existing: 'İlgili bir hesap bulduk, hemen bağlayabilirsiniz.', reset_password: 'Şifre yenile', reset_password_description: @@ -94,6 +94,8 @@ const translation = { link_email_or_phone_description: 'For added security, please link your email or phone with the account.', // UNTRANSLATED continue_with_more_information: 'For added security, please complete below account details.', // UNTRANSLATED + create_your_account: 'Create your account', // UNTRANSLATED + welcome_to_sign_in: 'Welcome to sign in', // UNTRANSLATED }, error: { general_required: `{{types, list(type: disjunction;)}} is required`, // UNTRANSLATED diff --git a/packages/phrases-ui/src/locales/zh-cn.ts b/packages/phrases-ui/src/locales/zh-cn.ts index 54e85113e..dcf6b775e 100644 --- a/packages/phrases-ui/src/locales/zh-cn.ts +++ b/packages/phrases-ui/src/locales/zh-cn.ts @@ -86,10 +86,12 @@ const translation = { link_email: '绑定邮箱', link_phone: '绑定手机', link_email_or_phone: '绑定邮箱或手机号', - link_email_description: '绑定邮箱以保障您的账号安全', - link_phone_description: '绑定手机号以保障您的账号安全', - link_email_or_phone_description: '绑定邮箱或手机号以保障您的账号安全', - continue_with_more_information: '为保障您的账号安全，需要您补充以下信息。', + link_email_description: '绑定邮箱以保障你的账号安全', + link_phone_description: '绑定手机号以保障你的账号安全', + link_email_or_phone_description: '绑定邮箱或手机号以保障你的账号安全', + continue_with_more_information: '为保障你的账号安全，需要你补充以下信息。', + create_your_account: '注册你的账号', + welcome_to_sign_in: '欢迎登录', }, error: { general_required: `{{types, list(type: disjunction;)}}必填`, diff --git a/packages/ui/src/components/BrandingHeader/index.test.tsx b/packages/ui/src/components/BrandingHeader/index.test.tsx index abf060971..e57e38d30 100644 --- a/packages/ui/src/components/BrandingHeader/index.test.tsx +++ b/packages/ui/src/components/BrandingHeader/index.test.tsx @@ -1,10 +1,12 @@ import { render } from '@testing-library/react'; -import { appLogo, appHeadline } from '@/__mocks__/logto'; +import { appLogo } from '@/__mocks__/logto'; import BrandingHeader from '.'; describe('BrandingHeader UI Component', () => { + const appHeadline = 'description.welcome_to_sign_in'; + test('render logo with context', () => { const { queryByText, container } = render( diff --git a/packages/ui/src/components/BrandingHeader/index.tsx b/packages/ui/src/components/BrandingHeader/index.tsx index 72627031d..4247183a4 100644 --- a/packages/ui/src/components/BrandingHeader/index.tsx +++ b/packages/ui/src/components/BrandingHeader/index.tsx @@ -1,18 +1,22 @@ import classNames from 'classnames'; +import { useTranslation } from 'react-i18next'; +import type { TFuncKey } from 'react-i18next'; import * as styles from './index.module.scss'; export type Props = { className?: string; logo: string; - headline?: string; + headline?: TFuncKey; }; const BrandingHeader = ({ logo, headline, className }: Props) => { + const { t } = useTranslation(); + return (
app logo - {headline &&
{headline}
} + {headline &&
{t(headline)}
}
); }; diff --git a/packages/ui/src/containers/LandingPageContainer/index.tsx b/packages/ui/src/containers/LandingPageContainer/index.tsx index 51f21998a..ba394a29e 100644 --- a/packages/ui/src/containers/LandingPageContainer/index.tsx +++ b/packages/ui/src/containers/LandingPageContainer/index.tsx @@ -1,7 +1,7 @@ -import { BrandingStyle } from '@logto/schemas'; import classNames from 'classnames'; import type { ReactNode } from 'react'; import { useContext } from 'react'; +import type { TFuncKey } from 'react-i18next'; import BrandingHeader from '@/components/BrandingHeader'; import { PageContext } from '@/hooks/use-page-context'; @@ -13,16 +13,17 @@ import * as styles from './index.module.scss'; type Props = { children: ReactNode; className?: string; + title?: TFuncKey; }; -const LandingPageContainer = ({ children, className }: Props) => { +const LandingPageContainer = ({ children, className, title }: Props) => { const { experienceSettings, theme, platform } = useContext(PageContext); if (!experienceSettings) { return null; } - const { slogan, logoUrl, darkLogoUrl, style } = experienceSettings.branding; + const { logoUrl, darkLogoUrl } = experienceSettings.branding; return ( <> @@ -30,7 +31,7 @@ const LandingPageContainer = ({ children, className }: Props) => {
{children} diff --git a/packages/ui/src/pages/Register/index.tsx b/packages/ui/src/pages/Register/index.tsx index caf54c019..c9a886397 100644 --- a/packages/ui/src/pages/Register/index.tsx +++ b/packages/ui/src/pages/Register/index.tsx @@ -20,7 +20,7 @@ const Register = () => { } return ( - + {signUpMethods.length > 0 && ( )} diff --git a/packages/ui/src/pages/SignIn/index.tsx b/packages/ui/src/pages/SignIn/index.tsx index 0bc89f8ac..5cae42563 100644 --- a/packages/ui/src/pages/SignIn/index.tsx +++ b/packages/ui/src/pages/SignIn/index.tsx @@ -20,7 +20,7 @@ const SignIn = () => { } return ( - +
{ // Create Account footer