[Update] Fix UI for POS -> ETH

Koniverse · Dec 25, 2024 · 8136ea7 · 8136ea7
1 parent 6f3f3b8
commit 8136ea7
Show file tree

Hide file tree

Showing 5 changed files with 51 additions and 2 deletions.
diff --git a/packages/extension-base/src/services/balance-service/transfer/xcm/posBridge.ts b/packages/extension-base/src/services/balance-service/transfer/xcm/posBridge.ts
@@ -168,3 +168,13 @@ export function _isPosChainBridge (srcChain: string, destChain: string): boolean
 
   return false;
 }
+
+export function _isPosChainL2Bridge (srcChain: string, destChain: string): boolean {
+  if (srcChain === 'polygon_amoy' && destChain === COMMON_CHAIN_SLUGS.ETHEREUM_SEPOLIA) {
+    return true;
+  } else if (srcChain === 'polygon' && destChain === COMMON_CHAIN_SLUGS.ETHEREUM) {
+    return true;
+  }
+
+  return false;
+}
diff --git a/packages/extension-koni-ui/src/Popup/Transaction/variants/SendFund.tsx b/packages/extension-koni-ui/src/Popup/Transaction/variants/SendFund.tsx
@@ -10,7 +10,7 @@ import { ActionType } from '@subwallet/extension-base/core/types';
 import { getAvailBridgeGatewayContract, getSnowBridgeGatewayContract } from '@subwallet/extension-base/koni/api/contract-handler/utils';
 import { isAvailChainBridge } from '@subwallet/extension-base/services/balance-service/transfer/xcm/availBridge';
 import { _isPolygonChainBridge } from '@subwallet/extension-base/services/balance-service/transfer/xcm/polygonBridge';
-import { _isPosChainBridge } from '@subwallet/extension-base/services/balance-service/transfer/xcm/posBridge';
+import { _isPosChainBridge, _isPosChainL2Bridge } from '@subwallet/extension-base/services/balance-service/transfer/xcm/posBridge';
 import { _getAssetDecimals, _getAssetName, _getAssetOriginChain, _getAssetSymbol, _getContractAddressOfToken, _getMultiChainAsset, _getOriginChainOfAsset, _getTokenMinAmount, _isChainEvmCompatible, _isNativeToken, _isTokenTransferredByEvm } from '@subwallet/extension-base/services/chain-service/utils';
 import { TON_CHAINS } from '@subwallet/extension-base/services/earning-service/constants';
 import { SWTransactionResponse } from '@subwallet/extension-base/services/transaction-service/types';
@@ -180,6 +180,14 @@ const Component = ({ className = '', isAllAccount, targetAccountProxy }: Compone
     return !!chainInfo && !!assetInfo && _isChainEvmCompatible(chainInfo) && destChainValue === chainValue && _isNativeToken(assetInfo);
   }, [chainInfoMap, chainValue, destChainValue, assetInfo]);
 
+  const disabledToAddressInput = useMemo(() => {
+    if (_isPosChainL2Bridge(chainValue, destChainValue)) {
+      return true;
+    }
+
+    return false;
+  }, [chainValue, destChainValue]);
+
   const [loading, setLoading] = useState(false);
   const [isTransferAll, setIsTransferAll] = useState(false);
 
@@ -378,6 +386,13 @@ const Component = ({ className = '', isAllAccount, targetAccountProxy }: Compone
       }
 
       if (part.from || part.destChain) {
+        const destChain = part.destChain || '';
+        const chainValue = values.chain || '';
+
+        if (_isPosChainL2Bridge(chainValue, destChain)) {
+          form.setFieldValue('to', values.from);
+        }
+
         setForceUpdateMaxValue(isTransferAll ? {} : undefined);
       }
 
@@ -883,6 +898,7 @@ const Component = ({ className = '', isAllAccount, targetAccountProxy }: Compone
           >
             <AddressInputNew
               chainSlug={destChainValue}
+              disabled={disabledToAddressInput}
               dropdownHeight={isNotShowAccountSelector ? 317 : 257}
               key={addressInputRenderKey}
               label={`${t('To')}:`}

diff --git a/packages/extension-koni-ui/src/components/Field/AddressInputNew.tsx b/packages/extension-koni-ui/src/components/Field/AddressInputNew.tsx
@@ -402,6 +402,7 @@ function Component (props: Props, ref: ForwardedRef<AddressInputRef>): React.Rea
     <>
       <div className={CN(className, '-input-container')}>
         <AutoComplete
+          disabled={disabled}
           dropdownRender={dropdownRender}
           fieldNames={autoCompleteFieldNames}
           listHeight={dropdownListHeight}
@@ -480,6 +481,7 @@ function Component (props: Props, ref: ForwardedRef<AddressInputRef>): React.Rea
             showAddressBook &&
             (
               <Button
+                disabled={disabled}
                 icon={(
                   <Icon
                     phosphorIcon={Book}

diff --git a/packages/extension-web-ui/src/Popup/Transaction/variants/SendFund.tsx b/packages/extension-web-ui/src/Popup/Transaction/variants/SendFund.tsx
@@ -41,7 +41,7 @@ import { isAddress, isEthereumAddress } from '@polkadot/util-crypto';
 
 import { FreeBalance, TransactionContent, TransactionFooter } from '../parts';
 import { _isPolygonChainBridge } from '@subwallet/extension-base/services/balance-service/transfer/xcm/polygonBridge';
-import { _isPosChainBridge } from '@subwallet/extension-base/services/balance-service/transfer/xcm/posBridge';
+import { _isPosChainBridge, _isPosChainL2Bridge } from '@subwallet/extension-base/services/balance-service/transfer/xcm/posBridge';
 
 type Props = ThemeProps & {
   modalContent?: boolean;
@@ -267,6 +267,14 @@ const _SendFund = ({ className = '', modalContent }: Props): React.ReactElement<
     return !!chainInfo && !!assetInfo && _isChainEvmCompatible(chainInfo) && destChain === chain && _isNativeToken(assetInfo);
   }, [chainInfoMap, chain, destChain, assetInfo]);
 
+  const disabledToAddressInput = useMemo(() => {
+    if (_isPosChainL2Bridge(chain, destChain)) {
+      return true;
+    }
+
+    return false;
+  }, [chain, destChain]);
+
   const [loading, setLoading] = useState(false);
   const [isTransferAll, setIsTransferAll] = useState(false);
   const [, update] = useState({});
@@ -457,6 +465,17 @@ const _SendFund = ({ className = '', modalContent }: Props): React.ReactElement<
           validateField.push('to');
         }
 
+        if (part.from || part.destChain) {
+          const destChain = part.destChain || '';
+          const chainValue = values.chain || '';
+
+          if (_isPosChainL2Bridge(chainValue, destChain)) {
+            form.setFieldValue('to', values.from);
+          }
+
+          setForceUpdateMaxValue(isTransferAll ? {} : undefined);
+        }
+
         setIsTransferAll(false);
         setForceUpdateMaxValue(undefined);
       }
@@ -886,6 +905,7 @@ const _SendFund = ({ className = '', modalContent }: Props): React.ReactElement<
             validateTrigger='onBlur'
           >
             <AddressInput
+              disabled={disabledToAddressInput}
               addressPrefix={destChainNetworkPrefix}
               allowDomain={true}
               chain={destChain}

diff --git a/packages/extension-web-ui/src/components/Field/AddressInput.tsx b/packages/extension-web-ui/src/components/Field/AddressInput.tsx
@@ -278,6 +278,7 @@ function Component (props: Props, ref: ForwardedRef<InputRef>): React.ReactEleme
               showAddressBook &&
               (
                 <Button
+                  disabled={disabled}
                   icon={(
                     <Icon
                       phosphorIcon={Book}
-Original file line number
+Diff line change
@@ Expand Up @@
                   showAddressBook &&
                   (
                     <Button
+                      disabled={disabled}
                       icon={(
                         <Icon
                           phosphorIcon={Book}
@@ Expand Down @@