39 lines
1.1 KiB
JavaScript
39 lines
1.1 KiB
JavaScript
import React, { useState } from "react";
|
|
import styles from "./styles.module.css";
|
|
import BoxedCheckIcon from "../icons/boxedCheck";
|
|
const Alert = (props) => {
|
|
const [hide, setHide] = useState(false);
|
|
const handleHide = () => {
|
|
setHide(true);
|
|
setTimeout(() => {
|
|
props.setTriggerAlert(false);
|
|
}, 250);
|
|
};
|
|
return (
|
|
<div className={styles.container}>
|
|
<div
|
|
className={`${styles.alertContainer} ${hide ? styles.hide : styles.show}`}
|
|
>
|
|
<div className={styles.headers}>
|
|
<div className={styles.iconContainer}>
|
|
<BoxedCheckIcon />
|
|
</div>
|
|
<p>Create New Service</p>
|
|
</div>
|
|
<div className={styles.alertBody}>
|
|
<p>
|
|
You are about to add a new record. Please review the details before
|
|
continuing. Do you want to proceed?
|
|
</p>
|
|
</div>
|
|
<div className={styles.actionButtons}>
|
|
<button onClick={handleHide}>Confirm</button>
|
|
<button onClick={handleHide}>Cancel</button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
);
|
|
};
|
|
|
|
export default Alert;
|