59 lines
1.4 KiB
TypeScript
59 lines
1.4 KiB
TypeScript
import { Button } from "antd";
|
|
import InfoMessageIcon from "components/Icons/InfoMessageIcon";
|
|
import { useTranslation } from "react-i18next";
|
|
import { ProBottomSheet } from "../ProBottomSheet/ProBottomSheet";
|
|
import ProText from "../ProText";
|
|
import ProTitle from "../ProTitle";
|
|
|
|
interface InfoButtonSheetProps {
|
|
isOpen: boolean;
|
|
onClose: () => void;
|
|
title: string;
|
|
description: string;
|
|
}
|
|
|
|
export function InfoButtonSheet({
|
|
isOpen,
|
|
onClose,
|
|
title,
|
|
description,
|
|
}: InfoButtonSheetProps) {
|
|
const { t } = useTranslation();
|
|
const handleSave = () => {
|
|
onClose();
|
|
};
|
|
|
|
const handleCancel = () => {
|
|
onClose();
|
|
};
|
|
|
|
return (
|
|
<ProBottomSheet
|
|
isOpen={isOpen}
|
|
onClose={handleCancel}
|
|
title={title}
|
|
showCloseButton={false}
|
|
initialSnap={1}
|
|
height={"50vh"}
|
|
snapPoints={["50vh"]}
|
|
>
|
|
<div
|
|
style={{
|
|
display: "flex",
|
|
flexDirection: "column",
|
|
alignItems: "center",
|
|
justifyContent: "center",
|
|
}}
|
|
>
|
|
<InfoMessageIcon />
|
|
<ProTitle level={5}>{title}</ProTitle>
|
|
<ProText type="secondary" style={{textAlign:"center"}}>{description}</ProText>
|
|
</div>
|
|
<br />
|
|
<Button type="primary" style={{ width: "100%", boxShadow: "none", height: 48 }} onClick={handleSave}>
|
|
{t("address.gotIt")}
|
|
</Button>
|
|
</ProBottomSheet>
|
|
);
|
|
}
|