email actions in single

src/pages/received/Components/MessageFavorite.tsx

@@ -0,0 +1,32 @@
+import { Star1 } from 'iconsax-react'
+import { FC, useState } from 'react'
+import { useNavigate, useParams } from 'react-router-dom'
+import { useMoveToFavorite, useUnFavoriteMessage } from '../hooks/useEmailData'
+
+const MessageFavorite: FC<{ isActiveFavorite: boolean }> = ({ isActiveFavorite }) => {
+    const [isFavorite, setIsFavorite] = useState<boolean>(isActiveFavorite)
+    const { id, mailbox } = useParams<{ id: string, mailbox: string }>()
+    const { mutate: moveToFavorite } = useMoveToFavorite()
+    const { mutate: unFavoriteMessage } = useUnFavoriteMessage()
+    const navigate = useNavigate()
+    return (
+        <Star1 onClick={() => {
+            if (isFavorite) {
+                unFavoriteMessage({ messageId: id || '', mailbox: mailbox || '' }, {
+                    onSuccess: () => {
+                        navigate(-1)
+                    }
+                })
+            } else {
+                moveToFavorite({ messageId: id || '', mailbox: mailbox || '' }, {
+                    onSuccess: () => {
+                        navigate(-1)
+                    }
+                })
+            }
+            setIsFavorite(!isFavorite)
+        }} size={18} variant={isFavorite ? 'Bold' : 'Outline'} color={isFavorite ? '#FFC107' : 'black'} className='xl:block hidden' />
+    )
+}
+
+export default MessageFavorite