Header and newLetter updated

src/Components/Header.jsx

@@ -50,26 +50,10 @@ const Header = ({ link, btnTitle, title }) => {
         {title}
       </Text> */}
 
-      {btnTitle &&
-        link &&
-        (link === "" ? (
-          <Link to={link}>
-            <Button
-              leftIcon={<AddIcon />}
-              backgroundColor={"purple.900"}
-              _hover={{
-                backgroundColor: "purple.800",
-              }}
-              color={"whitesmoke"}
-              size="sm"
-              rounded={"sm"}
-            >
-              {btnTitle}
-            </Button>
-          </Link>
-        ) : (
+      {btnTitle != "Export email" ? (
+        <Link to={link}>
           <Button
-            leftIcon={<IoMdDownload />}
+            leftIcon={<AddIcon />}
             backgroundColor={"purple.900"}
             _hover={{
               backgroundColor: "purple.800",
@@ -77,11 +61,25 @@ const Header = ({ link, btnTitle, title }) => {
             color={"whitesmoke"}
             size="sm"
             rounded={"sm"}
-            onClick={handleDownload}
           >
             {btnTitle}
           </Button>
-        ))}
+        </Link>
+      ) : (
+        <Button
+          leftIcon={<IoMdDownload />}
+          backgroundColor={"purple.900"}
+          _hover={{
+            backgroundColor: "purple.800",
+          }}
+          color={"whitesmoke"}
+          size="sm"
+          rounded={"sm"}
+          onClick={handleDownload}
+        >
+          {btnTitle}
+        </Button>
+      )}
     </Box>
   );
 };

src/Pages/NewLetter/NewsLetter.jsx

@@ -12,6 +12,15 @@ import {
   Tooltip,
   useToast,
 } from "@chakra-ui/react";
+import {
+  AlertDialog,
+  AlertDialogBody,
+  AlertDialogCloseButton,
+  AlertDialogContent,
+  AlertDialogFooter,
+  AlertDialogOverlay,
+  useDisclosure,
+} from "@chakra-ui/react";
 import { OPACITY_ON_LOAD } from "../../Layout/animations";
 import { TABLE_PAGINATION } from "../../Constants/Paginations";
 import {
@@ -43,8 +52,8 @@ const NewsLetter = () => {
 
   const { data } = useGetNewsLetterQuery();
   // console.log(useGetNewsletterQuery);
-  const faq = data?.data?.rows;
-  console.log(faq);
+  const email = data?.data?.rows;
+  console.log(email);
 
   const [deleteEmail] = useDeleteEmailMutation();
   // const [updateFaqStatus] = useUpdateFaqStatusMutation();
@@ -111,7 +120,7 @@ const NewsLetter = () => {
     "Actions",
   ];
 
-  const extractedArray = faq?.map((item, index) => {
+  const extractedArray = email?.map((item, index) => {
     return {
       Title: (
         <Link w={200} to={`/faq/view/${item.id}`}>
@@ -172,7 +181,9 @@ const NewsLetter = () => {
             size={"xs"}
             colorScheme="red"
             variant="ghost"
-            onClick={() => handleDelete(item.id)}
+            onClick={() => {
+              setDeleteAlert(true);
+            }}
           >
             <DeleteIcon me={2} /> Delete
           </Button>
@@ -189,7 +200,7 @@ const NewsLetter = () => {
         title={"News Letter"}
         btnTitle={"Export email"}
         link={"/faq/add-faq"}
-        apiData={faq}
+        apiData={email}
         tableHeadRow={tableHeadRow}
         extractedArray={extractedArray}
         searchTerm={searchTerm}
@@ -200,16 +211,60 @@ const NewsLetter = () => {
         setPageSize={setPageSize}
         currentPage={currentPage}
         setCurrentPage={setCurrentPage}
-        totalPages={faq?.data?.data?.totalPages}
-        noDataTitle={"faq"}
+        totalPages={email?.data?.data?.totalPages}
+        noDataTitle={"NewsLetter"}
       />
-      <CustomAlertDialog
+      {/* <CustomAlertDialog
         onClose={() => setDeleteAlert(false)}
         isOpen={deleteAlert}
         alertHandler={() => handleDelete(actionId)}
-        message={"Are you sure you want to delete Faq?"}
+        message={"Are you sure you want to delete Email?"}
         isLoading={deleteIsLoading}
-      />
+      /> */}
+
+      <AlertDialog
+        motionPreset="slideInBottom"
+        // leastDestructiveRef={cancelRef}
+        onClose={() => setDeleteAlert(false)}
+        isOpen={deleteAlert}
+        isCentered
+      >
+        <AlertDialogOverlay />
+
+        <AlertDialogContent w={400}>
+          <AlertDialogCloseButton className="web-text-xsmall link" />
+          <AlertDialogBody
+            className="text-center web-text-large fw-bold"
+            pt={8}
+          >
+            Are you sure you want to delete Email?
+          </AlertDialogBody>
+          <AlertDialogFooter display={"flex"} justifyContent={"center"}>
+            <Button
+              size={"sm"}
+              // ref={cancelRef}
+              onClick={() => setDeleteAlert(false)}
+            >
+              No
+            </Button>
+            <Button
+              backgroundColor={"#ff6b6b"}
+              isLoading={deleteIsLoading}
+              // onClick={() => {
+              //   email.forEach((item) => {
+              //     handleDelete(item.id);
+              //   });
+              // }}
+              onClick={() => handleDelete(actionId)}
+              size={"sm"}
+              colorScheme="red"
+              ml={3}
+            >
+              Yes
+            </Button>
+          </AlertDialogFooter>
+        </AlertDialogContent>
+      </AlertDialog>
     </>
   );
 };