Infrastructure/logto
0
Fork 0
mirror of https://github.com/logto-io/logto.git synced 2025-01-06 20:40:08 -05:00
Code Issues Activity

feat(console,phrases): adjust the application creation modal (#5304)

Browse source 
adjust the application creation modal
This commit is contained in:
simeng-li 2024-01-25 15:45:41 +08:00 committed by GitHub
parent a8719de7bf
commit 820158706b
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
16 changed files with 67 additions and 11 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

34
packages/console/src/pages/Applications/components/CreateForm/index.tsx
View file

@ -1,5 +1,7 @@
import { type AdminConsoleKey } from '@logto/phrases';
import type { Application } from '@logto/schemas';
import { ApplicationType } from '@logto/schemas';
import { type ReactElement, useMemo } from 'react';
import { useController, useForm } from 'react-hook-form';
import { toast } from 'react-hot-toast';
import { useTranslation } from 'react-i18next';
@ -72,6 +74,23 @@ function CreateForm({
})
);
const subtitleElement = useMemo<AdminConsoleKey | ReactElement>(() => {
if (!defaultCreateFrameworkName) {
return 'applications.subtitle';
}
if (isDefaultCreateThirdParty) {
return 'applications.create_subtitle_third_party';
}
return (
<DynamicT
forKey="applications.subtitle_with_app_type"
interpolation={{ name: defaultCreateFrameworkName }}
/>
);
}, [defaultCreateFrameworkName, isDefaultCreateThirdParty]);
return (
<Modal
shouldCloseOnEsc
@ -84,17 +103,8 @@ function CreateForm({
>
<ModalLayout
title="applications.create"
subtitle={
defaultCreateFrameworkName ? (
<DynamicT
forKey="applications.subtitle_with_app_type"
interpolation={{ name: defaultCreateFrameworkName }}
/>
) : (
'applications.subtitle'
)
}
size="large"
subtitle={subtitleElement}
size="medium"
footer={<Footer selectedType={value} isLoading={isSubmitting} onClickCreate={onSubmit} />}
onClose={onClose}
>
@ -142,6 +152,8 @@ function CreateForm({
<FormField isRequired title="applications.application_name">
<TextInput
{...register('name', { required: true })}
// eslint-disable-next-line jsx-a11y/no-autofocus
autoFocus={!!defaultCreateType}
placeholder={t('applications.application_name_placeholder')}
error={Boolean(errors.name)}
/>

3
packages/phrases/src/locales/de/translation/admin-console/applications.ts
View file

@ -5,6 +5,9 @@ const applications = {
'Richte eine native, single page, machine to machine oder herkömmliche Anwendung ein, die Logto zur Authentifizierung nutzt.',
subtitle_with_app_type: 'Richte Logto-Authentifizierung für deine {{name}}-Anwendung ein',
create: 'Anwendung erstellen',
/** UNTRANSLATED */
create_subtitle_third_party:
'Use Logto as your identity provider (IdP) to easily integrate with third-party applications',
application_name: 'Anwendungsname',
application_name_placeholder: 'Meine App',
application_description: 'Anwendungsbeschreibung',

2
packages/phrases/src/locales/en/translation/admin-console/applications.ts
View file

@ -5,6 +5,8 @@ const applications = {
'Set up Logto authentication for your native, single page, machine to machine, or traditional application',
subtitle_with_app_type: 'Set up Logto authentication for your {{name}} application',
create: 'Create application',
create_subtitle_third_party:
'Use Logto as your identity provider (IdP) to easily integrate with third-party applications',
application_name: 'Application name',
application_name_placeholder: 'My App',
application_description: 'Application description',

3
packages/phrases/src/locales/es/translation/admin-console/applications.ts
View file

@ -5,6 +5,9 @@ const applications = {
'Configura la autenticación de Logto para tu aplicación nativa, de página única, de máquina a máquina o tradicional',
subtitle_with_app_type: 'Configura la autenticación de Logto para tu aplicación {{name}}',
create: 'Crear aplicación',
/** UNTRANSLATED */
create_subtitle_third_party:
'Use Logto as your identity provider (IdP) to easily integrate with third-party applications',
application_name: 'Nombre de la aplicación',
application_name_placeholder: 'Mi App',
application_description: 'Descripción de la aplicación',

3
packages/phrases/src/locales/fr/translation/admin-console/applications.ts
View file

@ -5,6 +5,9 @@ const applications = {
"Configurez une application mobile, une page unique, machine to machine ou une application traditionnelle pour utiliser Logto pour l'authentification.",
subtitle_with_app_type: "Configurez l'authentification Logto pour votre application {{name}}",
create: 'Créer une application',
/** UNTRANSLATED */
create_subtitle_third_party:
'Use Logto as your identity provider (IdP) to easily integrate with third-party applications',
application_name: "Nom de l'application",
application_name_placeholder: 'Mon app',
application_description: "Description de l'application",

3
packages/phrases/src/locales/it/translation/admin-console/applications.ts
View file

@ -5,6 +5,9 @@ const applications = {
"Configura l'autenticazione Logto per la tua applicazione nativa, a singola pagina, macchina-to-macchina o tradizionale",
subtitle_with_app_type: "Configura l'autenticazione Logto per la tua applicazione {{name}}",
create: 'Crea Applicazione',
/** UNTRANSLATED */
create_subtitle_third_party:
'Use Logto as your identity provider (IdP) to easily integrate with third-party applications',
application_name: 'Nome applicazione',
application_name_placeholder: 'La mia App',
application_description: 'Descrizione applicazione',

3
packages/phrases/src/locales/ja/translation/admin-console/applications.ts
View file

@ -5,6 +5,9 @@ const applications = {
'ネイティブ、シングルページ、マシン・トゥ・マシン、または従来のアプリケーションにLogto認証を設定する',
subtitle_with_app_type: 'あなたの {{name}} アプリケーションに Logto 認証を設定する',
create: 'アプリケーションを作成する',
/** UNTRANSLATED */
create_subtitle_third_party:
'Use Logto as your identity provider (IdP) to easily integrate with third-party applications',
application_name: 'アプリケーション名',
application_name_placeholder: '私のアプリ',
application_description: 'アプリケーションの説明',

3
packages/phrases/src/locales/ko/translation/admin-console/applications.ts
View file

@ -5,6 +5,9 @@ const applications = {
'인증에 Logto를 사용할 모바일, 단일 페이지, Machine-to-Machine 또는 기존 어플리케이션을 설정할 수 있어요.',
subtitle_with_app_type: 'Set up Logto authentication for your {{name}} application',
create: '어플리케이션 생성',
/** UNTRANSLATED */
create_subtitle_third_party:
'Use Logto as your identity provider (IdP) to easily integrate with third-party applications',
application_name: '어플리케이션 이름',
application_name_placeholder: '나의 앱',
application_description: '어플리케이션 설명',

3
packages/phrases/src/locales/pl-pl/translation/admin-console/applications.ts
View file

@ -5,6 +5,9 @@ const applications = {
'Skonfiguruj uwierzytelnianie Logto dla Twojej aplikacji natywnej, jednostronicowej, komunikującej się bezpośrednio z zasobami lub tradycyjnej',
subtitle_with_app_type: 'Skonfiguruj uwierzytelnianie Logto dla twojej aplikacji {{name}}',
create: 'Utwórz aplikację',
/** UNTRANSLATED */
create_subtitle_third_party:
'Use Logto as your identity provider (IdP) to easily integrate with third-party applications',
application_name: 'Nazwa aplikacji',
application_name_placeholder: 'Moja aplikacja',
application_description: 'Opis aplikacji',

3
packages/phrases/src/locales/pt-br/translation/admin-console/applications.ts
View file

@ -5,6 +5,9 @@ const applications = {
'Configure um aplicativo móvel, single page, machine to machine ou tradicional para usar o Logto para autenticação',
subtitle_with_app_type: 'Configure a autenticação Logto para o seu aplicativo {{name}}',
create: 'Criar aplicativo',
/** UNTRANSLATED */
create_subtitle_third_party:
'Use Logto as your identity provider (IdP) to easily integrate with third-party applications',
application_name: 'Nome do Aplicativo',
application_name_placeholder: 'Meu aplicativo',
application_description: 'Descrição do aplicativo',

3
packages/phrases/src/locales/pt-pt/translation/admin-console/applications.ts
View file

@ -5,6 +5,9 @@ const applications = {
'Configure um aplicativo móvel, de página única, machine to machine ou tradicional para usar o Logto para autenticação',
subtitle_with_app_type: 'Configurar autenticação Logto para a aplicação {{name}}',
create: 'Criar aplicação',
/** UNTRANSLATED */
create_subtitle_third_party:
'Use Logto as your identity provider (IdP) to easily integrate with third-party applications',
application_name: 'Nome da aplicação',
application_name_placeholder: 'Ex: Site Empresa',
application_description: 'Descrição da aplicação',

3
packages/phrases/src/locales/ru/translation/admin-console/applications.ts
View file

@ -5,6 +5,9 @@ const applications = {
'Настроить аутентификацию Logto для вашего нативного, одностраничного, машина-машина или традиционного приложения.',
subtitle_with_app_type: 'Настроить аутентификацию Logto для вашего приложения {{name}}',
create: 'Создать заявку',
/** UNTRANSLATED */
create_subtitle_third_party:
'Use Logto as your identity provider (IdP) to easily integrate with third-party applications',
application_name: 'Название приложения',
application_name_placeholder: 'Мое приложение',
application_description: 'Описание приложения',

3
packages/phrases/src/locales/tr-tr/translation/admin-console/applications.ts
View file

@ -5,6 +5,9 @@ const applications = {
'Kimlik doğrulaması için Logtoyu kullanmak üzere mobil, tek sayfa, machine to machine veya geleneksel bir uygulama ayarlayınız',
subtitle_with_app_type: 'Logto Doğrulamasını {{name}} uygulamanız için yapılandırın',
create: 'Uygulama oluştur',
/** UNTRANSLATED */
create_subtitle_third_party:
'Use Logto as your identity provider (IdP) to easily integrate with third-party applications',
application_name: 'Uygulama adı',
application_name_placeholder: 'Uygulamam',
application_description: 'Uygulama açıklaması',

3
packages/phrases/src/locales/zh-cn/translation/admin-console/applications.ts
View file

@ -4,6 +4,9 @@ const applications = {
subtitle: '创建一个移动、单页、machine-to-machine 或传统 web 应用程序，并通过 Logto 进行身份验证',
subtitle_with_app_type: '为你的 {{name}} 应用程序设置 Logto 身份验证',
create: '创建应用',
/** UNTRANSLATED */
create_subtitle_third_party:
'Use Logto as your identity provider (IdP) to easily integrate with third-party applications',
application_name: '应用名称',
application_name_placeholder: '我的应用',
application_description: '应用描述',

3
packages/phrases/src/locales/zh-hk/translation/admin-console/applications.ts
View file

@ -4,6 +4,9 @@ const applications = {
subtitle: '創建一個移動、單頁、machine-to-machine 或傳統 web 應用程序，並通過 Logto 進行身份驗證',
subtitle_with_app_type: '為你的 {{name}} 應用程序設置 Logto 身份驗證',
create: '創建應用',
/** UNTRANSLATED */
create_subtitle_third_party:
'Use Logto as your identity provider (IdP) to easily integrate with third-party applications',
application_name: '應用名稱',
application_name_placeholder: '我的應用',
application_description: '應用描述',

3
packages/phrases/src/locales/zh-tw/translation/admin-console/applications.ts
View file

@ -4,6 +4,9 @@ const applications = {
subtitle: '創建一個移動、單頁、machine-to-machine 或傳統 web 應用程序，並通過 Logto 進行身份驗證',
subtitle_with_app_type: '設置 {{name}} 應用程序的 Logto 身份驗證',
create: '創建應用',
/** UNTRANSLATED */
create_subtitle_third_party:
'Use Logto as your identity provider (IdP) to easily integrate with third-party applications',
application_name: '應用名稱',
application_name_placeholder: '我的應用',
application_description: '應用描述',