diff --git a/src/apps/popup/pages/contact-details/index.tsx b/src/apps/popup/pages/contact-details/index.tsx
index 8e9a5eeec..ef6eaf767 100644
--- a/src/apps/popup/pages/contact-details/index.tsx
+++ b/src/apps/popup/pages/contact-details/index.tsx
@@ -2,13 +2,13 @@ import React, { useCallback, useMemo, useState } from 'react';
 import { Trans, useTranslation } from 'react-i18next';
 import { useSelector } from 'react-redux';
 import { useParams } from 'react-router-dom';
-import { PasswordProtectionPage } from 'src/apps/popup/pages/password-protection-page';
 
 import { getBlockExplorerAccountUrl } from '@src/constants';
 
 import { DeleteContactPageContent } from '@popup/pages/contact-details/deleting';
 import { ContactDetails } from '@popup/pages/contact-details/details';
 import { EditingContactPageContent } from '@popup/pages/contact-details/editing';
+import { PasswordProtectionPage } from '@popup/pages/password-protection-page';
 import { RouterPath, useTypedNavigate } from '@popup/router';
 
 import {
diff --git a/src/apps/popup/pages/home/components/tokens-list/index.tsx b/src/apps/popup/pages/home/components/tokens-list/index.tsx
index d36f2e0bd..3b5909d35 100644
--- a/src/apps/popup/pages/home/components/tokens-list/index.tsx
+++ b/src/apps/popup/pages/home/components/tokens-list/index.tsx
@@ -5,12 +5,12 @@ import styled from 'styled-components';
 import { RouterPath, useTypedNavigate } from '@popup/router';
 
 import { TokenType, useCasperToken } from '@hooks/use-casper-token';
-import { useFetchErc20Tokens } from '@hooks/use-fetch-erc20-tokens';
 
 import { SpaceBetweenFlexRow, SpacingSize } from '@libs/layout';
+import { useFetchCep18Tokens } from '@libs/services/cep18-service';
 import { List, TokenPlate, Typography } from '@libs/ui/components';
 
-import { formatErc20TokenBalance } from './utils';
+import { formatCep18Tokens } from './utils';
 
 const TotalValueContainer = styled(SpaceBetweenFlexRow)`
   padding: 12px 16px;
@@ -25,12 +25,12 @@ export const TokensList = () => {
   const [totalAmountFiat, setTotalAmountFiat] = useState<string | null>(null);
 
   const casperToken = useCasperToken();
-  const erc20Tokens = useFetchErc20Tokens();
+  const { cep18Tokens } = useFetchCep18Tokens();
   const { t } = useTranslation();
   const navigate = useTypedNavigate();
 
   useEffect(() => {
-    const erc20TokensList = formatErc20TokenBalance(erc20Tokens);
+    const formatedCep18Tokens = formatCep18Tokens(cep18Tokens);
 
     const tokensList: TokenType[] = [];
 
@@ -39,12 +39,12 @@ export const TokensList = () => {
       setTotalAmountFiat(casperToken.amountFiat);
     }
 
-    if (erc20TokensList) {
-      tokensList.push(...erc20TokensList);
+    if (formatedCep18Tokens) {
+      tokensList.push(...formatedCep18Tokens);
     }
 
     setTokensList(tokensList);
-  }, [casperToken, erc20Tokens]);
+  }, [casperToken, cep18Tokens]);
 
   useEffect(() => {
     const container = document.querySelector('#ms-container');
diff --git a/src/apps/popup/pages/home/components/tokens-list/utils.ts b/src/apps/popup/pages/home/components/tokens-list/utils.ts
index edebce245..2bf4b328e 100644
--- a/src/apps/popup/pages/home/components/tokens-list/utils.ts
+++ b/src/apps/popup/pages/home/components/tokens-list/utils.ts
@@ -1,40 +1,22 @@
-import { TokenType } from '@hooks/use-casper-token';
-
-import { ContractPackageWithBalance } from '@libs/services/erc20-service';
-import { divideErc20Balance, formatNumber } from '@libs/ui/utils';
+import { TokenDto } from 'casper-wallet-core/src/data/dto';
 
-export const MINIMUM_SHOWING_BALANCE = 0.00001;
+import { TokenType } from '@hooks/use-casper-token';
 
-export const formatErc20TokenBalance = (
-  erc20Tokens: ContractPackageWithBalance[] | null
+export const formatCep18Tokens = (
+  cep18Tokens: TokenDto[] | undefined
 ): TokenType[] | undefined => {
-  return erc20Tokens
-    ?.map(token => {
-      const calculatedErc20Balance = token?.balance
-        ? divideErc20Balance(token?.balance, token.metadata?.decimals)
-        : '0';
-
-      const formattedErc20Amount = calculatedErc20Balance
-        ? formatNumber(calculatedErc20Balance, { precision: { max: 5 } })
-        : '-';
-
-      const erc20Amount =
-        parseFloat(formattedErc20Amount) >= MINIMUM_SHOWING_BALANCE
-          ? formattedErc20Amount
-          : '0';
-
-      return {
-        id: token.contract_package_hash,
-        contractHash: token.contractHash,
-        name: token.contract_name,
-        balance: token.balance,
-        amount: erc20Amount,
-        symbol: token?.metadata?.symbol || '',
-        decimals: token?.metadata?.decimals,
-        amountFiat: null,
-        icon: token.icon_url || 'assets/icons/cep18-contract-icon.svg'
-      };
-    })
+  return cep18Tokens
+    ?.map(token => ({
+      id: token.contractPackageHash,
+      contractHash: token.contractHash,
+      name: token.name,
+      balance: token.balance,
+      amount: token.formattedDecimalBalance,
+      symbol: token.symbol,
+      decimals: token.decimals,
+      amountFiat: null,
+      icon: token.iconUrl || 'assets/icons/cep18-contract-icon.svg'
+    }))
     .sort((a, b) => {
       const first = a.amount.split(',').join('');
       const second = b.amount.split(',').join('');
diff --git a/src/apps/popup/pages/receive/content.tsx b/src/apps/popup/pages/receive/content.tsx
index 1aa80318a..a4308deff 100644
--- a/src/apps/popup/pages/receive/content.tsx
+++ b/src/apps/popup/pages/receive/content.tsx
@@ -1,13 +1,12 @@
 import { QRCodeSVG } from 'qrcode.react';
 import React, { useEffect, useState } from 'react';
 import { Trans, useTranslation } from 'react-i18next';
-import { shallowEqual, useSelector } from 'react-redux';
+import { useSelector } from 'react-redux';
 import styled from 'styled-components';
 
-import { formatErc20TokenBalance } from '@popup/pages/home/components/tokens-list/utils';
+import { formatCep18Tokens } from '@popup/pages/home/components/tokens-list/utils';
 import { useTypedLocation } from '@popup/router';
 
-import { selectErc20Tokens } from '@background/redux/account-info/selectors';
 import { selectVaultActiveAccount } from '@background/redux/vault/selectors';
 
 import { useCopyToClipboard } from '@hooks/use-copy-to-clipboard';
@@ -20,6 +19,7 @@ import {
   VerticalSpaceContainer
 } from '@libs/layout';
 import { useFetchWalletBalance } from '@libs/services/balance-service';
+import { useFetchCep18Tokens } from '@libs/services/cep18-service';
 import { ActiveAccountPlate, Tile, Typography } from '@libs/ui/components';
 import { motesToCSPR } from '@libs/ui/utils';
 
@@ -55,9 +55,8 @@ export const ReceivePageContent = () => {
     symbol: location?.state?.tokenData?.symbol ?? ''
   });
 
-  const tokens = useSelector(selectErc20Tokens, shallowEqual);
-
   const { accountBalance } = useFetchWalletBalance();
+  const { cep18Tokens } = useFetchCep18Tokens();
 
   useEffect(() => {
     if (tokenData?.symbol === 'CSPR') {
@@ -67,12 +66,13 @@ export const ReceivePageContent = () => {
         '0';
       setTokenData(prev => ({ ...prev, balance }));
     } else {
-      const erc20Tokens = formatErc20TokenBalance(tokens);
+      const formatedCep18Tokens = formatCep18Tokens(cep18Tokens);
       const balance =
-        erc20Tokens?.find(t => t?.symbol === tokenData?.symbol)?.amount ?? '0';
+        formatedCep18Tokens?.find(t => t?.symbol === tokenData?.symbol)
+          ?.amount ?? '0';
       setTokenData(prev => ({ ...prev, balance }));
     }
-  }, [accountBalance.liquidBalance, tokenData?.symbol, tokens]);
+  }, [accountBalance.liquidBalance, tokenData?.symbol, cep18Tokens]);
 
   return (
     <ContentContainer>
diff --git a/src/apps/popup/pages/token-details/content.tsx b/src/apps/popup/pages/token-details/content.tsx
index 0fa17c1f9..e197346b5 100644
--- a/src/apps/popup/pages/token-details/content.tsx
+++ b/src/apps/popup/pages/token-details/content.tsx
@@ -7,7 +7,6 @@ import {
   ParagraphContainer,
   SpacingSize
 } from '@libs/layout';
-import { ContractPackageWithBalance } from '@libs/services/erc20-service';
 import {
   CasperTokenTransferDeploysList,
   Cep18TokenDeploysList,
@@ -16,13 +15,7 @@ import {
 
 import { Token } from './token';
 
-interface TokenPageContentProps {
-  erc20Tokens: ContractPackageWithBalance[] | null;
-}
-
-export const TokenPageContent: React.FC<TokenPageContentProps> = ({
-  erc20Tokens
-}) => {
+export const TokenPageContent: React.FC = () => {
   const { t } = useTranslation();
 
   const { tokenName } = useParams();
@@ -34,7 +27,7 @@ export const TokenPageContent: React.FC<TokenPageContentProps> = ({
           <Trans t={t}>Token</Trans>
         </Typography>
       </ParagraphContainer>
-      <Token erc20Tokens={erc20Tokens} />
+      <Token />
       <ParagraphContainer top={SpacingSize.XL}>
         <Typography type="header">
           <Trans t={t}>Activity</Trans>
diff --git a/src/apps/popup/pages/token-details/index.tsx b/src/apps/popup/pages/token-details/index.tsx
index c1de5a5c7..f4d554218 100644
--- a/src/apps/popup/pages/token-details/index.tsx
+++ b/src/apps/popup/pages/token-details/index.tsx
@@ -1,22 +1,21 @@
 import React from 'react';
-import { useSelector } from 'react-redux';
 import { useParams } from 'react-router-dom';
 
-import { selectErc20Tokens } from '@background/redux/account-info/selectors';
-
 import {
   HeaderPopup,
   HeaderSubmenuBarNavLink,
   HeaderViewInExplorer,
   PopupLayout
 } from '@libs/layout';
+import { useFetchCep18Tokens } from '@libs/services/cep18-service';
 
 import { TokenPageContent } from './content';
 
 export const TokenDetailPage = () => {
-  const erc20Tokens = useSelector(selectErc20Tokens);
   const { tokenName } = useParams();
 
+  const { cep18Tokens } = useFetchCep18Tokens();
+
   return (
     <PopupLayout
       renderHeader={() => (
@@ -29,13 +28,13 @@ export const TokenDetailPage = () => {
               <HeaderSubmenuBarNavLink linkType="back" />
               <HeaderViewInExplorer
                 tokenName={tokenName}
-                erc20Tokens={erc20Tokens}
+                cep18Tokens={cep18Tokens}
               />
             </>
           )}
         />
       )}
-      renderContent={() => <TokenPageContent erc20Tokens={erc20Tokens} />}
+      renderContent={() => <TokenPageContent />}
     />
   );
 };
diff --git a/src/apps/popup/pages/token-details/token.tsx b/src/apps/popup/pages/token-details/token.tsx
index 4d02143c4..c3b1ffd6d 100644
--- a/src/apps/popup/pages/token-details/token.tsx
+++ b/src/apps/popup/pages/token-details/token.tsx
@@ -6,7 +6,7 @@ import styled from 'styled-components';
 
 import { NetworkSetting } from '@src/constants';
 
-import { formatErc20TokenBalance } from '@popup/pages/home/components/tokens-list/utils';
+import { formatCep18Tokens } from '@popup/pages/home/components/tokens-list/utils';
 import { RouterPath, useTypedLocation, useTypedNavigate } from '@popup/router';
 
 import {
@@ -23,7 +23,7 @@ import {
   SpaceBetweenFlexRow,
   SpacingSize
 } from '@libs/layout';
-import { ContractPackageWithBalance } from '@libs/services/erc20-service';
+import { useFetchCep18Tokens } from '@libs/services/cep18-service';
 import {
   Button,
   List,
@@ -52,11 +52,7 @@ type TokenInfoList = {
   value: string;
 };
 
-type TokenProps = {
-  erc20Tokens: ContractPackageWithBalance[] | null;
-};
-
-export const Token = ({ erc20Tokens }: TokenProps) => {
+export const Token = () => {
   const location = useTypedLocation();
   const [tokenData, setTokenData] = useState<TokenType | null>(
     location.state.tokenData ?? null
@@ -71,6 +67,7 @@ export const Token = ({ erc20Tokens }: TokenProps) => {
   const { casperLiveUrl } = useSelector(selectApiConfigBasedOnActiveNetwork);
   const activeAccount = useSelector(selectVaultActiveAccount);
   const network = useSelector(selectActiveNetworkSetting);
+  const { cep18Tokens } = useFetchCep18Tokens();
 
   useEffect(() => {
     if (tokenName === 'Casper') {
@@ -82,10 +79,10 @@ export const Token = ({ erc20Tokens }: TokenProps) => {
         ]);
       }
     } else {
-      // ERC-20 token case
-      const erc20TokensList = formatErc20TokenBalance(erc20Tokens);
+      // CEP-18 token case
+      const formatedCep18Tokens = formatCep18Tokens(cep18Tokens);
 
-      const token = erc20TokensList?.find(token => token.id === tokenName);
+      const token = formatedCep18Tokens?.find(token => token.id === tokenName);
 
       if (token) {
         setTokenData(token);
@@ -110,7 +107,7 @@ export const Token = ({ erc20Tokens }: TokenProps) => {
     casperToken,
     activeAccount,
     casperLiveUrl,
-    erc20Tokens,
+    cep18Tokens,
     tokenData?.symbol,
     tokenData?.decimals
   ]);
diff --git a/src/apps/popup/pages/transfer/token-step.tsx b/src/apps/popup/pages/transfer/token-step.tsx
index 1eb11de7d..0e0e41ab7 100644
--- a/src/apps/popup/pages/transfer/token-step.tsx
+++ b/src/apps/popup/pages/transfer/token-step.tsx
@@ -1,7 +1,8 @@
 import React, { useEffect, useState } from 'react';
 import { Trans, useTranslation } from 'react-i18next';
 
-import { useActiveAccountErc20Tokens } from '@hooks/use-active-account-erc20-tokens';
+import { formatCep18Tokens } from '@popup/pages/home/components/tokens-list/utils';
+
 import { TokenType, useCasperToken } from '@hooks/use-casper-token';
 
 import {
@@ -9,6 +10,7 @@ import {
   ParagraphContainer,
   SpacingSize
 } from '@libs/layout';
+import { useFetchCep18Tokens } from '@libs/services/cep18-service';
 import {
   ActiveAccountPlate,
   List,
@@ -37,19 +39,20 @@ export const TokenStep = ({
   const { t } = useTranslation();
 
   const casperToken = useCasperToken();
-  const { tokens, isLoading } = useActiveAccountErc20Tokens();
+  const { cep18Tokens, isLoadingTokens } = useFetchCep18Tokens();
 
   useEffect(() => {
     const tokensList: TokenType[] = [];
 
-    if (isLoading) return;
+    if (isLoadingTokens) return;
+    const formatedCep18Tokens = formatCep18Tokens(cep18Tokens);
 
     if (casperToken) {
       tokensList.push(casperToken);
     }
 
-    if (tokens) {
-      tokensList.push(...tokens);
+    if (formatedCep18Tokens) {
+      tokensList.push(...formatedCep18Tokens);
     }
 
     setTokenList(tokensList);
@@ -61,7 +64,13 @@ export const TokenStep = ({
     } else {
       setSelectedToken(casperToken);
     }
-  }, [casperToken, tokens, isLoading, selectedToken?.id, setSelectedToken]);
+  }, [
+    casperToken,
+    cep18Tokens,
+    isLoadingTokens,
+    selectedToken?.id,
+    setSelectedToken
+  ]);
 
   return (
     <ContentContainer>
diff --git a/src/background/index.ts b/src/background/index.ts
index efdeb037a..36ed5418b 100644
--- a/src/background/index.ts
+++ b/src/background/index.ts
@@ -29,7 +29,6 @@ import {
   openOnboardingUi
 } from '@background/open-onboarding-flow';
 import {
-  accountErc20Changed,
   accountInfoReset,
   accountNftTokensAdded,
   accountNftTokensCountChanged,
@@ -109,7 +108,6 @@ import {
   fetchOnRampOptionPost,
   fetchOnRampSelectionPost
 } from '@libs/services/buy-cspr-service';
-import { fetchErc20Tokens } from '@libs/services/erc20-service';
 import { fetchNftTokens } from '@libs/services/nft-service';
 import {
   fetchAuctionValidators,
@@ -600,7 +598,6 @@ runtime.onMessage.addListener(
           case getType(accountInfoReset):
           case getType(accountPendingDeployHashesChanged):
           case getType(accountPendingDeployHashesRemove):
-          case getType(accountErc20Changed):
           case getType(accountNftTokensAdded):
           case getType(accountNftTokensUpdated):
           case getType(accountNftTokensCountChanged):
@@ -652,39 +649,6 @@ runtime.onMessage.addListener(
             return;
           }
 
-          case getType(serviceMessage.fetchErc20TokensRequest): {
-            const { casperClarityApiUrl } = selectApiConfigBasedOnActiveNetwork(
-              store.getState()
-            );
-
-            try {
-              const { data: tokensList } = await fetchErc20Tokens({
-                casperClarityApiUrl,
-                accountHash: action.payload.accountHash
-              });
-
-              if (tokensList) {
-                const erc20Tokens = tokensList.map(token => ({
-                  balance: token.balance,
-                  contractHash: token.latest_contract?.contract_hash,
-                  ...(token?.contract_package ?? {})
-                }));
-
-                return sendResponse(
-                  serviceMessage.fetchErc20TokensResponse(erc20Tokens)
-                );
-              } else {
-                return sendResponse(
-                  serviceMessage.fetchErc20TokensResponse([])
-                );
-              }
-            } catch (error) {
-              console.error(error);
-            }
-
-            return;
-          }
-
           case getType(serviceMessage.fetchNftTokensRequest): {
             const { casperClarityApiUrl } = selectApiConfigBasedOnActiveNetwork(
               store.getState()
diff --git a/src/background/redux/account-info/actions.ts b/src/background/redux/account-info/actions.ts
index c58b29a49..1d572a6fa 100644
--- a/src/background/redux/account-info/actions.ts
+++ b/src/background/redux/account-info/actions.ts
@@ -1,12 +1,7 @@
 import { createAction } from 'typesafe-actions';
 
-import { ContractPackageWithBalance } from '@libs/services/erc20-service/types';
 import { NFTTokenResult } from '@libs/services/nft-service/types';
 
-export const accountErc20Changed = createAction('ACCOUNT_ERC20_CHANGED')<
-  ContractPackageWithBalance[]
->();
-
 export const accountInfoReset = createAction('ACCOUNT_INFO_RESET')();
 
 export const accountPendingDeployHashesChanged = createAction(
diff --git a/src/background/redux/account-info/reducer.ts b/src/background/redux/account-info/reducer.ts
index 888a13fb9..f0b1f1c89 100644
--- a/src/background/redux/account-info/reducer.ts
+++ b/src/background/redux/account-info/reducer.ts
@@ -3,7 +3,6 @@ import { createReducer } from 'typesafe-actions';
 import { isEqualCaseInsensitive } from '@src/utils';
 
 import {
-  accountErc20Changed,
   accountInfoReset,
   accountNftTokensAdded,
   accountNftTokensCountChanged,
@@ -17,7 +16,6 @@ import { AccountInfoState } from './types';
 
 const initialState: AccountInfoState = {
   pendingDeployHashes: [],
-  erc20Tokens: [],
   accountNftTokens: [],
   nftTokensCount: 0,
   accountTrackingIdOfSentNftTokens: {}
@@ -25,13 +23,6 @@ const initialState: AccountInfoState = {
 
 export const reducer = createReducer(initialState)
   .handleAction(accountInfoReset, () => initialState)
-  .handleAction(
-    accountErc20Changed,
-    (state, { payload }): AccountInfoState => ({
-      ...state,
-      erc20Tokens: payload
-    })
-  )
   .handleAction(accountPendingDeployHashesChanged, (state, { payload }) => {
     return {
       ...state,
diff --git a/src/background/redux/account-info/selectors.ts b/src/background/redux/account-info/selectors.ts
index c1680794a..c4bcee00d 100644
--- a/src/background/redux/account-info/selectors.ts
+++ b/src/background/redux/account-info/selectors.ts
@@ -3,9 +3,6 @@ import { RootState } from 'typesafe-actions';
 export const selectPendingDeployHashes = (state: RootState) =>
   state.accountInfo.pendingDeployHashes;
 
-export const selectErc20Tokens = (state: RootState) =>
-  state.accountInfo.erc20Tokens;
-
 export const selectAccountNftTokens = (state: RootState) =>
   state.accountInfo.accountNftTokens;
 
diff --git a/src/background/redux/account-info/types.ts b/src/background/redux/account-info/types.ts
index b9586c51b..24ad0b53a 100644
--- a/src/background/redux/account-info/types.ts
+++ b/src/background/redux/account-info/types.ts
@@ -1,8 +1,6 @@
-import { ContractPackageWithBalance } from '@libs/services/erc20-service';
 import { NFTTokenResult } from '@libs/services/nft-service';
 
 export interface AccountInfoState {
-  erc20Tokens: ContractPackageWithBalance[];
   pendingDeployHashes: string[];
   accountNftTokens: NFTTokenResult[] | null;
   nftTokensCount: number;
diff --git a/src/background/service-message.ts b/src/background/service-message.ts
index c09f251a8..dc9c4a8f8 100644
--- a/src/background/service-message.ts
+++ b/src/background/service-message.ts
@@ -8,7 +8,6 @@ import {
   ResponseSelectionProps,
   SelectionPostRequestData
 } from '@libs/services/buy-cspr-service/types';
-import { ContractPackageWithBalance } from '@libs/services/erc20-service/types';
 import { NFTTokenResult } from '@libs/services/nft-service/types';
 import { ErrorResponse, PaginatedResponse } from '@libs/services/types';
 import {
@@ -26,14 +25,6 @@ export const serviceMessage = {
   fetchExtendedDeploysInfoResponse: createAction(
     'FETCH_EXTENDED_DEPLOYS_INFO_RESPONSE'
   )<IDeploy | null, Meta>(),
-  fetchErc20TokensRequest: createAction('FETCH_ERC20_TOKENS')<
-    { accountHash: string },
-    Meta
-  >(),
-  fetchErc20TokensResponse: createAction('FETCH_ERC20_TOKENS_RESPONSE')<
-    ContractPackageWithBalance[],
-    Meta
-  >(),
   fetchNftTokensRequest: createAction('FETCH_NFT_TOKENS')<
     { accountHash: string; page: number },
     Meta
diff --git a/src/fixtures/initial-state-for-popup-tests.ts b/src/fixtures/initial-state-for-popup-tests.ts
index 212a71697..8894f950d 100644
--- a/src/fixtures/initial-state-for-popup-tests.ts
+++ b/src/fixtures/initial-state-for-popup-tests.ts
@@ -92,7 +92,6 @@ export const initialStateForPopupTests: RootState = {
   recentRecipientPublicKeys: [],
   accountInfo: {
     pendingDeployHashes: [],
-    erc20Tokens: [],
     accountNftTokens: [],
     nftTokensCount: 0,
     accountTrackingIdOfSentNftTokens: {}
diff --git a/src/hooks/use-active-account-erc20-tokens.ts b/src/hooks/use-active-account-erc20-tokens.ts
deleted file mode 100644
index a6588542b..000000000
--- a/src/hooks/use-active-account-erc20-tokens.ts
+++ /dev/null
@@ -1,60 +0,0 @@
-import { useEffect, useRef, useState } from 'react';
-import { useTranslation } from 'react-i18next';
-import { useSelector } from 'react-redux';
-
-import { BALANCE_REFRESH_RATE } from '@src/constants';
-
-import { useForceUpdate } from '@popup/hooks/use-force-update';
-import { formatErc20TokenBalance } from '@popup/pages/home/components/tokens-list/utils';
-
-import { selectApiConfigBasedOnActiveNetwork } from '@background/redux/settings/selectors';
-import { selectVaultActiveAccount } from '@background/redux/vault/selectors';
-
-import { TokenType } from '@hooks/use-casper-token';
-
-import { getAccountHashFromPublicKey } from '@libs/entities/Account';
-import { dispatchFetchErc20TokensRequest } from '@libs/services/erc20-service';
-
-/**
- * Will get all active account erc20 tokens with automatic refresh
- */
-export const useActiveAccountErc20Tokens = () => {
-  const effectTimeoutRef = useRef<NodeJS.Timeout>();
-  const forceUpdate = useForceUpdate();
-  const [tokens, setTokens] = useState<TokenType[] | undefined>(undefined);
-  const [isLoading, setIsLoading] = useState(true);
-  const { t } = useTranslation();
-
-  const activeAccount = useSelector(selectVaultActiveAccount);
-  const { casperClarityApiUrl } = useSelector(
-    selectApiConfigBasedOnActiveNetwork
-  );
-
-  useEffect(() => {
-    setIsLoading(true);
-    dispatchFetchErc20TokensRequest(
-      getAccountHashFromPublicKey(activeAccount?.publicKey)
-    )
-      .then(({ payload: erc20Tokens }) => {
-        const erc20TokensList = formatErc20TokenBalance(erc20Tokens);
-
-        setTokens(erc20TokensList);
-      })
-      .catch(error => {
-        console.error('Balance request failed:', error);
-      })
-      .finally(() => setIsLoading(false));
-
-    // will cause effect to run again after timeout
-    effectTimeoutRef.current = setTimeout(() => {
-      forceUpdate();
-    }, BALANCE_REFRESH_RATE + 1);
-
-    return () => {
-      clearTimeout(effectTimeoutRef.current);
-    };
-    // eslint-disable-next-line react-hooks/exhaustive-deps
-  }, [activeAccount?.publicKey, casperClarityApiUrl, t, forceUpdate]);
-
-  return { tokens, isLoading };
-};
diff --git a/src/hooks/use-casper-token.ts b/src/hooks/use-casper-token.ts
index b36313704..2765e4871 100644
--- a/src/hooks/use-casper-token.ts
+++ b/src/hooks/use-casper-token.ts
@@ -2,6 +2,7 @@ import { useEffect, useState } from 'react';
 
 import { useFetchWalletBalance } from '@libs/services/balance-service';
 
+// TODO: review this in future and maybe remove and use type from casper wallet core
 export type TokenType = {
   id: string;
   contractHash?: string;
diff --git a/src/hooks/use-fetch-erc20-tokens.ts b/src/hooks/use-fetch-erc20-tokens.ts
deleted file mode 100644
index 897322364..000000000
--- a/src/hooks/use-fetch-erc20-tokens.ts
+++ /dev/null
@@ -1,39 +0,0 @@
-import { useEffect, useState } from 'react';
-import { useSelector } from 'react-redux';
-
-import { accountErc20Changed } from '@background/redux/account-info/actions';
-import { selectErc20Tokens } from '@background/redux/account-info/selectors';
-import { selectApiConfigBasedOnActiveNetwork } from '@background/redux/settings/selectors';
-import { dispatchToMainStore } from '@background/redux/utils';
-import { selectVaultActiveAccount } from '@background/redux/vault/selectors';
-
-import { getAccountHashFromPublicKey } from '@libs/entities/Account';
-import {
-  ContractPackageWithBalance,
-  dispatchFetchErc20TokensRequest
-} from '@libs/services/erc20-service';
-
-export const useFetchErc20Tokens = () => {
-  const activeAccount = useSelector(selectVaultActiveAccount);
-  const { casperClarityApiUrl } = useSelector(
-    selectApiConfigBasedOnActiveNetwork
-  );
-  const tokens = useSelector(selectErc20Tokens);
-
-  const [erc20Tokens, setErc20Tokens] = useState<
-    ContractPackageWithBalance[] | null
-  >(tokens);
-
-  useEffect(() => {
-    if (!activeAccount?.publicKey) return;
-
-    dispatchFetchErc20TokensRequest(
-      getAccountHashFromPublicKey(activeAccount.publicKey)
-    ).then(({ payload: tokens }) => {
-      dispatchToMainStore(accountErc20Changed(tokens));
-      setErc20Tokens(tokens);
-    });
-  }, [activeAccount?.publicKey, casperClarityApiUrl]);
-
-  return erc20Tokens;
-};
diff --git a/src/libs/layout/header/header-data-updater.tsx b/src/libs/layout/header/header-data-updater.tsx
index 5c243c723..99730cbbb 100644
--- a/src/libs/layout/header/header-data-updater.tsx
+++ b/src/libs/layout/header/header-data-updater.tsx
@@ -1,12 +1,11 @@
 import React from 'react';
 
-import { useFetchErc20Tokens } from '@hooks/use-fetch-erc20-tokens';
-
 import { useFetchWalletBalance } from '@libs/services/balance-service';
+import { useFetchCep18Tokens } from '@libs/services/cep18-service';
 
 export const HeaderDataUpdater: React.FC = () => {
-  useFetchErc20Tokens();
   useFetchWalletBalance();
+  useFetchCep18Tokens();
 
   return null;
 };
diff --git a/src/libs/layout/header/header-view-in-explorer.tsx b/src/libs/layout/header/header-view-in-explorer.tsx
index 322af0201..2e705f352 100644
--- a/src/libs/layout/header/header-view-in-explorer.tsx
+++ b/src/libs/layout/header/header-view-in-explorer.tsx
@@ -1,3 +1,4 @@
+import { TokenDto } from 'casper-wallet-core/src/data/dto';
 import React, { useEffect, useState } from 'react';
 import { useSelector } from 'react-redux';
 
@@ -14,7 +15,6 @@ import { selectVaultActiveAccount } from '@background/redux/vault/selectors';
 import { useCasperToken } from '@hooks/use-casper-token';
 
 import { AlignedFlexRow, CenteredFlexColumn, SpacingSize } from '@libs/layout';
-import { ContractPackageWithBalance } from '@libs/services/erc20-service';
 import { Link, SvgIcon, Typography } from '@libs/ui/components';
 
 interface HeaderViewInExplorerProps {
@@ -22,7 +22,7 @@ interface HeaderViewInExplorerProps {
   deployHash?: string;
   nftTokenId?: string;
   contractHash?: string;
-  erc20Tokens?: ContractPackageWithBalance[];
+  cep18Tokens?: TokenDto[];
 }
 
 export function HeaderViewInExplorer({
@@ -30,7 +30,7 @@ export function HeaderViewInExplorer({
   deployHash,
   nftTokenId,
   contractHash,
-  erc20Tokens
+  cep18Tokens
 }: HeaderViewInExplorerProps) {
   const [hrefToTokenOnCasperLive, setHrefToTokenOnCasperLive] = useState<
     string | undefined
@@ -63,15 +63,15 @@ export function HeaderViewInExplorer({
         }
       } else {
         // ERC-20 token case
-        const token = erc20Tokens?.find(
-          token => token.contract_package_hash === tokenName
+        const token = cep18Tokens?.find(
+          token => token.contractPackageHash === tokenName
         );
 
         if (token) {
           setHrefToTokenOnCasperLive(
             getBlockExplorerContractPackageUrl(
               casperLiveUrl,
-              token.contract_package_hash
+              token.contractPackageHash
             )
           );
         }
@@ -88,7 +88,7 @@ export function HeaderViewInExplorer({
     casperToken,
     activeAccount,
     casperLiveUrl,
-    erc20Tokens,
+    cep18Tokens,
     deployHash,
     nftTokenId,
     contractHash
diff --git a/src/libs/services/cep18-service/index.ts b/src/libs/services/cep18-service/index.ts
new file mode 100644
index 000000000..75ca6c85e
--- /dev/null
+++ b/src/libs/services/cep18-service/index.ts
@@ -0,0 +1 @@
+export * from './use-fetch-cep18-tokens';
diff --git a/src/libs/services/cep18-service/use-fetch-cep18-tokens.ts b/src/libs/services/cep18-service/use-fetch-cep18-tokens.ts
new file mode 100644
index 000000000..87c32bced
--- /dev/null
+++ b/src/libs/services/cep18-service/use-fetch-cep18-tokens.ts
@@ -0,0 +1,27 @@
+import { useQuery } from '@tanstack/react-query';
+import { CasperNetwork } from 'casper-wallet-core/src/domain/common/common';
+import { useSelector } from 'react-redux';
+
+import { TOKENS_REFRESH_RATE } from '@src/constants';
+
+import { selectActiveNetworkSetting } from '@background/redux/settings/selectors';
+import { selectVaultActiveAccount } from '@background/redux/vault/selectors';
+import { tokensRepository } from '@background/wallet-repositories';
+
+export const useFetchCep18Tokens = () => {
+  const activeAccount = useSelector(selectVaultActiveAccount);
+  const network = useSelector(selectActiveNetworkSetting);
+
+  const { data: cep18Tokens, isFetching: isLoadingTokens } = useQuery({
+    queryKey: ['CEP18_TOKENS', network, activeAccount?.publicKey],
+    queryFn: () =>
+      tokensRepository.getTokens({
+        network: network.toLowerCase() as CasperNetwork,
+        publicKey: activeAccount?.publicKey || ''
+      }),
+    refetchInterval: TOKENS_REFRESH_RATE,
+    staleTime: TOKENS_REFRESH_RATE
+  });
+
+  return { cep18Tokens, isLoadingTokens };
+};
diff --git a/src/libs/services/erc20-service/constants.ts b/src/libs/services/erc20-service/constants.ts
deleted file mode 100644
index 604bf4611..000000000
--- a/src/libs/services/erc20-service/constants.ts
+++ /dev/null
@@ -1,5 +0,0 @@
-export const getErc20TokensUrl = (
-  casperClarityApiUrl: string,
-  accountHash: string
-) =>
-  `${casperClarityApiUrl}/accounts/${accountHash}/erc20-tokens?fields=latest_contract,contract_package`;
diff --git a/src/libs/services/erc20-service/erc20-service.ts b/src/libs/services/erc20-service/erc20-service.ts
deleted file mode 100644
index c1e71fa21..000000000
--- a/src/libs/services/erc20-service/erc20-service.ts
+++ /dev/null
@@ -1,39 +0,0 @@
-import { TOKENS_REFRESH_RATE } from '@src/constants';
-
-import { dispatchToMainStore } from '@background/redux/utils';
-import { serviceMessage } from '@background/service-message';
-
-import { queryClient } from '@libs/services/query-client';
-import { DataResponse, Payload } from '@libs/services/types';
-import { handleError, toJson } from '@libs/services/utils';
-
-import { getErc20TokensUrl } from './constants';
-import { ContractPackageWithBalance, Erc20Token } from './types';
-
-export const erc20TokensRequest = (
-  casperClarityApiUrl: string,
-  accountHash: string,
-  signal?: AbortSignal
-): Promise<DataResponse<Erc20Token[]>> =>
-  fetch(getErc20TokensUrl(casperClarityApiUrl, accountHash), { signal })
-    .then(toJson)
-    .catch(handleError);
-
-export const fetchErc20Tokens = ({
-  casperClarityApiUrl,
-  accountHash
-}: {
-  casperClarityApiUrl: string;
-  accountHash: string;
-}) =>
-  queryClient.fetchQuery(
-    ['getErc20Tokens', accountHash, casperClarityApiUrl],
-    ({ signal }) =>
-      erc20TokensRequest(casperClarityApiUrl, accountHash, signal),
-    { staleTime: TOKENS_REFRESH_RATE }
-  );
-
-export const dispatchFetchErc20TokensRequest = (
-  accountHash: string
-): Promise<Payload<ContractPackageWithBalance[]>> =>
-  dispatchToMainStore(serviceMessage.fetchErc20TokensRequest({ accountHash }));
diff --git a/src/libs/services/erc20-service/index.ts b/src/libs/services/erc20-service/index.ts
deleted file mode 100644
index 9f9e834c9..000000000
--- a/src/libs/services/erc20-service/index.ts
+++ /dev/null
@@ -1,3 +0,0 @@
-export * from './erc20-service';
-export * from './types';
-export * from './constants';
diff --git a/src/libs/services/erc20-service/types.ts b/src/libs/services/erc20-service/types.ts
deleted file mode 100644
index 3cdce250c..000000000
--- a/src/libs/services/erc20-service/types.ts
+++ /dev/null
@@ -1,37 +0,0 @@
-export interface Erc20Token {
-  account_hash: string;
-  balance: string;
-  contract_package_hash: string;
-  latest_contract?: {
-    contract_hash: string;
-    contract_package_hash: string;
-    deploy_hash: string;
-    contract_type_id: number;
-    contract_version: number;
-    is_disabled: boolean;
-    protocol_version: string;
-    timestamp: string;
-  };
-  contract_package: ContractPackage;
-}
-
-export interface ContractPackage {
-  contract_description: string | null;
-  contract_name: string;
-  contract_package_hash: string;
-  contract_type_id: number;
-  icon_url: string | null;
-  metadata: {
-    balances_uref: string;
-    decimals: number;
-    symbol: string;
-    total_supply_uref: string;
-  };
-  owner_public_key: string;
-  timestamp: string;
-  contractHash?: string;
-}
-
-export interface ContractPackageWithBalance extends ContractPackage {
-  balance: string;
-}