diff --git a/package-lock.json b/package-lock.json
index 5cdab6485..1da5f73b6 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -13,7 +13,7 @@
"@playwright/test": "^1.43.1",
"@react-spring/web": "^9.6.1",
"@scure/btc-signer": "1.2.1",
- "@secretkeylabs/xverse-core": "13.6.5",
+ "@secretkeylabs/xverse-core": "13.6.6",
"@stacks/connect": "7.4.1",
"@stacks/stacks-blockchain-api-types": "6.1.1",
"@stacks/transactions": "6.13.1",
@@ -1383,9 +1383,9 @@
}
},
"node_modules/@secretkeylabs/xverse-core": {
- "version": "13.6.5",
- "resolved": "https://npm.pkg.github.com/download/@secretkeylabs/xverse-core/13.6.5/d040738bda961a6881aafc5b48cd3e5cee27b4f2",
- "integrity": "sha512-dh1zjApZMzLcNbCNXgwEfZvlgnYcRDJUJzRelDSj/wmg7fCESsct0ANa3DQonNYi27T8XokCufeu0JMX3Pvj9g==",
+ "version": "13.6.6",
+ "resolved": "https://npm.pkg.github.com/download/@secretkeylabs/xverse-core/13.6.6/03fd02e846aae0249f935539d3de5f55712f5889",
+ "integrity": "sha512-xC4bxxtCEesyQGxiEYBvASrKg5DQ1ARw1jEPz/8x5gVFkMJxK0+7xWx5SVKDQsRCNMIDdxW/WMJf1QoD47MCHw==",
"license": "ISC",
"dependencies": {
"@bitcoinerlab/secp256k1": "^1.0.2",
@@ -17578,9 +17578,9 @@
}
},
"@secretkeylabs/xverse-core": {
- "version": "13.6.5",
- "resolved": "https://npm.pkg.github.com/download/@secretkeylabs/xverse-core/13.6.5/d040738bda961a6881aafc5b48cd3e5cee27b4f2",
- "integrity": "sha512-dh1zjApZMzLcNbCNXgwEfZvlgnYcRDJUJzRelDSj/wmg7fCESsct0ANa3DQonNYi27T8XokCufeu0JMX3Pvj9g==",
+ "version": "13.6.6",
+ "resolved": "https://npm.pkg.github.com/download/@secretkeylabs/xverse-core/13.6.6/03fd02e846aae0249f935539d3de5f55712f5889",
+ "integrity": "sha512-xC4bxxtCEesyQGxiEYBvASrKg5DQ1ARw1jEPz/8x5gVFkMJxK0+7xWx5SVKDQsRCNMIDdxW/WMJf1QoD47MCHw==",
"requires": {
"@bitcoinerlab/secp256k1": "^1.0.2",
"@noble/curves": "^1.2.0",
diff --git a/package.json b/package.json
index 031b91f29..20281da42 100644
--- a/package.json
+++ b/package.json
@@ -25,7 +25,7 @@
"@playwright/test": "^1.43.1",
"@react-spring/web": "^9.6.1",
"@scure/btc-signer": "1.2.1",
- "@secretkeylabs/xverse-core": "13.6.5",
+ "@secretkeylabs/xverse-core": "13.6.6",
"@stacks/connect": "7.4.1",
"@stacks/stacks-blockchain-api-types": "6.1.1",
"@stacks/transactions": "6.13.1",
diff --git a/src/app/components/tokenImage/index.tsx b/src/app/components/tokenImage/index.tsx
index aaa665447..e8a60d92a 100644
--- a/src/app/components/tokenImage/index.tsx
+++ b/src/app/components/tokenImage/index.tsx
@@ -3,7 +3,9 @@ import IconStacks from '@assets/img/dashboard/stx_icon.svg';
import OrdinalIcon from '@assets/img/transactions/ordinal.svg';
import RunesIcon from '@assets/img/transactions/runes.svg';
import { StyledBarLoader } from '@components/tilesSkeletonLoader';
+import useWalletSelector from '@hooks/useWalletSelector';
import { FungibleToken } from '@secretkeylabs/xverse-core';
+import { ORDINALS_URL } from '@secretkeylabs/xverse-core/constant';
import { CurrencyTypes } from '@utils/constants';
import { getTicker } from '@utils/helper';
import { useCallback } from 'react';
@@ -80,6 +82,7 @@ export default function TokenImage({
round,
showProtocolIcon = true,
}: TokenImageProps) {
+ const { network } = useWalletSelector();
const ftProtocol = fungibleToken?.protocol;
const getCurrencyIcon = useCallback(() => {
@@ -114,6 +117,27 @@ export default function TokenImage({
if (fungibleToken?.image) {
return ;
}
+ if (fungibleToken.runeInscriptionId) {
+ const img = new Image(); // determine if valid image
+ img.src = ORDINALS_URL(network.type, fungibleToken.runeInscriptionId);
+ if (img.complete) {
+ return (
+
+ );
+ }
+ }
+ if (fungibleToken.runeSymbol) {
+ return (
+
+ {fungibleToken.runeSymbol}
+
+ );
+ }
+
const ticker = fungibleToken?.name
? getTicker(fungibleToken.name)
: fungibleToken?.ticker || fungibleToken?.assetName || '';
diff --git a/src/app/screens/manageTokens/coinItem/index.tsx b/src/app/screens/manageTokens/coinItem/index.tsx
index 5286f66b1..9a50f0bb7 100644
--- a/src/app/screens/manageTokens/coinItem/index.tsx
+++ b/src/app/screens/manageTokens/coinItem/index.tsx
@@ -45,13 +45,26 @@ interface Props {
name: string;
image?: string;
ticker?: string;
+ runeSymbol?: string | null;
+ runeInscriptionId?: string | null;
protocol?: string;
disabled: boolean;
toggled(enabled: boolean, coinName: string, coinKey: string): void;
enabled?: boolean;
}
-function CoinItem({ id, name, image, ticker, protocol, disabled, toggled, enabled }: Props) {
+function CoinItem({
+ id,
+ name,
+ image,
+ ticker,
+ runeInscriptionId,
+ runeSymbol,
+ protocol,
+ disabled,
+ toggled,
+ enabled,
+}: Props) {
const [isEnabled, setIsEnabled] = useState(enabled);
const toggleSwitch = () => {
setIsEnabled((previousState) => !previousState);
@@ -61,7 +74,12 @@ function CoinItem({ id, name, image, ticker, protocol, disabled, toggled, enable
return (
-
+
{name}
diff --git a/src/app/screens/manageTokens/index.tsx b/src/app/screens/manageTokens/index.tsx
index 306e21f03..c96c83a14 100644
--- a/src/app/screens/manageTokens/index.tsx
+++ b/src/app/screens/manageTokens/index.tsx
@@ -197,6 +197,8 @@ function ManageTokens() {
name={coin.name}
image={coin.image}
ticker={coin.ticker}
+ runeInscriptionId={coin.runeInscriptionId}
+ runeSymbol={coin.runeSymbol}
disabled={false}
toggled={toggled}
enabled={coin.visible}