v2.0.15

manifest.json

@@ -1,7 +1,7 @@
 {
   "manifest_version": 2,
   "name": "Pali Wallet",
-  "version": "2.0.14",
+  "version": "2.0.15",
   "icons": {
     "16": "assets/icons/favicon-16.png",
     "32": "assets/icons/favicon-32.png",

package.json

@@ -1,6 +1,6 @@
 {
   "name": "paliwallet",
-  "version": "2.0.14",
+  "version": "2.0.15",
   "description": "A Non-Custodial Crypto Wallet",
   "private": true,
   "repository": {
@@ -48,7 +48,7 @@
     "@babel/runtime": "^7.21.5",
     "@headlessui/react": "^1.6.0",
     "@heroicons/react": "^1.0.5",
-    "@pollum-io/sysweb3-keyring": "^1.0.477",
+    "@pollum-io/sysweb3-keyring": "^1.0.478",
     "@pollum-io/sysweb3-network": "^1.0.95",
     "@pollum-io/sysweb3-utils": "^1.1.232",
     "@reduxjs/toolkit": "^1.4.0",

source/assets/locales/en.json

@@ -445,7 +445,7 @@
     "formValue": "Form value",
     "tokenDecimals": "Token Decimals",
     "tokenSuccessfullyAdded": "Token successfully added!",
-    "wasSucessfullyAdded": "was successfully added to your wallet.",
+    "wasSuccessfullyAdded": "was successfully added to your wallet.",
     "verifyTheCurrentNetwork": "Verify the current network",
     "verifyTheCurrentNetworkMessage": "This token probably is not available in the current network. Verify the token network and try again.",
     "verifyTheCurrentNetworkLog": "Invalid contract address. Verify the current contract address.",

source/assets/locales/es.json

@@ -445,7 +445,7 @@
     "formValue": "Valor del formulario",
     "tokenDecimals": "Decimales del token",
     "tokenSuccessfullyAdded": "Token agregado correctamente!",
-    "wasSucessfullyAdded": "se ha agregado con éxito a su monedero.",
+    "wasSuccessfullyAdded": "se ha agregado con éxito a su monedero.",
     "verifyTheCurrentNetwork": "Verificar la red actual",
     "verifyTheCurrentNetworkMessage": "Este token probablemente no está disponible en la red actual. Verifique la red del token e inténtelo de nuevo.",
     "verifyTheCurrentNetworkLog": "Dirección de contrato no válida. Verifique la dirección de contrato actual.",

source/assets/locales/pt-br.json

@@ -315,7 +315,7 @@
     "formValue": "Form value",
     "tokenDecimals": "Token Decimals",
     "tokenSuccessfullyAdded": "Token successfully added!",
-    "wasSucessfullyAdded": "was successfully added to your wallet.",
+    "wasSuccessfullyAdded": "was successfully added to your wallet.",
     "verifyTheCurrentNetwork": "Verify the current network",
     "verifyTheCurrentNetworkMessage": "This token probably is not available in the current network. Verify the token network and try again.",
     "verifyTheCurrentNetworkLog": "Invalid contract address. Verify the current contract address.",

source/components/Modal/WarningBaseModal.tsx

@@ -142,7 +142,7 @@ export const ImportWalletWarning = ({
   );
 };
 
-export const TokenSuccessfulyAdded = ({
+export const TokenSuccessfullyAdded = ({
   phraseOne,
   onClose,
   show = true,
@@ -169,7 +169,7 @@ export const TokenSuccessfulyAdded = ({
   </ModalBase>
 );
 
-export const TimeSetSuccessfuly = ({
+export const TimeSetSuccessfully = ({
   phraseOne,
   onClose,
   show = true,
@@ -238,7 +238,6 @@ export const TxSuccessful = ({
   title,
 }: IDefaultModal) => {
   const { t } = useTranslation();
-  const navigate = useNavigate();
 
   return (
     <ModalBase onClose={onClose} show={show}>
@@ -253,7 +252,7 @@ export const TxSuccessful = ({
           id="unlock-btn"
           type="submit"
           className="bg-white w-[22rem] h-10 text-brand-blue200 text-base mb-12 font-base font-medium rounded-2xl"
-          onClick={() => navigate('/home')}
+          onClick={onClose}
         >
           {t('buttons.ok')}
         </Button>

source/pages/Home/Panel/components/Transactions/EVM/EvmList.tsx

@@ -1,4 +1,4 @@
-import React, { useEffect, useState } from 'react';
+import React, { useEffect, useMemo, useState } from 'react';
 import { useSelector } from 'react-redux';
 
 import { useTransactionsListConfig } from '../utils/useTransactionsInfos';
@@ -16,7 +16,6 @@ import {
   handleUpdateTransaction,
   isERC20Transfer,
 } from 'utils/transactions';
-
 export const EvmTransactionsList = ({
   userTransactions,
 }: {
@@ -30,7 +29,6 @@ export const EvmTransactionsList = ({
     activeNetwork: { chainId },
     isLastTxConfirmed,
   } = useSelector((state: RootState) => state.vault);
-
   const {
     filteredTransactions,
     formatTimeStamp,
@@ -43,23 +41,27 @@ export const EvmTransactionsList = ({
   const [modalData, setModalData] = useState<modalDataType>();
   const [isOpenModal, setIsOpenModal] = useState<boolean>(false);
   const [showModal, setShowModal] = useState(false);
+  const [groupedTransactions, setGroupedTransactions] = useState<{
+    [date: string]: ITransactionInfoEvm[];
+  }>({});
   const { navigate } = useUtils();
   const { getFiatAmount } = usePrice();
   const { wallet } = getController();
-
-  const groupedTransactions = {};
-
-  filteredTransactions.forEach((tx) => {
-    const formattedDate = formatTimeStamp(tx.timestamp);
-
-    if (!groupedTransactions[formattedDate]) {
-      groupedTransactions[formattedDate] = [];
-    }
-
-    groupedTransactions[formattedDate].push(tx);
-  });
-
-  const currentAccount = accounts[activeAccount.type][activeAccount.id];
+  useEffect(() => {
+    const grouped = {};
+    filteredTransactions.forEach((tx) => {
+      const formattedDate = formatTimeStamp(tx.timestamp);
+      if (!grouped[formattedDate]) {
+        grouped[formattedDate] = [];
+      }
+      grouped[formattedDate].push(tx);
+    });
+    setGroupedTransactions(grouped);
+  }, [filteredTransactions]);
+  const currentAccount = useMemo(
+    () => accounts[activeAccount.type][activeAccount.id],
+    [accounts, activeAccount]
+  );
   const EvmTransactionsListComponent = ({
     tx,
   }: {
@@ -80,25 +82,20 @@ export const EvmTransactionsList = ({
         );
       }
     };
-
     const isTxCanceled = tx?.isCanceled === true;
     const isConfirmed = tx.confirmations > 0;
     const isErc20Tx = isERC20Transfer(tx as any);
-
     const isTxSent = isBitcoinBased
       ? false
       : tx.from.toLowerCase() === currentAccount.address.toLowerCase();
-
     const tokenValue = !isConfirmed
       ? typeof tx.value === 'string'
         ? tx.value
         : Number(tx.value.hex) / 1e18
       : Number(tx.value) / 1e18;
-
     const finalTxValue = isErc20Tx
       ? Number(getERC20TransferValue(tx as any)) / 1e18
       : tokenValue;
-
     return (
       <div className="flex flex-col w-full border-b border-dashed border-bkg-deepBlue">
         <div className="flex justify-between py-2 w-full">
@@ -114,7 +111,7 @@ export const EvmTransactionsList = ({
           <div className="flex items-center gap-4">
             <div className="flex flex-col justify-end items-end">
               <div className="text-white text-xs font-normal">
-                {Number(finalTxValue).toFixed(4)}{' '}
+                {Number(finalTxValue).toFixed(4)}
                 {getTokenSymbol(isErc20Tx, coinsList, tx)}
               </div>
               <div className="text-brand-gray200 text-xs font-normal">
@@ -128,10 +125,7 @@ export const EvmTransactionsList = ({
                   src="/assets/icons/detailArrow.svg"
                   onClick={() =>
                     navigate('/home/details', {
-                      state: {
-                        id: null,
-                        hash: tx[txId],
-                      },
+                      state: { id: null, hash: tx[txId] },
                     })
                   }
                 />
@@ -144,7 +138,6 @@ export const EvmTransactionsList = ({
       </div>
     );
   };
-
   useEffect(() => {
     if (!currentAccount.transactions.ethereum?.[chainId]) {
       return;
@@ -153,22 +146,18 @@ export const EvmTransactionsList = ({
     const lastTx = currentAccount.transactions.ethereum[chainId][
       lastIndex
     ] as IEvmTransaction;
-
     if (isLastTxConfirmed?.[chainId]) {
       return;
     }
-
     if (lastTx?.confirmations === 0) {
       wallet.setIsLastTxConfirmed(chainId, false);
       return;
     }
-
     if (lastTx?.confirmations > 0 && !isLastTxConfirmed?.[chainId]) {
       setShowModal(true);
       wallet.setIsLastTxConfirmed(chainId, true);
     }
   }, [currentAccount]);
-
   return (
     <>
       <StatusModal

source/pages/Settings/AutoLock.tsx

@@ -5,7 +5,7 @@ import { useSelector } from 'react-redux';
 import { useNavigate } from 'react-router-dom';
 
 import { Layout, Button } from 'components/index';
-import { TimeSetSuccessfuly } from 'components/Modal/WarningBaseModal';
+import { TimeSetSuccessfully } from 'components/Modal/WarningBaseModal';
 import { RootState } from 'state/store';
 import { getController } from 'utils/browser';
 
@@ -67,7 +67,7 @@ const AutolockView = () => {
           {t('settings.setAutoLockTime')}
         </p>
       </div>
-      <TimeSetSuccessfuly
+      <TimeSetSuccessfully
         show={confirmed}
         onClose={() => {
           setConfirmed(false);

source/pages/SwitchNetwork/NetworkInfo.ts

@@ -1,5 +1,5 @@
 import { useMemo } from 'react';
 import { useSelector } from 'react-redux';
 
 import { INetwork } from '@pollum-io/sysweb3-network';
 
@@ -25,19 +25,22 @@
 const PINK_COLOR = 'text-brand-deepPink100';
 const BLUE_COLOR = 'text-brand-blue200';
 
-export const useNetworkInfo = (setedNetwork?: string): INetworkInfo => {
-  const isBitcoinBased = useSelector(
-    (state: RootState) => state.vault.isBitcoinBased
-  );
-  const networks = useSelector((state: RootState) => state.vault.networks);
-
+export const useNetworkInfo = ({
+  network,
+  isBitcoinBased,
+  networks,
+}: {
+  isBitcoinBased?: boolean;
+  network?: string;
+  networks: RootState['vault']['networks'];
+}): INetworkInfo => {
   const filteredNetworks = useMemo(() => {
-    if (setedNetwork !== '') {
-      return setedNetwork === 'EVM'
+    if (network !== '') {
+      return network === 'EVM'
         ? Object.values(networks.syscoin)
         : Object.values(networks.ethereum);
     }
-  }, [setedNetwork, isBitcoinBased, networks]);
+  }, [network, isBitcoinBased, networks]);
 
   const utxoNetwork: INetworkInfo = {
     connectedNetwork: NetworkType.UTXO,
@@ -65,8 +68,8 @@
 
   let value: any;
 
-  if (setedNetwork) {
-    if (setedNetwork === 'EVM') {
+  if (network) {
+    if (network === 'EVM') {
       value = otherNetworkInfo;
     } else {
       value = utxoNetwork;

source/pages/SwitchNetwork/NetworkList.tsx

@@ -1,5 +1,5 @@
 import { uniqueId } from 'lodash';
-import React, { useState } from 'react';
+import React, { useMemo, useState } from 'react';
 import { useSelector } from 'react-redux';
 
 import { INetwork } from '@pollum-io/sysweb3-network';
@@ -14,7 +14,9 @@ import { useNetworkInfo } from './NetworkInfo';
 
 export const NetworkList = ({ isChanging }: { isChanging: boolean }) => {
   const { wallet } = getController();
-  const { isBitcoinBased } = useSelector((state: RootState) => state.vault);
+  const { isBitcoinBased, networks } = useSelector(
+    (state: RootState) => state.vault
+  );
   const [selectCurrentNetwork, setSelectCurrentNetwork] = useState({
     current: null,
     chain: '',
@@ -29,23 +31,35 @@ export const NetworkList = ({ isChanging }: { isChanging: boolean }) => {
     selectedNetworkText,
     leftLogo,
     rightLogo,
-  } = useNetworkInfo();
-  const chainName = isBitcoinBased ? 'ethereum' : 'syscoin';
-
-  const networks = useSelector((state: RootState) => state.vault.networks);
-
-  let newNetworks;
+  } = useNetworkInfo({ isBitcoinBased, networks });
 
-  isBitcoinBased
-    ? (newNetworks = Object.values(networks.ethereum))
-    : (newNetworks = Object.values(networks.syscoin));
+  const chainName = useMemo(
+    () => (isBitcoinBased ? 'ethereum' : 'syscoin'),
+    [isBitcoinBased]
+  );
 
-  const testnetNetworks = newNetworks.filter((obj) => obj?.isTestnet === true);
+  const newNetworks = useMemo(
+    () =>
+      isBitcoinBased
+        ? Object.values(networks.ethereum)
+        : Object.values(networks.syscoin),
+    [isBitcoinBased]
+  ); //todo: change name
 
-  let mainetNetworks = newNetworks.filter((obj) => obj?.isTestnet !== true);
+  const testnetNetworks = useMemo(
+    () => newNetworks.filter((obj) => obj?.isTestnet),
+    [newNetworks]
+  );
 
-  mainetNetworks = mainetNetworks.sort(
-    (a, b) => getChainIdPriority(a.chainId) - getChainIdPriority(b.chainId)
+  const mainnetNetworks = useMemo(
+    () =>
+      newNetworks
+        .filter((obj) => !obj?.isTestnet)
+        .sort(
+          (a, b) =>
+            getChainIdPriority(a.chainId) - getChainIdPriority(b.chainId)
+        ),
+    []
   );
 
   const handleChangeNetwork = async (network: INetwork, chain: string) => {
@@ -97,7 +111,7 @@ export const NetworkList = ({ isChanging }: { isChanging: boolean }) => {
           <p className="text-brand-gray200 text-xs font-medium mb-2">
             {selectedNetworkText}
           </p>
-          {mainetNetworks.map((currentNetwork: INetwork) => (
+          {mainnetNetworks.map((currentNetwork: INetwork) => (
             <div
               key={uniqueId()}
               className={`${

source/pages/SwitchNetwork/SwitchNetwork.tsx

@@ -14,15 +14,15 @@ import { NetworkList } from './NetworkList';
 export const SwitchNetwork = () => {
   const { state }: { state: any } = useLocation();
   const { t } = useTranslation();
-  const activeNetwork = useSelector(
-    (state: RootState) => state.vault.activeNetwork
+  const { isBitcoinBased, activeNetwork, networks } = useSelector(
+    (rootState: RootState) => rootState.vault
   );
   const {
     connectedNetwork,
     networkThatNeedsChanging,
     connectedColor,
     networkNeedsChangingColor,
-  } = useNetworkInfo();
+  } = useNetworkInfo({ isBitcoinBased, networks });
 
   const networkLabel = useMemo(
     () => (