diff --git a/.env b/.env index c70c7dd..39c58cc 100644 --- a/.env +++ b/.env @@ -1,6 +1,6 @@ VITE_TOKEN_NAME = 'dmail_token' VITE_REFRESH_TOKEN_NAME = 'dmail_refresh_token' VITE_DANAK_BASE_URL ='https://api.danakcorp.com' -# VITE_BASE_URL = 'http://192.168.1.134:4000' +# VITE_BASE_URL = 'http://192.168.1.113:4000' VITE_BASE_URL = 'https://dmail-api.danakcorp.com' VITE_SERVICE_ID = 'e51afdc3-ea0b-49cf-8f49-2a6f131b024e' diff --git a/public/vite.svg b/public/vite.svg index 30a42c2..239f57b 100644 --- a/public/vite.svg +++ b/public/vite.svg @@ -1,3 +1,19 @@ - - - + + + + + + + + + + + + + + + \ No newline at end of file diff --git a/src/config/func.ts b/src/config/func.ts index eafbdb3..6cbabb3 100644 --- a/src/config/func.ts +++ b/src/config/func.ts @@ -80,3 +80,34 @@ export const formatDate = (dateString: string) => { minute: "2-digit", }).format(date); }; + +export const sanitizeEmailHTML = (html: string): string => { + try { + // Remove style tags and their content + let sanitized = html.replace(/]*>[\s\S]*?<\/style>/gi, ""); + + // Remove link tags (CSS files) + sanitized = sanitized.replace(/]*>/gi, ""); + + // Remove all style attributes + sanitized = sanitized.replace(/\s*style\s*=\s*["'][^"']*["']/gi, ""); + + // Remove font-family and other font-related CSS properties + sanitized = sanitized + .replace(/font-family\s*:\s*[^;]*;?/gi, "") + .replace(/font-size\s*:\s*[^;]*;?/gi, "") + .replace(/font-weight\s*:\s*[^;]*;?/gi, "") + .replace(/color\s*:\s*[^;]*;?/gi, ""); + + // Remove script tags for security + sanitized = sanitized.replace(/]*>[\s\S]*?<\/script>/gi, ""); + + // Remove potentially harmful attributes + sanitized = sanitized.replace(/\s*on\w+\s*=\s*["'][^"']*["']/gi, ""); + + return sanitized; + } catch (error) { + console.error("خطا در پاک‌سازی HTML:", error); + return "خطا در نمایش محتوای ایمیل"; + } +}; diff --git a/src/index.css b/src/index.css index ae526c8..083bb8c 100644 --- a/src/index.css +++ b/src/index.css @@ -261,3 +261,38 @@ textarea::placeholder { .animate-spin-reverse { animation: spin-reverse 1s linear infinite; } + +/* Email Content Isolation */ +.email-content-container { + /* ایزوله کردن استایل‌های ایمیل از بقیه سایت */ + isolation: isolate; + contain: layout style; +} + +.email-content-container * { + /* اعمال فونت اصلی سایت به تمام عناصر داخل ایمیل */ + font-family: irancell !important; + /* محدود کردن اندازه فونت */ + font-size: inherit !important; + line-height: inherit !important; + /* جلوگیری از تغییر رنگ پس‌زمینه */ + background-color: transparent !important; +} + +.email-content-container p, +.email-content-container div, +.email-content-container span, +.email-content-container table, +.email-content-container td, +.email-content-container th { + /* حفظ فونت و اندازه اصلی */ + font-family: irancell !important; + font-size: 13px !important; + line-height: 1.75 !important; +} + +.email-content-container img { + /* محدود کردن اندازه تصاویر */ + max-width: 100% !important; + height: auto !important; +} diff --git a/src/pages/received/Detail.tsx b/src/pages/received/Detail.tsx index bf11148..5742709 100644 --- a/src/pages/received/Detail.tsx +++ b/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(false) @@ -26,7 +27,7 @@ const DetailEmail: FC = () => { const [priority, setPriority] = useState('') // 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 ( @@ -157,7 +164,11 @@ const DetailEmail: FC = () => {
{messageDetail.html && messageDetail.html.length > 0 ? ( -
+
) : (

{messageDetail.text || 'محتوای پیام'}

)}