From 70ee68d40d70852bfe5efa75499fcc3e898991a4 Mon Sep 17 00:00:00 2001 From: William Muli Date: Tue, 31 May 2022 10:23:02 +0300 Subject: [PATCH] Refactor isRemoteImageURL --- .../components/shared/create-network-icon/index.tsx | 4 ++-- .../shared/create-placeholder-icon/index.tsx | 4 ++-- .../panel/async/wallet_panel_async_handler.ts | 4 ++-- .../brave_wallet_ui/utils/string-utils.test.ts | 12 ++++++------ components/brave_wallet_ui/utils/string-utils.ts | 2 +- 5 files changed, 13 insertions(+), 13 deletions(-) diff --git a/components/brave_wallet_ui/components/shared/create-network-icon/index.tsx b/components/brave_wallet_ui/components/shared/create-network-icon/index.tsx index cbc39509fcb4..7a797a42863f 100644 --- a/components/brave_wallet_ui/components/shared/create-network-icon/index.tsx +++ b/components/brave_wallet_ui/components/shared/create-network-icon/index.tsx @@ -5,7 +5,7 @@ import { create } from 'ethereum-blockies' import { BraveWallet, SupportedTestNetworks } from '../../../constants/types' // Utils -import { stripERC20TokenImageURL, isRemoteImageURL, isValidIconExtension } from '../../../utils/string-utils' +import { stripERC20TokenImageURL, isFromDifferentOrigin, isValidIconExtension } from '../../../utils/string-utils' // Styled components import { IconWrapper, Placeholder, NetworkIcon } from './style' @@ -31,7 +31,7 @@ function CreateNetworkIcon (props: Props) { ) const networkImageURL = stripERC20TokenImageURL(network?.iconUrls[0]) - const isRemoteURL = isRemoteImageURL(networkImageURL) + const isRemoteURL = isFromDifferentOrigin(networkImageURL) const isDataURL = network.iconUrls[0]?.startsWith('chrome://erc-token-images/') const isStorybook = network.iconUrls[0]?.startsWith('static/media/components/brave_wallet_ui/') diff --git a/components/brave_wallet_ui/components/shared/create-placeholder-icon/index.tsx b/components/brave_wallet_ui/components/shared/create-placeholder-icon/index.tsx index 51634228fe50..5754fcfc60aa 100644 --- a/components/brave_wallet_ui/components/shared/create-placeholder-icon/index.tsx +++ b/components/brave_wallet_ui/components/shared/create-placeholder-icon/index.tsx @@ -5,7 +5,7 @@ import { background } from 'ethereum-blockies' import { BraveWallet } from '../../../constants/types' // Utils -import { stripERC20TokenImageURL, isRemoteImageURL, isValidIconExtension, httpifyIpfsUrl } from '../../../utils/string-utils' +import { stripERC20TokenImageURL, isFromDifferentOrigin, isValidIconExtension, httpifyIpfsUrl } from '../../../utils/string-utils' // Styled components import { IconWrapper, PlaceholderText } from './style' @@ -49,7 +49,7 @@ function withPlaceholderIcon (WrappedComponent: React.ComponentType, config ) const tokenImageURL = stripERC20TokenImageURL(asset.logo) - const isRemoteURL = isRemoteImageURL(tokenImageURL) + const isRemoteURL = isFromDifferentOrigin(tokenImageURL) const isDataURL = asset.logo.startsWith('chrome://erc-token-images/') const isStorybook = asset.logo.startsWith('static/media/components/brave_wallet_ui/') diff --git a/components/brave_wallet_ui/panel/async/wallet_panel_async_handler.ts b/components/brave_wallet_ui/panel/async/wallet_panel_async_handler.ts index de3781fc8672..39d15600b30b 100644 --- a/components/brave_wallet_ui/panel/async/wallet_panel_async_handler.ts +++ b/components/brave_wallet_ui/panel/async/wallet_panel_async_handler.ts @@ -44,7 +44,7 @@ import { import { Store } from '../../common/async/types' import { getLocale } from '../../../common/locale' import getWalletPanelApiProxy from '../wallet_panel_api_proxy' -import { isRemoteImageURL } from '../../utils/string-utils' +import { isFromDifferentOrigin } from '../../utils/string-utils' import { HardwareVendor } from 'components/brave_wallet_ui/common/api/hardware_keyrings' const handler = new AsyncActionHandler() @@ -123,7 +123,7 @@ async function getPendingAddSuggestTokenRequest () { (await braveWalletService.getPendingAddSuggestTokenRequests()).requests if (requests && requests.length) { const logo = requests[0].token.logo - if (logo !== '' && !isRemoteImageURL(logo)) { + if (logo !== '' && !isFromDifferentOrigin(logo)) { requests[0].token.logo = `chrome://erc-token-images/${logo}` } return requests[0] diff --git a/components/brave_wallet_ui/utils/string-utils.test.ts b/components/brave_wallet_ui/utils/string-utils.test.ts index 515987259baf..d5b62c0be4b3 100644 --- a/components/brave_wallet_ui/utils/string-utils.test.ts +++ b/components/brave_wallet_ui/utils/string-utils.test.ts @@ -1,24 +1,24 @@ -import { isRemoteImageURL, isValidIconExtension } from './string-utils' +import { isFromDifferentOrigin, isValidIconExtension } from './string-utils' describe('Checking URL is remote image or not', () => { test('HTTP URL should return true', () => { - expect(isRemoteImageURL('http://test.com/test.png')).toEqual(true) + expect(isFromDifferentOrigin('http://test.com/test.png')).toEqual(true) }) test('HTTPS URL should return true', () => { - expect(isRemoteImageURL('https://test.com/test.png')).toEqual(true) + expect(isFromDifferentOrigin('https://test.com/test.png')).toEqual(true) }) test('Data URL image should return true', () => { - expect(isRemoteImageURL('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAIAAACQd1PeAAAADElEQVR42mP4z8AAAAMBAQD3A0FDAAAAAElFTkSuQmCC')).toEqual(true) + expect(isFromDifferentOrigin('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAIAAACQd1PeAAAADElEQVR42mP4z8AAAAMBAQD3A0FDAAAAAElFTkSuQmCC')).toEqual(true) }) test('local path should return false', () => { - expect(isRemoteImageURL('bat.png')).toEqual(false) + expect(isFromDifferentOrigin('bat.png')).toEqual(false) }) test('undefined input should return undefined', () => { - expect(isRemoteImageURL(undefined)).toEqual(undefined) + expect(isFromDifferentOrigin(undefined)).toEqual(undefined) }) }) diff --git a/components/brave_wallet_ui/utils/string-utils.ts b/components/brave_wallet_ui/utils/string-utils.ts index 21a36efd120b..e55b88c1bf9a 100644 --- a/components/brave_wallet_ui/utils/string-utils.ts +++ b/components/brave_wallet_ui/utils/string-utils.ts @@ -7,7 +7,7 @@ export const toProperCase = (value: string) => value.replace(/\w\S*/g, (txt) => txt.charAt(0).toUpperCase() + txt.substr(1).toLowerCase()) -export const isRemoteImageURL = (url?: string) => +export const isFromDifferentOrigin = (url?: string) => url?.startsWith('http://') || url?.startsWith('https://') || url?.startsWith('data:image/') || url?.startsWith('ipfs://') export const isValidIconExtension = (url?: string) =>