Merge remote-tracking branch 'origin/webapp-dev' into koni/dev/issue-…

…airdrop-and-responsive
Koniverse · Oct 20, 2023 · 567f4be · 567f4be
2 parents 092d27b + 088b776
commit 567f4be
Show file tree

Hide file tree

Showing 7 changed files with 78 additions and 22 deletions.
diff --git a/packages/extension-base/src/koni/background/handlers/Extension.ts b/packages/extension-base/src/koni/background/handlers/Extension.ts
@@ -2904,7 +2904,7 @@ export default class KoniExtension {
     oldPassword }: RequestChangeMasterPassword): ResponseChangeMasterPassword {
     try {
       // Remove isMasterPassword meta if createNew
-      if (createNew) {
+      if (createNew && !keyring.keyring.hasMasterPassword) {
         const pairs = keyring.getPairs();
 
         for (const pair of pairs) {

diff --git a/packages/extension-koni-ui/src/Popup/Confirmations/variants/AuthorizeConfirmation.tsx b/packages/extension-koni-ui/src/Popup/Confirmations/variants/AuthorizeConfirmation.tsx
@@ -74,6 +74,28 @@ function Component ({ className, request }: Props) {
     return !visibleAccounts.filter(({ address }) => !!selectedMap[address]).length;
   }, [selectedMap, visibleAccounts]);
 
+  const noAvailableTitle = useMemo(() => {
+    switch (accountAuthType) {
+      case 'substrate':
+        return t('No available Substrate account');
+      case 'evm':
+        return t('No available EVM account');
+      default:
+        return t('No available account');
+    }
+  }, [accountAuthType, t]);
+
+  const noAvailableDescription = useMemo(() => {
+    switch (accountAuthType) {
+      case 'substrate':
+        return t("You don't have any Substrate account to connect. Please create one or skip this step by hitting Cancel.");
+      case 'evm':
+        return t("You don't have any EVM account to connect. Please create one or skip this step by hitting Cancel.");
+      default:
+        return t("You don't have any account to connect. Please create one or skip this step by hitting Cancel.");
+    }
+  }, [accountAuthType, t]);
+
   // Handle buttons actions
   const onBlock = useCallback(() => {
     setLoading(true);
@@ -176,7 +198,7 @@ function Component ({ className, request }: Props) {
         >
           {
             visibleAccounts.length === 0
-              ? t('No available account')
+              ? noAvailableTitle
               : t('Choose the account(s) you’d like to connect')
           }
         </div>
@@ -215,7 +237,7 @@ function Component ({ className, request }: Props) {
         <div className='description'>
           {
             visibleAccounts.length === 0
-              ? t("You don't have any accounts to connect. Please create or import an account.")
+              ? noAvailableDescription
               : t('Make sure you trust this site before connecting')
           }
         </div>

diff --git a/...s/extension-koni-ui/src/Popup/Confirmations/variants/ConnectWalletConnectConfirmation.tsx b/...s/extension-koni-ui/src/Popup/Confirmations/variants/ConnectWalletConnectConfirmation.tsx
@@ -183,6 +183,7 @@ function Component ({ className, request }: Props) {
                         appliedAccounts={appliedAccounts}
                         availableAccounts={availableAccounts}
                         id={`${namespace}-accounts`}
+                        namespace={namespace}
                         onApply={onApplyModal(namespace)}
                         onCancel={onCancelModal(namespace)}
                         onSelectAccount={_onSelectAccount(namespace)}

diff --git a/packages/extension-koni-ui/src/Popup/Keyring/ApplyMasterPassword/index.tsx b/packages/extension-koni-ui/src/Popup/Keyring/ApplyMasterPassword/index.tsx
@@ -83,6 +83,14 @@ const intersectionArray = (array1: AccountJson[], array2: AccountJson[]): Accoun
   return array1.filter((account) => array2.find((acc) => acc.address === account.address));
 };
 
+const filterAccountMigrated = (acc: AccountJson) => {
+  return acc.address !== ALL_ACCOUNT_KEY && !acc.isExternal && acc.isMasterPassword && !acc.isInjected;
+};
+
+const filterAccountCanMigrate = (acc: AccountJson) => {
+  return acc.address !== ALL_ACCOUNT_KEY && !acc.isExternal && !acc.isInjected;
+};
+
 const Component: React.FC<Props> = (props: Props) => {
   const { isWebUI } = useContext(ScreenContext);
   const navigate = useNavigate();
@@ -105,11 +113,11 @@ const Component: React.FC<Props> = (props: Props) => {
 
   const checkUnlock = useUnlockChecker();
 
-  const migratedRef = useRef<AccountJson[]>(accounts.filter((acc) => acc.address !== ALL_ACCOUNT_KEY && !acc.isExternal && acc.isMasterPassword));
+  const migratedRef = useRef<AccountJson[]>(accounts.filter(filterAccountMigrated));
 
   const migrated = useMemo(() => {
     const oldVal = migratedRef.current;
-    const newVal = accounts.filter((acc) => acc.address !== ALL_ACCOUNT_KEY && !acc.isExternal && acc.isMasterPassword);
+    const newVal = accounts.filter(filterAccountMigrated);
     const result = intersectionArray(oldVal, newVal);
 
     migratedRef.current = result;
@@ -119,7 +127,7 @@ const Component: React.FC<Props> = (props: Props) => {
 
   const canMigrate = useMemo(
     () => accounts
-      .filter((acc) => acc.address !== ALL_ACCOUNT_KEY && !acc.isExternal)
+      .filter(filterAccountCanMigrate)
       .filter((acc) => !migrated.find((item) => item.address === acc.address))
     , [accounts, migrated]
   );

diff --git a/packages/extension-koni-ui/src/Popup/Keyring/CreatePassword.tsx b/packages/extension-koni-ui/src/Popup/Keyring/CreatePassword.tsx
@@ -5,7 +5,7 @@ import { AlertBox, InfoIcon, InstructionContainer, InstructionContentType, Layou
 import { CREATE_RETURN, REQUEST_CREATE_PASSWORD_MODAL } from '@subwallet/extension-koni-ui/constants';
 import { DEFAULT_ROUTER_PATH } from '@subwallet/extension-koni-ui/constants/router';
 import { ScreenContext } from '@subwallet/extension-koni-ui/contexts/ScreenContext';
-import { useFocusFormItem, useTranslation } from '@subwallet/extension-koni-ui/hooks';
+import { useFocusFormItem, useNotification, useTranslation } from '@subwallet/extension-koni-ui/hooks';
 import { keyringChangeMasterPassword } from '@subwallet/extension-koni-ui/messaging';
 import { RootState } from '@subwallet/extension-koni-ui/stores';
 import { ThemeProps } from '@subwallet/extension-koni-ui/types';
@@ -53,12 +53,13 @@ const Component: React.FC<Props> = ({ className }: Props) => {
 
   const [returnPath, setReturnStorage] = useLocalStorage(CREATE_RETURN, DEFAULT_ROUTER_PATH);
 
+  const notification = useNotification();
+
   const passwordRules = useMemo(() => renderBasePasswordRules(t('Password'), t), [t]);
   const confirmPasswordRules = useMemo(() => renderBaseConfirmPasswordRules(FormFieldName.PASSWORD, t), [t]);
 
   const [form] = Form.useForm<CreatePasswordFormState>();
   const [isDisabled, setIsDisable] = useState(true);
-  const [submitError, setSubmitError] = useState('');
 
   const [loading, setLoading] = useState(false);
 
@@ -94,22 +95,27 @@ const Component: React.FC<Props> = ({ className }: Props) => {
         newPassword: password
       }).then((res) => {
         if (!res?.status) {
-          setSubmitError(res.errors[0]);
+          notification({
+            message: res.errors[0],
+            type: 'error'
+          });
         } else {
           onComplete();
         }
       }).catch((e: Error) => {
-        setSubmitError(e.message);
+        notification({
+          message: e.message,
+          type: 'error'
+        });
       }).finally(() => {
         setLoading(false);
       });
     }
-  }, [onComplete]);
+  }, [onComplete, notification]);
 
   const onUpdate: Callbacks<CreatePasswordFormState>['onFieldsChange'] = useCallback((changedFields: FieldData[], allFields: FieldData[]) => {
     const { empty, error } = simpleCheckForm(allFields);
 
-    setSubmitError('');
     setIsDisable(error || empty);
   }, []);
 
@@ -213,12 +219,6 @@ const Component: React.FC<Props> = ({ className }: Props) => {
                   type='warning'
                 />
               </Form.Item>
-              {submitError && (
-                <Form.Item
-                  help={submitError}
-                  validateStatus='error'
-                />
-              )}
               {isWebUI && (
                 <Button
                   disabled={isDisabled}

diff --git a/packages/extension-koni-ui/src/Popup/Root.tsx b/packages/extension-koni-ui/src/Popup/Root.tsx
@@ -174,6 +174,8 @@ function DefaultRoute ({ children }: {children: React.ReactNode}): React.ReactEl
       redirectObj.redirect = migratePasswordUrl;
     } else if (hasMasterPassword && needUnlock) {
       redirectObj.redirect = loginUrl;
+    } else if (hasMasterPassword && pathName === createPasswordUrl) {
+      redirectObj.redirect = DEFAULT_ROUTER_PATH;
     } else if (!hasMasterPassword) {
       if (isNoAccount) {
         if (!allowPreventWelcomeUrls.includes(pathName)) {

diff --git a/packages/extension-koni-ui/src/components/WalletConnect/Account/WCAccountSelect.tsx b/packages/extension-koni-ui/src/components/WalletConnect/Account/WCAccountSelect.tsx
@@ -13,14 +13,15 @@ import { Button, Icon, ModalContext, SwList } from '@subwallet/react-ui';
 import { SwListSectionRef } from '@subwallet/react-ui/es/sw-list';
 import CN from 'classnames';
 import { CheckCircle } from 'phosphor-react';
-import React, { useCallback, useContext, useEffect, useRef } from 'react';
+import React, { useCallback, useContext, useEffect, useMemo, useRef } from 'react';
 import styled from 'styled-components';
 
 import { GeneralEmptyList } from '../../EmptyList';
 import WCAccountInput from './WCAccountInput';
 
 interface Props extends ThemeProps {
   id: string;
+  namespace: string;
   selectedAccounts: string[];
   appliedAccounts: string[];
   availableAccounts: AccountJson[];
@@ -33,7 +34,7 @@ interface Props extends ThemeProps {
 const renderEmpty = () => <GeneralEmptyList />;
 
 const Component: React.FC<Props> = (props: Props) => {
-  const { appliedAccounts, availableAccounts, className, id, onApply, onCancel, onSelectAccount, selectedAccounts, useModal } = props;
+  const { appliedAccounts, availableAccounts, className, id, namespace, onApply, onCancel, onSelectAccount, selectedAccounts, useModal } = props;
 
   const { t } = useTranslation();
 
@@ -43,6 +44,28 @@ const Component: React.FC<Props> = (props: Props) => {
 
   const isActive = checkActive(id);
 
+  const noAccountTitle = useMemo(() => {
+    switch (namespace) {
+      case 'polkadot':
+        return t('No available Substrate account');
+      case 'eip155':
+        return t('No available EVM account');
+      default:
+        return t('No available account');
+    }
+  }, [namespace, t]);
+
+  const noAccountDescription = useMemo(() => {
+    switch (namespace) {
+      case 'polkadot':
+        return t("You don't have any Substrate account to connect. Please create one or skip this step by hitting Cancel.");
+      case 'eip155':
+        return t("You don't have any EVM account to connect. Please create one or skip this step by hitting Cancel.");
+      default:
+        return t("You don't have any account to connect. Please create one or skip this step by hitting Cancel.");
+    }
+  }, [namespace, t]);
+
   const onOpenModal = useCallback(() => {
     activeModal(id);
   }, [activeModal, id]);
@@ -86,8 +109,8 @@ const Component: React.FC<Props> = (props: Props) => {
         !availableAccounts.length
           ? (
             <AlertBox
-              description={t('You don’t have any accounts. Please create a new account')}
-              title={t('No accounts found')}
+              description={noAccountDescription}
+              title={noAccountTitle}
               type='warning'
             />
           )