From 6409975a6e73f4ccfcf8024346f5f8b9ba835968 Mon Sep 17 00:00:00 2001
From: bsourisse <dev@r4ven.fr>
Date: Mon, 16 Jan 2023 18:28:54 +0100
Subject: [PATCH] feat: add setting to enable/disable email alert

---
 .../EmailAlertSettings/EmailAlertSettings.js  | 91 +++++++++++++++++++
 Containers/UserSettings/UserSettings.js       |  2 +
 2 files changed, 93 insertions(+)
 create mode 100644 Containers/UserSettings/EmailAlertSettings/EmailAlertSettings.js

diff --git a/Containers/UserSettings/EmailAlertSettings/EmailAlertSettings.js b/Containers/UserSettings/EmailAlertSettings/EmailAlertSettings.js
new file mode 100644
index 0000000..d9bf4fc
--- /dev/null
+++ b/Containers/UserSettings/EmailAlertSettings/EmailAlertSettings.js
@@ -0,0 +1,91 @@
+//Lib
+import { ToastContainer, toast } from 'react-toastify';
+import 'react-toastify/dist/ReactToastify.css';
+import classes from '../UserSettings.module.css';
+import { useState } from 'react';
+import { SpinnerDotted } from 'spinners-react';
+
+//Components
+import Error from '../../../Components/UI/Error/Error';
+import Switch from '../../../Components/UI/Switch/Switch';
+
+export default function EmailAlertSettings(props) {
+    //Var
+    const toastOptions = {
+        position: 'top-right',
+        autoClose: 8000,
+        hideProgressBar: false,
+        closeOnClick: true,
+        pauseOnHover: true,
+        draggable: true,
+        progress: undefined,
+    };
+
+    ////State
+    const [isLoading, setIsLoading] = useState(false);
+    const [error, setError] = useState();
+
+    ////Functions
+    //Form submit Handler for ADD a repo
+    // const formSubmitHandler = async (data) => {
+    //     console.log(data);
+    //     //Remove old error
+    //     setError();
+    //     //Loading button on submit to avoid multiple send.
+    //     setIsLoading(true);
+    //     //POST API to send the new and old password
+    //     const response = await fetch('/api/account/updateEmail', {
+    //         method: 'PUT',
+    //         headers: {
+    //             'Content-type': 'application/json',
+    //         },
+    //         body: JSON.stringify(data),
+    //     });
+    //     const result = await response.json();
+
+    //     if (!response.ok) {
+    //         setIsLoading(false);
+    //         reset();
+    //         setError(result.message);
+    //         setTimeout(() => setError(), 4000);
+    //     } else {
+    //         reset();
+    //         setIsLoading(false);
+    //         setInfo(true);
+    //         toast.success('Email edited !', {
+    //             position: 'top-right',
+    //             autoClose: 5000,
+    //             hideProgressBar: false,
+    //             closeOnClick: true,
+    //             pauseOnHover: true,
+    //             draggable: true,
+    //             progress: undefined,
+    //         });
+    //     }
+    // };
+
+    const onChangeSwitchHandler = (e) => {
+        console.log(e);
+    };
+    return (
+        <>
+            {/* EMAIL ALERT */}
+            <div className={classes.containerSetting}>
+                <div className={classes.settingCategory}>
+                    <h2>Alerting</h2>
+                </div>
+                <div className={classes.setting}>
+                    <div className={classes.bwFormWrapper}>
+                        <Switch
+                            switchName='Email'
+                            switchDescription='You will receive an alert every 24H if you have a down status.'
+                            onChange={(e) =>
+                                onChangeSwitchHandler({ emailAlert: e })
+                            }
+                        />
+                    </div>
+                </div>
+            </div>
+        </>
+    );
+}
diff --git a/Containers/UserSettings/UserSettings.js b/Containers/UserSettings/UserSettings.js
index 07ec7f4..c324aa0 100644
--- a/Containers/UserSettings/UserSettings.js
+++ b/Containers/UserSettings/UserSettings.js
@@ -6,6 +6,7 @@ import classes from './UserSettings.module.css';
 import EmailSettings from './EmailSettings/EmailSettings';
 import PasswordSettings from './PasswordSettings/PasswordSettings';
 import UsernameSettings from './UsernameSettings/UsernameSettings';
+import EmailAlertSettings from './EmailAlertSettings/EmailAlertSettings';
 
 export default function UserSettings(props) {
     return (
@@ -21,6 +22,7 @@ export default function UserSettings(props) {
             <PasswordSettings username={props.data.user.name} />
             <EmailSettings email={props.data.user.email} />
             <UsernameSettings username={props.data.user.name} />
+            <EmailAlertSettings />
         </div>
     );
 }