45 lines
1.2 KiB
TypeScript
45 lines
1.2 KiB
TypeScript
|
import React, { memo } from 'react';
|
||
|
|
|
||
|
|
import { areEqual } from 'Utils/equalityChecks';
|
||
|
|
import { CheckedMarkSvg } from 'Components/Icons/CheckedMark';
|
||
|
|
|
||
|
|
import classes from './contractFormsToast.module.css';
|
||
|
|
|
||
|
|
export interface Props {
|
||
|
|
showToast: boolean;
|
||
|
|
message: string;
|
||
|
|
type?: 'success' | 'error';
|
||
|
|
}
|
||
|
|
|
||
|
|
const ContractFormsToast = ({ showToast = false, message, type = 'success' }: Props) => {
|
||
|
|
const getToastClass = () => (type === 'success' ? classes.toastSuccess : classes.toastWarning);
|
||
|
|
|
||
|
|
return (
|
||
|
|
<div
|
||
|
|
className={`toast fade d-flex align-items-center position-absolute border-0 bottom-0 ${
|
||
|
|
showToast ? 'show' : 'hide'
|
||
|
|
} ${classes.toastBase} ${getToastClass()}`}
|
||
|
|
role="alert"
|
||
|
|
aria-live="assertive"
|
||
|
|
aria-atomic="true"
|
||
|
|
>
|
||
|
|
<div className={`toast-body ${classes['toast-body-override']} ${classes.toastText}`}>
|
||
|
|
{message}
|
||
|
|
{type === 'success' && (
|
||
|
|
<span className={`${classes.toastIcon}`}>
|
||
|
|
<CheckedMarkSvg />
|
||
|
|
</span>
|
||
|
|
)}
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
);
|
||
|
|
};
|
||
|
|
|
||
|
|
ContractFormsToast.defaultProps = {
|
||
|
|
type: 'success',
|
||
|
|
};
|
||
|
|
|
||
|
|
const ContractFormsToastMemo = memo(ContractFormsToast, areEqual);
|
||
|
|
|
||
|
|
export { ContractFormsToastMemo as ContractFormsToast };
|