41 lines
843 B
TypeScript
41 lines
843 B
TypeScript
import * as React from 'react';
|
|
import Avatar from '@mui/material/Avatar';
|
|
import type { AvatarProps } from '@mui/material/Avatar';
|
|
|
|
type AppIconProps = {
|
|
name?: string;
|
|
url?: string;
|
|
color?: string;
|
|
variant?: AvatarProps['variant'];
|
|
};
|
|
|
|
const inlineImgStyle: React.CSSProperties = {
|
|
objectFit: 'contain',
|
|
};
|
|
|
|
export default function AppIcon(props: AppIconProps & AvatarProps): React.ReactElement {
|
|
const {
|
|
name,
|
|
url,
|
|
color,
|
|
sx = {},
|
|
variant = "square",
|
|
...restProps
|
|
} = props;
|
|
|
|
const initialLetter = name?.[0];
|
|
|
|
return (
|
|
<Avatar
|
|
component="span"
|
|
variant={variant}
|
|
sx={{ bgcolor: color, display: 'flex', width: 50, height: 50, ...sx }}
|
|
imgProps={{ style: inlineImgStyle }}
|
|
src={url}
|
|
alt={name}
|
|
children={initialLetter}
|
|
{...restProps}
|
|
/>
|
|
);
|
|
};
|