Skip to content

Commit

Permalink
Merge pull request #63 from QuickSwap/issue/fix-tokenlogo
Browse files Browse the repository at this point in the history
Fix token icons
  • Loading branch information
totop716 authored Jan 30, 2022
2 parents 5678336 + ccfb4c0 commit 825ebd5
Show file tree
Hide file tree
Showing 271 changed files with 19 additions and 24 deletions.
6 changes: 1 addition & 5 deletions src/components/CurrencyLogo/CurrencyLogo.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -6,11 +6,7 @@ import EthereumLogo from 'assets/images/Currency/PolygonSwap.svg';
import useHttpLocations from 'hooks/useHttpLocations';
import { WrappedTokenInfo } from 'state/lists/hooks';
import { Logo } from 'components';

export const getTokenLogoURL = (address: string) => {
const logoExtensions = ['.png', '.webp', '.jpeg', '.svg'];
return logoExtensions.map((ext) => `/tokenLogo/${address}${ext}`);
};
import { getTokenLogoURL } from 'utils/getTokenLogoURL';

const useStyles = makeStyles(({}) => ({
logoStyled: {
Expand Down
2 changes: 1 addition & 1 deletion src/components/CurrencyLogo/index.ts
Original file line number Diff line number Diff line change
@@ -1 +1 @@
export { default, getTokenLogoURL } from './CurrencyLogo';
export { default } from './CurrencyLogo';
2 changes: 1 addition & 1 deletion src/components/CurrencySearchModal/CurrencyRow.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -14,7 +14,7 @@ import { useAddUserToken, useRemoveUserAddedToken } from 'state/user/hooks';
import { useCurrencyBalance } from 'state/wallet/hooks';
import { useIsUserAddedToken } from 'hooks/Tokens';
import { CurrencyLogo } from 'components';
import { getTokenLogoURL } from 'components/CurrencyLogo';
import { getTokenLogoURL } from 'utils/getTokenLogoURL';
import { PlusHelper } from 'components/QuestionHelper';
import { ReactComponent as TokenSelectedIcon } from 'assets/images/TokenSelected.svg';
import useUSDCPrice from 'utils/useUSDCPrice';
Expand Down
20 changes: 3 additions & 17 deletions src/components/Logo/Logo.tsx
Original file line number Diff line number Diff line change
@@ -1,31 +1,17 @@
import React, { useState } from 'react';
import React from 'react';
import { HelpCircle } from 'react-feather';

const BAD_SRCS: { [tokenAddress: string]: true } = {};

export interface LogoProps {
srcs: string[];
alt?: string;
size?: string;
}

const Logo: React.FC<LogoProps> = ({ srcs, alt, size = '24px' }) => {
const [, refresh] = useState<number>(0);

const src: string | undefined = srcs.find((src) => !BAD_SRCS[src]);
const src: string | undefined = srcs.find((src) => !!src);

if (src) {
return (
<img
alt={alt}
src={src}
style={{ width: size, height: size }}
onError={() => {
if (src) BAD_SRCS[src] = true;
refresh((i) => i + 1);
}}
/>
);
return <img alt={alt} src={src} style={{ width: size, height: size }} />;
}

return <HelpCircle />;
Expand Down
13 changes: 13 additions & 0 deletions src/utils/getTokenLogoURL.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,13 @@
export const getTokenLogoURL = (address) => {
const logoExtensions = ['.png', '.webp', '.jpeg', '.svg'];
return logoExtensions.map((ext) => {
try {
// eslint-disable-next-line @typescript-eslint/no-var-requires
const image = require(`../assets/tokenLogo/${address.toLowerCase()}${ext}`)
.default;
return image;
} catch (e) {
return null;
}
});
};

0 comments on commit 825ebd5

Please sign in to comment.