feat: add formatted symbol for asset uitl

1 files changed, 11 insertions, 1 deletions

diff --git a/packages/instant/src/util/asset.ts b/packages/instant/src/util/asset.ts
index 4e3b2b946..ebeba948e 100644
--- a/packages/instant/src/util/asset.ts
+++ b/packages/instant/src/util/asset.ts
@@ -2,7 +2,7 @@ import { AssetProxyId, ObjectMap } from '@0x/types';
 import * as _ from 'lodash';
 
 import { assetDataNetworkMapping } from '../data/asset_data_network_mapping';
-import { Asset, AssetMetaData, Network, ZeroExInstantError } from '../types';
+import { Asset, AssetMetaData, Network, ZeroExInstantError, ERC20Asset } from '../types';
 
 export const assetUtils = {
     createAssetFromAssetData: (
@@ -43,6 +43,16 @@ export const assetUtils = {
                 return defaultName;
         }
     },
+    formattedSymbolForAsset: (asset?: ERC20Asset, defaultName: string = '???'): string => {
+        if (_.isUndefined(asset)) {
+            return defaultName;
+        }
+        const symbol = asset.metaData.symbol;
+        if (symbol.length <= 5) {
+            return symbol;
+        }
+        return `${symbol.slice(0, 3)}...`;
+    },
     getAssociatedAssetDataIfExists: (assetData: string, network: Network): string | undefined => {
         const assetDataGroupIfExists = _.find(assetDataNetworkMapping, value => value[network] === assetData);
         if (_.isUndefined(assetDataGroupIfExists)) {