35 lines
839 B
TypeScript
35 lines
839 B
TypeScript
|
import { Card, CardContent, Typography } from "@material-ui/core";
|
||
|
|
import { makeStyles } from "@saleor/macaw-ui";
|
||
|
|
import classNames from "classnames";
|
||
|
|
import React from "react";
|
||
|
|
interface ErrorNoticeBarProps {
|
||
|
|
className?: string;
|
||
|
|
message: string | React.ReactNode;
|
||
|
|
}
|
||
|
|
|
||
|
|
const useStyles = makeStyles(
|
||
|
|
theme => ({
|
||
|
|
root: {
|
||
|
|
background: theme.palette.alert.paper.error
|
||
|
|
}
|
||
|
|
}),
|
||
|
|
{
|
||
|
|
name: "ErrorNoticeBar"
|
||
|
|
}
|
||
|
|
);
|
||
|
|
|
||
|
|
const ErrorNoticeBar: React.FC<ErrorNoticeBarProps> = props => {
|
||
|
|
const { className, message } = props;
|
||
|
|
const classes = useStyles(props);
|
||
|
|
|
||
|
|
return (
|
||
|
|
<Card className={classNames(classes.root, className)}>
|
||
|
|
<CardContent>
|
||
|
|
<Typography variant="body1">{message}</Typography>
|
||
|
|
</CardContent>
|
||
|
|
</Card>
|
||
|
|
);
|
||
|
|
};
|
||
|
|
ErrorNoticeBar.displayName = "ErrorNoticeBar";
|
||
|
|
export default ErrorNoticeBar;
|