mirror of
https://github.com/kremalicious/metamask-extension.git
synced 2024-12-05 07:24:56 +01:00
42 lines
1.1 KiB
JavaScript
42 lines
1.1 KiB
JavaScript
|
import React from 'react';
|
||
|
import PropTypes from 'prop-types';
|
||
|
import classnames from 'classnames';
|
||
|
import Typography from '../../ui/typography';
|
||
|
import { TYPOGRAPHY } from '../../../helpers/constants/design-system';
|
||
|
import { useI18nContext } from '../../../hooks/useI18nContext';
|
||
|
|
||
|
export default function CollectibleDefaultImage({
|
||
|
name,
|
||
|
tokenId,
|
||
|
handleImageClick,
|
||
|
}) {
|
||
|
const t = useI18nContext();
|
||
|
return (
|
||
|
<div
|
||
|
className={classnames('collectible-default', {
|
||
|
'collectible-default--clickable': handleImageClick,
|
||
|
})}
|
||
|
onClick={handleImageClick}
|
||
|
>
|
||
|
<Typography variant={TYPOGRAPHY.H6} className="collectible-default__text">
|
||
|
{name ?? t('unknownCollection')} <br /> #{tokenId}
|
||
|
</Typography>
|
||
|
</div>
|
||
|
);
|
||
|
}
|
||
|
|
||
|
CollectibleDefaultImage.propTypes = {
|
||
|
/**
|
||
|
* The name of the collectible collection if not supplied will default to "Unnamed collection"
|
||
|
*/
|
||
|
name: PropTypes.string,
|
||
|
/**
|
||
|
* The token id of the collectible
|
||
|
*/
|
||
|
tokenId: PropTypes.string,
|
||
|
/**
|
||
|
* The click handler for the collectible default image
|
||
|
*/
|
||
|
handleImageClick: PropTypes.func,
|
||
|
};
|