select all + mobile table in all pages

src/pages/draft/List.tsx

@@ -8,9 +8,10 @@ import { RowActionItem } from '../../components/RowActionsDropdown';
 import { useNavigate } from 'react-router-dom';
 import { useGetDrafts } from './hooks/useDraftData';
 import { DraftMessage } from './types/DraftTypes';
-import { formatDate } from '@/config/func';
 import { useEmailActions } from '@/hooks/useEmailActions';
 import { useSharedStore } from '@/shared/store/sharedStore';
+import { Checkbox } from '@/components/ui/checkbox';
+import React from 'react';
 
 const List: FC = () => {
     const navigate = useNavigate();
@@ -29,8 +30,27 @@ const List: FC = () => {
     });
 
     const [selectedMessages, setSelectedMessages] = useState<DraftMessage[]>([]);
+    const [selectAll, setSelectAll] = useState(false);
 
-    const columns: ColumnType<DraftMessage>[] = [
+    // تابع برای گرفتن فقط ساعت
+    const formatTime = (dateString: string) => {
+        try {
+            if (!dateString) return '--:--';
+            const date = new Date(dateString);
+            if (isNaN(date.getTime())) return '--:--';
+
+            return new Intl.DateTimeFormat("fa-IR", {
+                hour: "2-digit",
+                minute: "2-digit",
+            }).format(date);
+        } catch (error) {
+            console.error('خطا در فرمت زمان:', error);
+            return '--:--';
+        }
+    };
+
+    // ستون‌های دسکتاپ
+    const desktopColumns: ColumnType<DraftMessage>[] = [
         {
             key: 'title',
             title: 'title',
@@ -66,13 +86,73 @@ const List: FC = () => {
             title: 'تاریخ',
             align: 'center',
             render: (item) => (
-                <span>{formatDate(item.date)}</span>
+                <span>{formatTime(item.date)}</span>
             )
         },
     ];
 
+    // ستون‌های موبایل (سه خطی)
+    const mobileColumns: ColumnType<DraftMessage>[] = [
+        {
+            key: 'content',
+            title: 'محتوا',
+            render: (item) => (
+                <div className="flex flex-col gap-1 w-full">
+                    <div className="flex items-center gap-2 w-full">
+                        <span className="text-[#0038FF] text-sm font-medium">پیش نویس</span>
+                        <span className="text-xs text-gray-500 whitespace-nowrap ml-auto">
+                            {formatTime(item.date)}
+                        </span>
+                    </div>
+
+                    <div className="truncate w-full text-sm font-medium">
+                        {item.subject || 'بدون موضوع'}
+                    </div>
+
+                    <div className="truncate w-full text-xs text-gray-600">
+                        گیرنده: {item.to && item.to.length > 0
+                            ? (item.to[0].name || item.to[0].address)
+                            : 'بدون گیرنده'
+                        }
+                    </div>
+                </div>
+            )
+        }
+    ];
+
+    // انتخاب ستون‌ها بر اساس سایز صفحه
+    const [isMobile, setIsMobile] = useState(window.innerWidth < 768);
+
+    React.useEffect(() => {
+        const handleResize = () => {
+            setIsMobile(window.innerWidth < 768);
+        };
+
+        window.addEventListener('resize', handleResize);
+        return () => window.removeEventListener('resize', handleResize);
+    }, []);
+
+    const columns = isMobile ? mobileColumns : desktopColumns;
+
+    const handleSelectAll = (checked: boolean) => {
+        setSelectAll(checked);
+        if (checked) {
+            const messages = draftData?.data?.draftsMail || [];
+            setSelectedMessages(messages);
+        } else {
+            setSelectedMessages([]);
+        }
+    };
+
     const tableActions = (
         <div className='flex items-center gap-2 md:gap-4'>
+            <div className="flex items-center gap-2">
+                <Checkbox
+                    checked={selectAll}
+                    onCheckedChange={handleSelectAll}
+                    className="w-4 h-4"
+                />
+            </div>
             <Refresh2
                 size={18}
                 color='black'
@@ -114,6 +194,9 @@ const List: FC = () => {
 
     const handleSelectionChange = (selectedRows: DraftMessage[]) => {
         setSelectedMessages(selectedRows);
+        // تنظیم وضعیت select all بر اساس انتخاب شده‌ها
+        const messages = draftData?.data?.draftsMail || [];
+        setSelectAll(selectedRows.length === messages.length && messages.length > 0);
     };
 
     const handleDeleteSelected = () => {
@@ -121,6 +204,7 @@ const List: FC = () => {
             emailActions.deleteDraft({ messageId: message.id, mailbox: message.mailbox });
         });
         setSelectedMessages([]);
+        setSelectAll(false);
     };
 
     const handleSendSelected = () => {
@@ -128,6 +212,7 @@ const List: FC = () => {
             emailActions.sendDraft({ messageId: message.id });
         });
         setSelectedMessages([]);
+        setSelectAll(false);
     };
 
     const handleEditSelected = () => {
@@ -136,6 +221,8 @@ const List: FC = () => {
         } else {
             console.log('ویرایش چندین پیش‌نویس انتخاب شده:', selectedMessages.map(m => m.id));
         }
+        setSelectedMessages([]);
+        setSelectAll(false);
     };
 
     const handleDeleteDraft = (messageId: number) => {