58 lines
1.8 KiB
JavaScript
58 lines
1.8 KiB
JavaScript
import React from "react";
|
|
import styles from "./Transactions.module.css";
|
|
import { requestNotificationPermission } from '../services/notificationService'; // Import the notification service
|
|
|
|
export default function Transaction_pending({ setModal }) {
|
|
// const containerStyle = {
|
|
// display: "flex",
|
|
// justifyContent: "center",
|
|
// alignItems: "center",
|
|
// width: "100%",
|
|
// height: "100%",
|
|
// backgroundColor: "",
|
|
// };
|
|
|
|
const handleNotificationClick = async () => {
|
|
const permission = await requestNotificationPermission();
|
|
|
|
if (permission === "granted") {
|
|
console.log("Notification permission granted.");
|
|
// Set up notifications or show a success modal
|
|
} else {
|
|
console.error("Notification permission denied.");
|
|
setModal('blocked_notification'); // Show modal for blocked notifications
|
|
}
|
|
};
|
|
|
|
return (
|
|
<div className={styles.Transaction}>
|
|
<div style={{ marginTop: "30px", textAlign: "center" }}>
|
|
<h2>Aktifkan Notifikasi</h2>
|
|
<img
|
|
className={styles.expression}
|
|
src="https://i.imgur.com/sgvMI02.png"
|
|
alt="Success"
|
|
/>
|
|
<p style={{ marginTop: "20px", color: "black" }}>
|
|
Sepertinya notifikasi untuk situs ini tidak aktif. Aktifkan notifikasi supaya kamu tetap dapat info pesanan, meski sedang buka aplikasi lain.
|
|
</p>
|
|
<button
|
|
onClick={handleNotificationClick}
|
|
style={{
|
|
marginTop: "10px",
|
|
padding: "10px 20px",
|
|
fontSize: "16px",
|
|
cursor: "pointer",
|
|
backgroundColor: "#4CAF50",
|
|
color: "#fff",
|
|
border: "none",
|
|
borderRadius: "5px",
|
|
}}
|
|
>
|
|
Aktifkan
|
|
</button>
|
|
</div>
|
|
</div>
|
|
);
|
|
}
|