From 40a9bc9ab2cb35533eabe4daac70c516b9d729e5 Mon Sep 17 00:00:00 2001 From: Naveed Elahi Date: Wed, 21 Feb 2024 14:48:06 +0800 Subject: [PATCH 1/3] update description of primary button in web3auth sdk uiconfig --- packages/ui/src/interfaces.ts | 5 +++-- 1 file changed, 3 insertions(+), 2 deletions(-) diff --git a/packages/ui/src/interfaces.ts b/packages/ui/src/interfaces.ts index 88c11bda5..67edb1437 100644 --- a/packages/ui/src/interfaces.ts +++ b/packages/ui/src/interfaces.ts @@ -33,8 +33,9 @@ export interface UIConfig extends WhiteLabelData { loginGridCol?: 2 | 3; /** - * decides which button will be displayed as primary button in modal - * only one button will be primary and other buttons in modal will be secondary + * Decides which button will be the focus of the modal + * For `socialLogin` the social icon will be colored + * For other options like `emailLogin` and `externalLogin` the respective buttons will be coverted into a primary button * * @defaultValue `socialLogin` */ From 9d326bfc3970da43df67e14b2a2b45d95f40035e Mon Sep 17 00:00:00 2001 From: Naveed Elahi Date: Wed, 21 Feb 2024 17:44:00 +0800 Subject: [PATCH 2/3] use lang constants --- packages/ui/src/loginModal.tsx | 24 ++++++++++++------------ 1 file changed, 12 insertions(+), 12 deletions(-) diff --git a/packages/ui/src/loginModal.tsx b/packages/ui/src/loginModal.tsx index 3c4625749..aca68dec3 100644 --- a/packages/ui/src/loginModal.tsx +++ b/packages/ui/src/loginModal.tsx @@ -1,7 +1,7 @@ import "../css/web3auth.css"; import { SafeEventEmitter } from "@toruslabs/openlogin-jrpc"; -import { applyWhiteLabelTheme } from "@toruslabs/openlogin-utils"; +import { applyWhiteLabelTheme, LANGUAGES } from "@toruslabs/openlogin-utils"; import { ADAPTER_EVENTS, BaseAdapterConfig, @@ -62,7 +62,7 @@ class LoginModal extends SafeEventEmitter { if (!uiConfig.mode) this.uiConfig.mode = "auto"; if (!uiConfig.modalZIndex) this.uiConfig.modalZIndex = "99998"; if (typeof uiConfig.displayErrorsOnModal === "undefined") this.uiConfig.displayErrorsOnModal = true; - if (!uiConfig.defaultLanguage) this.uiConfig.defaultLanguage = "en"; + if (!uiConfig.defaultLanguage) this.uiConfig.defaultLanguage = LANGUAGES.en; if (!uiConfig.appName) this.uiConfig.appName = "Web3Auth"; if (!uiConfig.loginGridCol) this.uiConfig.loginGridCol = 3; if (!uiConfig.primaryButton) this.uiConfig.primaryButton = "socialLogin"; @@ -79,10 +79,10 @@ class LoginModal extends SafeEventEmitter { initModal = async (): Promise => { const darkState = { isDark: this.isDark }; - const useLang = this.uiConfig.defaultLanguage || "en"; + const useLang = this.uiConfig.defaultLanguage || LANGUAGES.en; // Load new language resource - if (useLang === "de") { + if (useLang === LANGUAGES.de) { import("./i18n/german.json") .then((messages) => { i18n.addResourceBundle(useLang as string, "translation", messages.default); @@ -91,7 +91,7 @@ class LoginModal extends SafeEventEmitter { .catch((error) => { log.error(error); }); - } else if (useLang === "ja") { + } else if (useLang === LANGUAGES.ja) { import(`./i18n/japanese.json`) .then((messages) => { i18n.addResourceBundle(useLang as string, "translation", messages.default); @@ -100,7 +100,7 @@ class LoginModal extends SafeEventEmitter { .catch((error) => { log.error(error); }); - } else if (useLang === "ko") { + } else if (useLang === LANGUAGES.ko) { import(`./i18n/korean.json`) .then((messages) => { i18n.addResourceBundle(useLang as string, "translation", messages.default); @@ -109,7 +109,7 @@ class LoginModal extends SafeEventEmitter { .catch((error) => { log.error(error); }); - } else if (useLang === "zh") { + } else if (useLang === LANGUAGES.zh) { import(`./i18n/mandarin.json`) .then((messages) => { i18n.addResourceBundle(useLang as string, "translation", messages.default); @@ -118,7 +118,7 @@ class LoginModal extends SafeEventEmitter { .catch((error) => { log.error(error); }); - } else if (useLang === "es") { + } else if (useLang === LANGUAGES.es) { import(`./i18n/spanish.json`) .then((messages) => { i18n.addResourceBundle(useLang as string, "translation", messages.default); @@ -127,7 +127,7 @@ class LoginModal extends SafeEventEmitter { .catch((error) => { log.error(error); }); - } else if (useLang === "fr") { + } else if (useLang === LANGUAGES.fr) { import(`./i18n/french.json`) .then((messages) => { i18n.addResourceBundle(useLang as string, "translation", messages.default); @@ -136,7 +136,7 @@ class LoginModal extends SafeEventEmitter { .catch((error) => { log.error(error); }); - } else if (useLang === "pt") { + } else if (useLang === LANGUAGES.pt) { import(`./i18n/portuguese.json`) .then((messages) => { i18n.addResourceBundle(useLang as string, "translation", messages.default); @@ -145,7 +145,7 @@ class LoginModal extends SafeEventEmitter { .catch((error) => { log.error(error); }); - } else if (useLang === "nl") { + } else if (useLang === LANGUAGES.nl) { import(`./i18n/dutch.json`) .then((messages) => { i18n.addResourceBundle(useLang as string, "translation", messages.default); @@ -154,7 +154,7 @@ class LoginModal extends SafeEventEmitter { .catch((error) => { log.error(error); }); - } else if (useLang === "tr") { + } else if (useLang === LANGUAGES.tr) { import(`./i18n/turkish.json`) .then((messages) => { i18n.addResourceBundle(useLang as string, "translation", messages.default); From 6ed9dc1e5ddbbd3200cdd978bd50554aba1eb4aa Mon Sep 17 00:00:00 2001 From: Naveed Elahi Date: Wed, 21 Feb 2024 18:05:12 +0800 Subject: [PATCH 3/3] use language map constant from openlogin utils --- packages/ui/src/utils.ts | 17 ++--------------- 1 file changed, 2 insertions(+), 15 deletions(-) diff --git a/packages/ui/src/utils.ts b/packages/ui/src/utils.ts index d67c05bfb..6a36e2129 100644 --- a/packages/ui/src/utils.ts +++ b/packages/ui/src/utils.ts @@ -1,5 +1,5 @@ import { get, post } from "@toruslabs/http-helpers"; -import { LANGUAGE_TYPE } from "@toruslabs/openlogin-utils"; +import { LANGUAGE_MAP, LANGUAGE_TYPE, LANGUAGES } from "@toruslabs/openlogin-utils"; import { log, LoginMethodConfig, WALLET_ADAPTERS } from "@web3auth/base"; import { OPENLOGIN_PROVIDERS, OPENLOGIN_PROVIDERS_NAMES } from "./config"; @@ -86,19 +86,6 @@ export const validatePhoneNumber = async (phoneNumber: string): Promise = { - en: "english", - de: "german", - ja: "japanese", - ko: "korean", - zh: "mandarin", - es: "spanish", - fr: "french", - pt: "portuguese", - nl: "dutch", - tr: "turkish", -}; - interface NavigatorLanguage { userLanguage?: string; } @@ -110,5 +97,5 @@ export const getUserLanguage = (defaultLanguage: string | undefined): LANGUAGE_T typeof window !== "undefined" ? (window.navigator as NavigatorLanguage).userLanguage || window.navigator.language || "en-US" : "en-US"; userLanguage = browserLanguage.split("-")[0]; } - return Object.prototype.hasOwnProperty.call(languageMap, userLanguage) ? (userLanguage as LANGUAGE_TYPE) : "en"; + return Object.prototype.hasOwnProperty.call(LANGUAGE_MAP, userLanguage) ? (userLanguage as LANGUAGE_TYPE) : LANGUAGES.en; };