44 lines
929 B
JavaScript
44 lines
929 B
JavaScript
import * as React from 'react';
|
|
import PropTypes from 'prop-types';
|
|
import Avatar from '@mui/material/Avatar';
|
|
const inlineImgStyle = {
|
|
objectFit: 'contain',
|
|
};
|
|
function AppIcon(props) {
|
|
const { name, url, color, sx = {}, variant = 'square', ...restProps } = props;
|
|
const initialLetter = name?.[0];
|
|
|
|
return (
|
|
<Avatar
|
|
component="span"
|
|
variant={variant}
|
|
sx={{
|
|
bgcolor: url ? null : color,
|
|
display: 'flex',
|
|
width: 50,
|
|
height: 50,
|
|
...sx,
|
|
}}
|
|
imgProps={{ style: inlineImgStyle }}
|
|
src={url}
|
|
alt={name}
|
|
{...restProps}
|
|
>
|
|
{initialLetter}
|
|
</Avatar>
|
|
);
|
|
}
|
|
|
|
AppIcon.propTypes = {
|
|
name: PropTypes.string,
|
|
url: PropTypes.string,
|
|
color: PropTypes.string,
|
|
variant: PropTypes.oneOfType([
|
|
PropTypes.oneOf(['circular', 'rounded', 'square']),
|
|
PropTypes.string,
|
|
]),
|
|
sx: PropTypes.object,
|
|
};
|
|
|
|
export default AppIcon;
|