- fix invalid prop on Token Accounts

- more explicit prop naming

Author: radumojic

src/layouts/TokenLayout/FailedTokenDetails.tsx

@@ -2,17 +2,17 @@ import { PageState } from 'components';
 import { faCoins } from 'icons/regular';
 
 export const FailedTokenDetails = ({
-  tokenId
+  tokenIdentifier
 }: {
-  tokenId: string | undefined;
+  tokenIdentifier: string | undefined;
 }) => {
   return (
     <PageState
       icon={faCoins}
       title='Unable to locate this token'
       description={
         <div className='px-spacer'>
-          <span className='text-break-all'>{tokenId}</span>
+          <span className='text-break-all'>{tokenIdentifier}</span>
         </div>
       }
       isError

src/layouts/TokenLayout/TokenLayout.tsx

@@ -77,7 +77,7 @@ export const TokenLayout = () => {
   }
 
   if (failed) {
-    return <FailedTokenDetails tokenId={identifier} />;
+    return <FailedTokenDetails tokenIdentifier={identifier} />;
   }
 
   if (loading) {

src/pages/TokenDetails/TokenAccounts.tsx

@@ -31,8 +31,8 @@ export const TokenDetailsAccounts = () => {
 
   const fetchAccounts = () => {
     Promise.all([
-      getTokenAccounts({ tokenId: identifier, page, size }),
-      getTokenAccountsCount({ tokenId: identifier })
+      getTokenAccounts({ token: identifier, page, size }),
+      getTokenAccountsCount({ token: identifier })
     ]).then(([tokenAccountsData, tokenAccountsCountData]) => {
       if (tokenAccountsData.success && tokenAccountsCountData.success) {
         setAccounts(tokenAccountsData.data);

src/pages/TokenDetails/TokenLockedAccounts.tsx

@@ -20,7 +20,7 @@ export const TokenDetailsLockedAccounts = () => {
   const [isDataReady, setIsDataReady] = useState<boolean | undefined>();
 
   const fetchTokenLockedAccounts = () => {
-    getTokenSupply({ tokenId: identifier }).then(({ data, success }) => {
+    getTokenSupply({ token: identifier }).then(({ data, success }) => {
       if (success && data?.lockedAccounts) {
         setTokenLockedAccounts(data.lockedAccounts);
       }

src/pages/TokenDetails/TokenTransactions.tsx

@@ -17,7 +17,7 @@ export const TokenTransactions = () => {
   const { getTokenTransfers, getTokenTransfersCount } = useAdapter();
   const { id: activeNetworkId } = useSelector(activeNetworkSelector);
 
-  const { hash: tokenId } = useParams();
+  const { hash: tokenIdentifier } = useParams();
 
   const {
     fetchTransactions,
@@ -26,20 +26,20 @@ export const TokenTransactions = () => {
     isDataReady,
     dataChanged
   } = useFetchCustomTransfers({
-    uuid: tokenId,
+    uuid: tokenIdentifier,
     dataPromise: getTokenTransfers,
     dataCountPromise: getTokenTransfersCount,
     subscription: WebsocketSubcriptionsEnum.subscribeCustomTransfers,
     event: WebsocketEventsEnum.customTransferUpdate,
     filters: {
-      token: tokenId
+      token: tokenIdentifier
     },
-    websocketConfig: { token: tokenId }
+    websocketConfig: { token: tokenIdentifier }
   });
 
   useEffect(() => {
     fetchTransactions();
-  }, [activeNetworkId, tokenId]);
+  }, [activeNetworkId, tokenIdentifier]);
 
   useEffect(() => {
     fetchTransactions(Boolean(searchParams.toString()));
@@ -51,7 +51,7 @@ export const TokenTransactions = () => {
         <div className='col-12'>
           <TransactionsTable
             transactions={transactions}
-            token={tokenId}
+            token={tokenIdentifier}
             totalTransactions={totalTransactions}
             title={<TokenTabs />}
             dataChanged={dataChanged}