Check box for dialog box

- Checkbox to ask if change all db dialog should open again

Related to #1048

Author: james-l-m-young

src/dashboard/header/DashboardChangeDatabaseConfirmDialog.tsx

@@ -1,17 +1,35 @@
-import React from 'react';
-import { Button, Dialog } from '@neo4j-ndl/react';
+import React, { useState } from 'react';
+import { Button, Checkbox, Dialog } from '@neo4j-ndl/react';
 import { BackspaceIconOutline, ExclamationTriangleIconOutline } from '@neo4j-ndl/react/icons';
 
 /**
  * Configures setting the current Neo4j database connection for the dashboard.
  */
 export const NeoDashboardChangeDatabaseConfirm = ({ open, onConfirm, handleClose }) => {
+
+  const [checked, setChecked] = useState(false);
+
   return (
-    <Dialog size='small' open={open == true} onClose={handleClose} aria-labelledby='form-dialog-title'>
+    <Dialog 
+      size='small' 
+      open={open == true} 
+      onClose={(event, reason) => {
+        if (reason !== 'backdropClick') {
+          handleClose();
+        }
+      }}
+      aria-labelledby='form-dialog-title'>
       <Dialog.Header id='form-dialog-title'>Change Database For All Reports?</Dialog.Header>
       <Dialog.Subtitle>
         This will change the database for all reports.
       </Dialog.Subtitle>
+      <Dialog.Actions>
+        <Checkbox
+            label="Don't ask again"
+            checked={checked}
+            onChange={(event) => setChecked(event.target.checked)}
+          />
+      </Dialog.Actions>
       <Dialog.Actions>
         <Button
           onClick={() => {
@@ -24,6 +42,9 @@ export const NeoDashboardChangeDatabaseConfirm = ({ open, onConfirm, handleClose
         </Button>
         <Button
           onClick={() => {
+            if (checked == true){
+              sessionStorage.setItem('ChangeDatabaseConfirmBoolean','True')
+            }
             onConfirm();
             handleClose();
           }}

src/dashboard/header/DashboardHeader.tsx

@@ -154,11 +154,14 @@ export const NeoDashboardHeader = ({
         databases={databases}
         selected={dataDatabase}
         setSelected={(newDatabase) => {
-          setModalOpen(Modal.CHANGE);
-          setDataDatabase(newDatabase);
-          console.log(newDatabase)
-          console.log(dataDatabase)
-          refreshPage(newDatabase)
+          let ChangeDatabaseConfirmBoolean = sessionStorage.getItem("ChangeDatabaseConfirmBoolean") || "False"
+          if (ChangeDatabaseConfirmBoolean == 'True'){
+            setDataDatabase(newDatabase);
+            refreshPage(newDatabase)
+          }
+          else{
+            setModalOpen(Modal.CHANGE);
+          }
         }}
         open={menuOpen == Menu.DATABASE}
         anchorEl={menuAnchor}