41 lines
960 B
TypeScript
41 lines
960 B
TypeScript
import { Card, CardHeader, CardContent, Typography } from '@mui/material';
|
|
import React, { ReactEventHandler } from 'react';
|
|
|
|
type ContentCardProps = {
|
|
title?: React.ReactNode;
|
|
subtitle?: string;
|
|
Icon?: React.ReactNode;
|
|
Action?: React.ReactNode;
|
|
errorMsg?: string;
|
|
onClick?: ReactEventHandler;
|
|
};
|
|
|
|
export const ContentCard: React.FC<ContentCardProps> = ({
|
|
title,
|
|
Icon,
|
|
Action,
|
|
subtitle,
|
|
errorMsg,
|
|
children,
|
|
onClick,
|
|
}) => (
|
|
<Card onClick={onClick} sx={{ height: '100%' }}>
|
|
{title && <CardHeader title={title || ''} avatar={Icon} action={Action} subheader={subtitle} />}
|
|
{children && <CardContent>{children}</CardContent>}
|
|
{errorMsg && (
|
|
<Typography variant="body2" sx={{ color: 'danger', padding: 2 }}>
|
|
{errorMsg}
|
|
</Typography>
|
|
)}
|
|
</Card>
|
|
);
|
|
|
|
ContentCard.defaultProps = {
|
|
title: undefined,
|
|
subtitle: undefined,
|
|
Icon: null,
|
|
Action: null,
|
|
errorMsg: undefined,
|
|
onClick: () => null,
|
|
};
|