diff --git a/apps/insights/src/components/PriceFeedIcon/index.tsx b/apps/insights/src/components/PriceFeedIcon/index.tsx index cb2148b87c..1c2b02c239 100644 --- a/apps/insights/src/components/PriceFeedIcon/index.tsx +++ b/apps/insights/src/components/PriceFeedIcon/index.tsx @@ -1,4 +1,3 @@ -import Generic from "cryptocurrency-icons/svg/color/generic.svg"; import type { ComponentProps, ComponentType } from "react"; import Commodities from "./commodities.svg"; @@ -26,17 +25,22 @@ export const PriceFeedIcon = ({ assetClass, symbol, ...props }: Props) => { return Icon ? ( ) : ( - + ); } else { - return ; + return assetClassHasIcon(assetClass) ? ( + + ) : // eslint-disable-next-line unicorn/no-null + null; } }; -type GenericProps = ComponentProps<"svg"> & { assetClass: string }; +type GenericProps = ComponentProps<"svg"> & { + assetClass: keyof typeof ASSET_CLASS_TO_ICON; +}; const GenericIcon = ({ assetClass, ...props }: GenericProps) => { - const Icon = ASSET_CLASS_TO_ICON[assetClass] ?? Generic; + const Icon = ASSET_CLASS_TO_ICON[assetClass]; return ( ; type SVGComponent = ComponentType; type SVGRecord = Record; -const ASSET_CLASS_TO_ICON: Record = { +const ASSET_CLASS_TO_ICON = { Commodities, "Crypto Index": CryptoIndex, "Crypto Redemption Rate": CryptoRedemptionRate, @@ -64,4 +68,9 @@ const ASSET_CLASS_TO_ICON: Record = { FX: Fx, Metal, Rates, -}; +} as const; + +const assetClassHasIcon = ( + assetClass: string, +): assetClass is keyof typeof ASSET_CLASS_TO_ICON => + Object.keys(ASSET_CLASS_TO_ICON).includes(assetClass);