feat: batch delete messages

src/common/component/Message/DeleteMessageConfirm.js

@@ -1,44 +0,0 @@
-// import React from "react";
-import { useEffect } from "react";
-// import { useDispatch } from "react-redux";
-// import BASE_URL from "../../app/config";
-import { useLazyDeleteMessageQuery } from "../../../app/services/message";
-import StyledModal from "../styled/Modal";
-import Button from "../styled/Button";
-import Modal from "../Modal";
-import PreviewMessage from "./PreviewMessage";
-export default function DeleteMessageConfirmModal({ closeModal, mid = 0 }) {
-  // const dispatch = useDispatch();
-  const [deleteMessage, { isLoading, isSuccess }] = useLazyDeleteMessageQuery();
-  const handleDelete = (evt) => {
-    const { mid } = evt.target.dataset;
-    if (!mid) return;
-    deleteMessage(mid);
-  };
-  useEffect(() => {
-    if (isSuccess) {
-      closeModal();
-    }
-  }, [isSuccess]);
-
-  if (!mid) return null;
-  return (
-    <Modal>
-      <StyledModal
-        // className="animate__animated animate__fadeInDown animate__faster"
-        buttons={
-          <>
-            <Button onClick={closeModal}>Cancel</Button>
-            <Button data-mid={mid} onClick={handleDelete} className="danger">
-              {isLoading ? "Deleting" : `Delete`}
-            </Button>
-          </>
-        }
-        title="Delete Message"
-        description="Are you sure want to delete this message?"
-      >
-        <PreviewMessage mid={mid} />
-      </StyledModal>
-    </Modal>
-  );
-}

src/common/component/Message/PinMessageModal.js

@@ -15,23 +15,23 @@ const StyledPinModal = styled(StyledModal)`
     overflow-x: hidden;
   }
 `;
-// import { useDispatch } from "react-redux";
-// import BASE_URL from "../../app/config";
-import { usePinMessageMutation } from "../../../app/services/message";
+import usePinMessage from "../../hook/usePinMessage";
 import StyledModal from "../styled/Modal";
 import Button from "../styled/Button";
 import Modal from "../Modal";
 import PreviewMessage from "./PreviewMessage";
+import toast from "react-hot-toast";
 
 export default function PinMessageModal({ closeModal, mid = 0, gid = 0 }) {
   // const dispatch = useDispatch();
-  const [pinMessage, { isLoading, isSuccess }] = usePinMessageMutation();
+  const { pinMessage, isPining, isSuccess } = usePinMessage(gid);
   const handlePin = () => {
-    pinMessage({ mid, gid });
+    pinMessage(mid);
   };
   useEffect(() => {
     if (isSuccess) {
       closeModal();
+      toast.success("Pin Message Successfully");
     }
   }, [isSuccess]);
 
@@ -45,8 +45,8 @@ export default function PinMessageModal({ closeModal, mid = 0, gid = 0 }) {
             <Button onClick={closeModal} className="cancel">
               Cancel
             </Button>
-            <Button disabled={isLoading} onClick={handlePin} className="main">
-              {isLoading ? "Pining" : `Pin It`}
+            <Button disabled={isPining} onClick={handlePin} className="main">
+              {isPining ? "Pining" : `Pin It`}
             </Button>
           </>
         }