From 6441a38c135e636088b989ae958a4820bd69474b Mon Sep 17 00:00:00 2001 From: Xiao Yijun Date: Tue, 13 Dec 2022 13:03:36 +0800 Subject: [PATCH] refactor(console): add another button (#2653) --- packages/console/src/assets/images/circle-plus.svg | 4 +--- .../console/src/components/Button/index.module.scss | 11 ++++++++--- .../console/src/components/MultiTextInput/index.tsx | 2 ++ .../components/SignInMethodEditBox/AddButton.tsx | 2 ++ .../components/SocialConnectorEditBox/AddButton.tsx | 2 ++ .../translation/admin-console/application-details.ts | 1 - .../locales/de/translation/admin-console/general.ts | 2 +- .../translation/admin-console/application-details.ts | 1 - .../locales/en/translation/admin-console/general.ts | 2 +- .../translation/admin-console/application-details.ts | 1 - .../locales/fr/translation/admin-console/general.ts | 2 +- .../translation/admin-console/application-details.ts | 1 - .../locales/ko/translation/admin-console/general.ts | 2 +- .../translation/admin-console/application-details.ts | 1 - .../pt-br/translation/admin-console/general.ts | 2 +- .../translation/admin-console/application-details.ts | 1 - .../pt-pt/translation/admin-console/general.ts | 2 +- .../translation/admin-console/application-details.ts | 1 - .../tr-tr/translation/admin-console/general.ts | 2 +- .../translation/admin-console/application-details.ts | 1 - .../zh-cn/translation/admin-console/general.ts | 2 +- 21 files changed, 23 insertions(+), 22 deletions(-) diff --git a/packages/console/src/assets/images/circle-plus.svg b/packages/console/src/assets/images/circle-plus.svg index 1d2315bc1..686f04f26 100644 --- a/packages/console/src/assets/images/circle-plus.svg +++ b/packages/console/src/assets/images/circle-plus.svg @@ -1,5 +1,3 @@ - + diff --git a/packages/console/src/components/Button/index.module.scss b/packages/console/src/components/Button/index.module.scss index d0a2c533e..dd2414f15 100644 --- a/packages/console/src/components/Button/index.module.scss +++ b/packages/console/src/components/Button/index.module.scss @@ -40,9 +40,8 @@ } .icon { - display: block; - width: 20px; - height: 20px; + display: flex; + align-items: center; &:not(:last-child) { margin-right: _.unit(2); @@ -62,6 +61,12 @@ &.text { height: 24px; } + + .icon { + &:not(:last-child) { + margin-right: _.unit(1); + } + } } &.medium { diff --git a/packages/console/src/components/MultiTextInput/index.tsx b/packages/console/src/components/MultiTextInput/index.tsx index 0e61ed2f8..dda2ec39b 100644 --- a/packages/console/src/components/MultiTextInput/index.tsx +++ b/packages/console/src/components/MultiTextInput/index.tsx @@ -5,6 +5,7 @@ import type { KeyboardEvent } from 'react'; import { useMemo, useState } from 'react'; import { useTranslation } from 'react-i18next'; +import CirclePlus from '@/assets/images/circle-plus.svg'; import Minus from '@/assets/images/minus.svg'; import Button from '../Button'; @@ -106,6 +107,7 @@ const MultiTextInput = ({ type="text" title="general.add_another" className={styles.addAnother} + icon={} onClick={handleAdd} /> { type: 'text', size: 'small', title: 'general.add_another', + icon: , }; return ( diff --git a/packages/console/src/pages/SignInExperience/tabs/SignUpAndSignIn/components/SocialConnectorEditBox/AddButton.tsx b/packages/console/src/pages/SignInExperience/tabs/SignUpAndSignIn/components/SocialConnectorEditBox/AddButton.tsx index dbc1a50e1..08183c726 100644 --- a/packages/console/src/pages/SignInExperience/tabs/SignUpAndSignIn/components/SocialConnectorEditBox/AddButton.tsx +++ b/packages/console/src/pages/SignInExperience/tabs/SignUpAndSignIn/components/SocialConnectorEditBox/AddButton.tsx @@ -1,5 +1,6 @@ import classNames from 'classnames'; +import CirclePlus from '@/assets/images/circle-plus.svg'; import Plus from '@/assets/images/plus.svg'; import ActionMenu from '@/components/ActionMenu'; import type { Props as ButtonProps } from '@/components/Button'; @@ -32,6 +33,7 @@ const AddButton = ({ options, onSelected, hasSelectedConnectors }: Props) => { type: 'text', size: 'small', title: 'general.add_another', + icon: , }; return ( diff --git a/packages/phrases/src/locales/de/translation/admin-console/application-details.ts b/packages/phrases/src/locales/de/translation/admin-console/application-details.ts index 5a906234a..b804c71d4 100644 --- a/packages/phrases/src/locales/de/translation/admin-console/application-details.ts +++ b/packages/phrases/src/locales/de/translation/admin-console/application-details.ts @@ -33,7 +33,6 @@ const application_details = { cors_allowed_origins_placeholder: 'https://your.website.de', cors_allowed_origins_tip: 'Es sind standardmäßig alle Umleitungs-URI Origins erlaubt. Normalerweise ist dieses Feld nicht erforderlich. See the MDN doc for detailed info.', // UNTRANSLATED - add_another: 'Weitere hinzufügen', id_token_expiration: 'ID Token Ablaufzeit', refresh_token_expiration: 'Refresh Token Ablaufzeit', token_endpoint: 'Token Endpoint', diff --git a/packages/phrases/src/locales/de/translation/admin-console/general.ts b/packages/phrases/src/locales/de/translation/admin-console/general.ts index f8d3bbe52..03af0d8ec 100644 --- a/packages/phrases/src/locales/de/translation/admin-console/general.ts +++ b/packages/phrases/src/locales/de/translation/admin-console/general.ts @@ -30,7 +30,7 @@ const general = { copying: 'Kopiere', copied: 'Kopiert', required: 'Erforderlich', - add_another: '+ Weitere hinzufügen', + add_another: 'Weitere hinzufügen', deletion_confirmation: 'Willst du {{title}} wirklich löschen?', settings_nav: 'Einstellungen', unsaved_changes_warning: diff --git a/packages/phrases/src/locales/en/translation/admin-console/application-details.ts b/packages/phrases/src/locales/en/translation/admin-console/application-details.ts index 71d51326c..4d6724103 100644 --- a/packages/phrases/src/locales/en/translation/admin-console/application-details.ts +++ b/packages/phrases/src/locales/en/translation/admin-console/application-details.ts @@ -33,7 +33,6 @@ const application_details = { cors_allowed_origins_placeholder: 'https://your.website.com', cors_allowed_origins_tip: 'By default, all the origins of Redirect URIs will be allowed. Usually no action is required for this field. See the MDN doc for detailed info.', - add_another: 'Add Another', id_token_expiration: 'ID Token expiration', refresh_token_expiration: 'Refresh Token expiration', token_endpoint: 'Token Endpoint', diff --git a/packages/phrases/src/locales/en/translation/admin-console/general.ts b/packages/phrases/src/locales/en/translation/admin-console/general.ts index 8ee71ab3d..809110051 100644 --- a/packages/phrases/src/locales/en/translation/admin-console/general.ts +++ b/packages/phrases/src/locales/en/translation/admin-console/general.ts @@ -30,7 +30,7 @@ const general = { copying: 'Copying', copied: 'Copied', required: 'Required', - add_another: '+ Add Another', + add_another: 'Add Another', deletion_confirmation: 'Are you sure you want to delete this {{title}}?', settings_nav: 'Settings', unsaved_changes_warning: 'You have made some changes. Are you sure you want to leave this page?', diff --git a/packages/phrases/src/locales/fr/translation/admin-console/application-details.ts b/packages/phrases/src/locales/fr/translation/admin-console/application-details.ts index c927d50ad..73fb6ec15 100644 --- a/packages/phrases/src/locales/fr/translation/admin-console/application-details.ts +++ b/packages/phrases/src/locales/fr/translation/admin-console/application-details.ts @@ -33,7 +33,6 @@ const application_details = { cors_allowed_origins_placeholder: 'https://votre.site.com', cors_allowed_origins_tip: "Par défaut, toutes les origines des URI de redirection seront autorisées. En général, aucune action n'est requise pour ce champ. See the MDN doc for detailed info.", // UNTRANSLATED - add_another: 'Ajouter un autre', id_token_expiration: "Expiration du jeton d'identification", refresh_token_expiration: "Rafraîchir l'expiration du jeton", token_endpoint: 'Token Endpoint', diff --git a/packages/phrases/src/locales/fr/translation/admin-console/general.ts b/packages/phrases/src/locales/fr/translation/admin-console/general.ts index 2c584e716..cf7a76f47 100644 --- a/packages/phrases/src/locales/fr/translation/admin-console/general.ts +++ b/packages/phrases/src/locales/fr/translation/admin-console/general.ts @@ -30,7 +30,7 @@ const general = { copying: 'Copie', copied: 'Copié', required: 'Requis', - add_another: '+ Ajouter un autre', + add_another: 'Ajouter un autre', deletion_confirmation: 'Êtes-vous sûr de vouloir supprimer ce {{title}} ?', settings_nav: 'Paramètres', unsaved_changes_warning: diff --git a/packages/phrases/src/locales/ko/translation/admin-console/application-details.ts b/packages/phrases/src/locales/ko/translation/admin-console/application-details.ts index f611c5229..dd92631c9 100644 --- a/packages/phrases/src/locales/ko/translation/admin-console/application-details.ts +++ b/packages/phrases/src/locales/ko/translation/admin-console/application-details.ts @@ -33,7 +33,6 @@ const application_details = { cors_allowed_origins_placeholder: 'https://your.website.com', cors_allowed_origins_tip: '기본으로 모든 리다이렉트의 오리진들은 허용되요. 대체적으로 이 값을 건들 필요는 없어요. See the MDN doc for detailed info.', // UNTRANSLATED - add_another: '새로 추가', id_token_expiration: 'ID 토큰 만료', refresh_token_expiration: 'Refresh 토큰 만료', token_endpoint: '토큰 End-Point', diff --git a/packages/phrases/src/locales/ko/translation/admin-console/general.ts b/packages/phrases/src/locales/ko/translation/admin-console/general.ts index 65468a1f5..a0917946c 100644 --- a/packages/phrases/src/locales/ko/translation/admin-console/general.ts +++ b/packages/phrases/src/locales/ko/translation/admin-console/general.ts @@ -30,7 +30,7 @@ const general = { copying: '복사 중', copied: '복사됨', required: '필수', - add_another: '+ 새로 추가', + add_another: '새로 추가', deletion_confirmation: '정말로 {{title}}을/를 삭제할까요?', settings_nav: '설정', unsaved_changes_warning: '수정된 내용이 있어요. 정말로 현재 페이지를 벗어날까요?', diff --git a/packages/phrases/src/locales/pt-br/translation/admin-console/application-details.ts b/packages/phrases/src/locales/pt-br/translation/admin-console/application-details.ts index daab4da54..e84b034c7 100644 --- a/packages/phrases/src/locales/pt-br/translation/admin-console/application-details.ts +++ b/packages/phrases/src/locales/pt-br/translation/admin-console/application-details.ts @@ -33,7 +33,6 @@ const application_details = { cors_allowed_origins_placeholder: 'https://your.website.com', cors_allowed_origins_tip: 'Por padrão, todas as origens de URIs de redirecionamento serão permitidas. Normalmente, nenhuma ação é necessária para este campo. See the MDN doc for detailed info.', // UNTRANSLATED - add_another: 'Adicionar outro', id_token_expiration: 'Expiração do token de ID', refresh_token_expiration: 'Expiração Refresh Token', token_endpoint: 'Token Endpoint', diff --git a/packages/phrases/src/locales/pt-br/translation/admin-console/general.ts b/packages/phrases/src/locales/pt-br/translation/admin-console/general.ts index ff8c68750..a640d2e5f 100644 --- a/packages/phrases/src/locales/pt-br/translation/admin-console/general.ts +++ b/packages/phrases/src/locales/pt-br/translation/admin-console/general.ts @@ -30,7 +30,7 @@ const general = { copying: 'Copiando', copied: 'Copiado', required: 'Obrigatório', - add_another: '+ Adicionar outro', + add_another: 'Adicionar outro', deletion_confirmation: 'Tem certeza de que deseja excluir este {{title}}?', settings_nav: 'Configurações', unsaved_changes_warning: diff --git a/packages/phrases/src/locales/pt-pt/translation/admin-console/application-details.ts b/packages/phrases/src/locales/pt-pt/translation/admin-console/application-details.ts index 29f16112b..7bbbf69de 100644 --- a/packages/phrases/src/locales/pt-pt/translation/admin-console/application-details.ts +++ b/packages/phrases/src/locales/pt-pt/translation/admin-console/application-details.ts @@ -33,7 +33,6 @@ const application_details = { cors_allowed_origins_placeholder: 'https://your.website.com', cors_allowed_origins_tip: 'Por padrão, todas as origens de redirecionamento serão permitidas. Recomenda-se restringir isto. See the MDN doc for detailed info.', // UNTRANSLATED - add_another: 'Adicionar outro', id_token_expiration: 'Expiração do token de ID', refresh_token_expiration: 'Expiração do token de atualização', token_endpoint: 'Endpoint Token', diff --git a/packages/phrases/src/locales/pt-pt/translation/admin-console/general.ts b/packages/phrases/src/locales/pt-pt/translation/admin-console/general.ts index b0560d298..becbc80e5 100644 --- a/packages/phrases/src/locales/pt-pt/translation/admin-console/general.ts +++ b/packages/phrases/src/locales/pt-pt/translation/admin-console/general.ts @@ -30,7 +30,7 @@ const general = { copying: 'Copiando', copied: 'Copiado', required: 'Necessário', - add_another: '+ Adicionar outro', + add_another: 'Adicionar outro', deletion_confirmation: 'Tem a certeza que deseja eliminar isso {{title}}?', settings_nav: 'Definições', unsaved_changes_warning: 'Fez algumas alterações. Tem a certeza que deseja sair desta página?', diff --git a/packages/phrases/src/locales/tr-tr/translation/admin-console/application-details.ts b/packages/phrases/src/locales/tr-tr/translation/admin-console/application-details.ts index 5b2d977fd..408fd0747 100644 --- a/packages/phrases/src/locales/tr-tr/translation/admin-console/application-details.ts +++ b/packages/phrases/src/locales/tr-tr/translation/admin-console/application-details.ts @@ -33,7 +33,6 @@ const application_details = { cors_allowed_origins_placeholder: 'https://your.website.com', cors_allowed_origins_tip: 'Varsayılan olarak, Yönlendirme URIlerinin tüm originlerine izin verilir. Genellikle bu alan için herhangi bir işlem gerekmez. See the MDN doc for detailed info.', // UNTRANSLATED - add_another: 'Bir tane daha ekle', id_token_expiration: 'ID Token sona erme süresi', refresh_token_expiration: 'Refresh Token sona erme süresi', token_endpoint: 'Token bitiş noktası', diff --git a/packages/phrases/src/locales/tr-tr/translation/admin-console/general.ts b/packages/phrases/src/locales/tr-tr/translation/admin-console/general.ts index 59be64348..7e715c678 100644 --- a/packages/phrases/src/locales/tr-tr/translation/admin-console/general.ts +++ b/packages/phrases/src/locales/tr-tr/translation/admin-console/general.ts @@ -30,7 +30,7 @@ const general = { copying: 'Kopyalanıyor', copied: 'Kopyalandı', required: 'Gerekli', - add_another: '+ Bir tane daha ekle', + add_another: 'Bir tane daha ekle', deletion_confirmation: 'Bu dosyayı silmek istediğinize emin misiniz: {{title}}?', settings_nav: 'Ayarlar', unsaved_changes_warning: diff --git a/packages/phrases/src/locales/zh-cn/translation/admin-console/application-details.ts b/packages/phrases/src/locales/zh-cn/translation/admin-console/application-details.ts index 4f0821285..a75e1a1b0 100644 --- a/packages/phrases/src/locales/zh-cn/translation/admin-console/application-details.ts +++ b/packages/phrases/src/locales/zh-cn/translation/admin-console/application-details.ts @@ -33,7 +33,6 @@ const application_details = { cors_allowed_origins_placeholder: 'https://your.website.com', cors_allowed_origins_tip: '所有 Redirect URI 的 origin 将默认被允许。通常不需要对此字段进行操作。参见 MDN 文档以了解更多', - add_another: '新增', id_token_expiration: 'ID Token 过期时间', refresh_token_expiration: 'Refresh Token 过期时间', token_endpoint: 'Token Endpoint', diff --git a/packages/phrases/src/locales/zh-cn/translation/admin-console/general.ts b/packages/phrases/src/locales/zh-cn/translation/admin-console/general.ts index 112557c35..44c7c4a3f 100644 --- a/packages/phrases/src/locales/zh-cn/translation/admin-console/general.ts +++ b/packages/phrases/src/locales/zh-cn/translation/admin-console/general.ts @@ -30,7 +30,7 @@ const general = { copying: '复制中', copied: '已复制', required: '必填', - add_another: '+ 新增', + add_another: '新增', deletion_confirmation: '你确定要删除这个 {{title}} 吗?', settings_nav: '设置', unsaved_changes_warning: '还有未保存的变更, 确定要离开吗？',