mark all as read + spam empty

src/pages/Trash/List.tsx

@@ -2,13 +2,17 @@ import Filters, { FilterValues } from '../../components/Filters';
 import { FC, useState } from 'react'
 import Table from '../../components/Table';
 import { ColumnType } from '../../components/types/TableTypes';
-import { InfoCircle, More, Refresh2, Trash, RecoveryConvert } from 'iconsax-react';
+import { InfoCircle, Refresh2, Trash, RecoveryConvert } from 'iconsax-react';
 import { RowActionItem } from '../../components/RowActionsDropdown';
 import { useNavigate } from 'react-router-dom';
-import { useGetTrashMessages } from './hooks/useTrashData';
+import { useEmptyTrash, useGetTrashMessages } from './hooks/useTrashData';
 import { TrashMessage } from './types/TrashTypes';
 import { formatDate } from '@/config/func';
 import { useEmailActions } from '@/hooks/useEmailActions';
+import Button from '@/components/Button';
+import ModalConfrim from '@/components/ModalConfrim';
+import { ErrorType } from '@/helpers/types';
+import { toast } from '@/components/Toast';
 
 const List: FC = () => {
     const navigate = useNavigate();
@@ -16,7 +20,8 @@ const List: FC = () => {
     const [previousCursor, setPreviousCursor] = useState<string | undefined>(undefined);
     const [filters, setFilters] = useState<FilterValues>({});
     const emailActions = useEmailActions();
-
+    const [showModal, setShowModal] = useState(false);
+    const { mutate: emptyTrash, isPending } = useEmptyTrash();
     const { data: trashData, isLoading, refetch, isFetching } = useGetTrashMessages({
         next: nextCursor,
         previous: previousCursor,
@@ -59,10 +64,15 @@ const List: FC = () => {
             <Refresh2
                 size={18}
                 color='black'
-                className={`cursor-pointer ${isFetching ? 'animate-spin-reverse' : ''}`}
+                className={`cursor-pointer min-w-[18px] ${isFetching ? 'animate-spin-reverse' : ''}`}
                 onClick={() => refetch()}
             />
-            <More size={18} color='black' className='rotate-90 cursor-pointer' />
+            <Button
+                label='خالی کردن سطل زباله'
+                className='h-8'
+                onClick={() => setShowModal(true)}
+                loading={isPending}
+            />
         </div>
     );
 
@@ -95,6 +105,18 @@ const List: FC = () => {
         setSelectedMessages([]);
     };
 
+    const handleTrash = () => {
+        emptyTrash(undefined, {
+            onSuccess: () => {
+                refetch();
+                setShowModal(false);
+            },
+            onError: (error: ErrorType) => {
+                toast(error.response?.data?.error.message[0], 'error')
+            }
+        });
+    };
+
     const getRowActions = (message: TrashMessage): RowActionItem[] => [
         {
             label: 'بازگردانی',
@@ -108,10 +130,6 @@ const List: FC = () => {
         },
     ];
 
-
-
-
-
     const handleNext = (cursor?: string) => {
         setNextCursor(cursor);
         setPreviousCursor(undefined);
@@ -165,6 +183,13 @@ const List: FC = () => {
                     onPrevious: handlePrevious
                 } : undefined}
             />
+
+            <ModalConfrim
+                isOpen={showModal}
+                close={() => setShowModal(false)}
+                onConfrim={handleTrash}
+                isLoading={isPending}
+            />
         </div>
     )
 }

src/pages/Trash/hooks/useTrashData.tsx

@@ -1,5 +1,5 @@
-import { useQuery } from '@tanstack/react-query';
-import { getTrashMessages } from '../service/TrashService';
+import { useMutation, useQuery } from '@tanstack/react-query';
+import { emptyTrash, getTrashMessages } from '../service/TrashService';
 import { MessageListQueryDto } from '../types/TrashTypes';
 
 export const useGetTrashMessages = (query: MessageListQueryDto) => {
@@ -10,4 +10,8 @@ export const useGetTrashMessages = (query: MessageListQueryDto) => {
     });
 };
 
-// Note: useRestoreMessage is now handled by useEmailActions hook 
+export const useEmptyTrash = () => {
+    return useMutation({
+        mutationFn: () => emptyTrash(),
+    });
+};

src/pages/Trash/service/TrashService.ts

@@ -1,3 +1,4 @@
+import { MailboxEnum } from "@/pages/received/enum/Enum";
 import axios from "../../../config/axios";
 import { getMailboxId } from "../../../config/func";
 import { MessageListQueryDto, TrashResponse } from "../types/TrashTypes";
@@ -25,3 +26,11 @@ export const getTrashMessages = async (
 };
 
 // Note: deleteMessagePermanently and restoreMessage are now handled by EmailActionsService
+
+export const emptyTrash = async () => {
+  const mailboxId = getMailboxId(MailboxEnum.TRASH);
+  const { data } = await axios.patch(
+    `/email/messages/empty-trash?mailbox=${mailboxId}`
+  );
+  return data;
+};

src/pages/received/List.tsx

@@ -6,7 +6,7 @@ import { ColumnType } from '../../components/types/TableTypes';
 import { InfoCircle, More, Refresh2, Trash, Edit, Archive, ArchiveTick, Star1 } from 'iconsax-react';
 import { RowActionItem } from '../../components/RowActionsDropdown';
 import { useNavigate } from 'react-router-dom';
-import { useGetInbox, useSummarizeEmail } from './hooks/useEmailData';
+import { useGetInbox, useMarkAllRead, useSummarizeEmail } from './hooks/useEmailData';
 import { InboxMessage } from './types/Types';
 import { formatDate } from '@/config/func';
 import MarkAsRead from '@/assets/images/mark_as_read.svg'
@@ -15,6 +15,10 @@ import Favorite from './Components/Favorite';
 import Summerize from './Components/Summerize';
 import Intelligense from '@/assets/images/intelligense.svg'
 import SummarizeModal from './Components/SummarizeModal';
+import Button from '@/components/Button';
+import ModalConfrim from '@/components/ModalConfrim';
+import { ErrorType } from '@/helpers/types';
+import { toast } from '@/components/Toast';
 
 const List: FC = () => {
 
@@ -25,7 +29,9 @@ const List: FC = () => {
     const [filters, setFilters] = useState<FilterValues>({});
     const emailActions = useEmailActions();
     const [openSummarizeModal, setOpenSummarizeModal] = useState(false);
+    const [showModal, setShowModal] = useState(false);
     const { mutate: summarizeEmail, isPending: isSummarizing, data: summarizeData } = useSummarizeEmail();
+    const { mutate: markAllRead, isPending: isMarkingAllRead } = useMarkAllRead();
 
     const { data: inboxData, isLoading, refetch, isFetching } = useGetInbox({
         next: nextCursor,
@@ -77,9 +83,15 @@ const List: FC = () => {
             <Refresh2
                 size={18}
                 color='black'
-                className={`cursor-pointer ${isFetching ? 'animate-spin-reverse' : ''}`}
+                className={`cursor-pointer min-w-[18px] ${isFetching ? 'animate-spin-reverse' : ''}`}
                 onClick={() => refetch()}
             />
+            <Button
+                label='علامت‌گذاری همه به عنوان خوانده شده'
+                className='h-8'
+                onClick={() => setShowModal(true)}
+                loading={isMarkingAllRead}
+            />
         </div>
     );
 
@@ -147,6 +159,18 @@ const List: FC = () => {
         setSelectedMessages([]);
     };
 
+    const handleMarkAll = () => {
+        markAllRead(undefined, {
+            onSuccess: () => {
+                refetch();
+                setShowModal(false);
+            },
+            onError: (error: ErrorType) => {
+                toast(error.response?.data?.error.message[0], 'error')
+            }
+        });
+    };
+
     const getInlineActions = (item: InboxMessage) => [
         {
             icon: <Favorite flagged={item.flagged} id={item.id.toString()} mailbox={item.mailbox} />,
@@ -285,6 +309,15 @@ const List: FC = () => {
                 />
             )}
 
+            <ModalConfrim
+                isOpen={showModal}
+                close={() => setShowModal(false)}
+                onConfrim={handleMarkAll}
+                isLoading={isMarkingAllRead}
+                title={'خواندن همه'}
+                label={'آیا از خواندن همه پیام ها اطمینان دارید؟'}
+            />
+
         </div>
     )
 }

src/pages/received/hooks/useEmailData.tsx

@@ -130,4 +130,10 @@ export const useGenerateEmail = () => {
     return useMutation({
         mutationFn: (params: GenerateEmailRequest) => api.generateEmail(params),
     });
+};
+
+export const useMarkAllRead = () => {
+    return useMutation({
+        mutationFn: () => api.markAllRead(),
+    });
 };

src/pages/received/service/EmailService.ts

@@ -9,6 +9,7 @@ import {
   SummarizeEmailRequest,
   GenerateEmailRequest,
 } from "../types/Types";
+import { MailboxEnum } from "../enum/Enum";
 
 export const sendEmail = async (params: SendEmailDto) => {
   const { data } = await axios.post(`/email/send`, params);
@@ -161,3 +162,11 @@ export const summarizeEmail = async (params: SummarizeEmailRequest) => {
   const { data } = await axios.post(`/ai-assistant/summarize-email`, params);
   return data;
 };
+
+export const markAllRead = async () => {
+  const mailboxId = getMailboxId(MailboxEnum.INBOX);
+  const { data } = await axios.patch(
+    `/email/messages/mark-all-read?mailbox=${mailboxId}`
+  );
+  return data;
+};

src/pages/spam/List.tsx

@@ -2,13 +2,17 @@ import Filters, { FilterValues } from '../../components/Filters';
 import { FC, useState } from 'react'
 import Table from '../../components/Table';
 import { ColumnType } from '../../components/types/TableTypes';
-import { InfoCircle, More, Refresh2, Trash, RecoveryConvert } from 'iconsax-react';
+import { InfoCircle, Refresh2, Trash, RecoveryConvert } from 'iconsax-react';
 import { RowActionItem } from '../../components/RowActionsDropdown';
 import { useNavigate } from 'react-router-dom';
-import { useGetSpamMessages } from './hooks/useSpamData';
+import { useEmptySpam, useGetSpamMessages } from './hooks/useSpamData';
 import { SpamMessage } from './types/SpamTypes';
 import { formatDate } from '@/config/func';
 import { useEmailActions } from '@/hooks/useEmailActions';
+import Button from '@/components/Button';
+import ModalConfrim from '@/components/ModalConfrim';
+import { ErrorType } from '@/helpers/types';
+import { toast } from '@/components/Toast';
 
 const List: FC = () => {
     const navigate = useNavigate();
@@ -16,6 +20,8 @@ const List: FC = () => {
     const [previousCursor, setPreviousCursor] = useState<string | undefined>(undefined);
     const [filters, setFilters] = useState<FilterValues>({});
     const emailActions = useEmailActions();
+    const [showModal, setShowModal] = useState(false);
+    const { mutate: emptySpam, isPending } = useEmptySpam();
 
     const { data: spamData, isLoading, refetch, isFetching } = useGetSpamMessages({
         next: nextCursor,
@@ -58,10 +64,15 @@ const List: FC = () => {
             <Refresh2
                 size={18}
                 color='black'
-                className={`cursor-pointer ${isFetching ? 'animate-spin-reverse' : ''}`}
+                className={`cursor-pointer min-w-[18px] ${isFetching ? 'animate-spin-reverse' : ''}`}
                 onClick={() => refetch()}
             />
-            <More size={18} color='black' className='rotate-90 cursor-pointer' />
+            <Button
+                label='خالی کردن هرزنامه'
+                className='h-8'
+                onClick={() => setShowModal(true)}
+                loading={isPending}
+            />
         </div>
     );
 
@@ -94,6 +105,18 @@ const List: FC = () => {
         setSelectedMessages([]);
     };
 
+    const handleSpam = () => {
+        emptySpam(undefined, {
+            onSuccess: () => {
+                refetch();
+                setShowModal(false);
+            },
+            onError: (error: ErrorType) => {
+                toast(error.response?.data?.error.message[0], 'error')
+            }
+        });
+    };
+
     const getRowActions = (message: SpamMessage): RowActionItem[] => [
         {
             label: 'غیر اسپم',
@@ -160,6 +183,13 @@ const List: FC = () => {
                     onPrevious: handlePrevious
                 } : undefined}
             />
+
+            <ModalConfrim
+                isOpen={showModal}
+                close={() => setShowModal(false)}
+                onConfrim={handleSpam}
+                isLoading={isPending}
+            />
         </div>
     )
 }

src/pages/spam/hooks/useSpamData.tsx

@@ -1,5 +1,5 @@
-import { useQuery } from '@tanstack/react-query';
-import { getSpamMessages } from '../service/SpamService';
+import { useMutation, useQuery } from '@tanstack/react-query';
+import { emptySpam, getSpamMessages } from '../service/SpamService';
 import { MessageListQueryDto } from '../types/SpamTypes';
 
 export const useGetSpamMessages = (query: MessageListQueryDto) => {
@@ -8,4 +8,10 @@ export const useGetSpamMessages = (query: MessageListQueryDto) => {
         queryFn: () => getSpamMessages(query),
         staleTime: 0
     });
+};
+
+export const useEmptySpam = () => {
+    return useMutation({
+        mutationFn: () => emptySpam(),
+    });
 }; 

src/pages/spam/service/SpamService.ts

@@ -1,6 +1,7 @@
 import axios from "../../../config/axios";
 import { getMailboxId } from "../../../config/func";
 import { MessageListQueryDto, SpamResponse } from "../types/SpamTypes";
+import { MailboxEnum } from "@/pages/received/enum/Enum";
 
 export const getSpamMessages = async (
   query: MessageListQueryDto
@@ -23,3 +24,11 @@ export const getSpamMessages = async (
   });
   return data;
 };
+
+export const emptySpam = async () => {
+  const mailboxId = getMailboxId(MailboxEnum.Junk);
+  const { data } = await axios.patch(
+    `/email/messages/empty-spam?mailbox=${mailboxId}`
+  );
+  return data;
+};