fix problem font in detail email + refetch inbox when open detail email + ...

src/pages/received/Detail.tsx

@@ -1,5 +1,5 @@
 import Button from '@/components/Button'
-import { FC, useState } from 'react'
+import { FC, useEffect, useState } from 'react'
 import { useTranslation } from 'react-i18next'
 import { useParams } from 'react-router-dom'
 import AvatarImage from '@/assets/images/avatar.svg'
@@ -9,16 +9,17 @@ import AnswerIcon from '@/assets/images/answer.svg'
 import Header from './Components/Header'
 import ReactQuill from 'react-quill-new';
 import Select from '@/components/Select'
-import { useGetMessageDetail, useSendEmail } from './hooks/useEmailData'
+import { useGetInbox, useGetMessageDetail, useSendEmail } from './hooks/useEmailData'
 import { useAuthStore } from '../auth/store/AuthStore'
 import { SendEmailDto } from './types/Types'
 import { toast } from '@/components/Toast'
-import { formatDate } from '@/config/func'
+import { formatDate, sanitizeEmailHTML } from '@/config/func'
 import SkeletonDetail from './Components/SkeletonDetail'
 
 const DetailEmail: FC = () => {
 
     const { t } = useTranslation()
+    const { refetch } = useGetInbox({ page: 1 })
     const { id } = useParams<{ id: string }>()
     const { email: userEmail } = useAuthStore()
     const [showAnswer, setShowAnswer] = useState<boolean>(false)
@@ -26,7 +27,7 @@ const DetailEmail: FC = () => {
     const [priority, setPriority] = useState<string>('')
 
     // API hooks
-    const { data: messageDetail, isLoading, error } = useGetMessageDetail(id || '', !!id)
+    const { data: messageDetail, isLoading, error, isSuccess } = useGetMessageDetail(id || '', !!id)
     const sendEmailMutation = useSendEmail()
     // const saveDraftMutation = useSaveDraft()
 
@@ -107,6 +108,12 @@ const DetailEmail: FC = () => {
         toast('قابلیت ارسال به دیگران به زودی اضافه خواهد شد', 'info')
     }
 
+    useEffect(() => {
+        if (isSuccess) {
+            refetch()
+        }
+    }, [isSuccess])
+
     if (isLoading) {
         return (
             <SkeletonDetail />
@@ -157,7 +164,11 @@ const DetailEmail: FC = () => {
 
             <div className='xl:mt-8 mt-3 text-[13px] leading-7 font-light'>
                 {messageDetail.html && messageDetail.html.length > 0 ? (
-                    <div dangerouslySetInnerHTML={{ __html: messageDetail.html.join('') }} />
+                    <div
+                        className='email-content-container p-4 bg-gray-50 rounded-lg overflow-hidden'
+
+                        dangerouslySetInnerHTML={{ __html: sanitizeEmailHTML(messageDetail.html.join('')) }}
+                    />
                 ) : (
                     <p>{messageDetail.text || 'محتوای پیام'}</p>
                 )}