diff --git a/frontend/services/mail.ts b/frontend/services/mail.ts
index 496a750..2f44422 100644
--- a/frontend/services/mail.ts
+++ b/frontend/services/mail.ts
@@ -14,6 +14,47 @@ import type {
 } from './dto/mail'
 import type { Task } from './dto/task'
 
+type BackendMailMessage = {
+    id: number
+    messageId: string
+    uid: number
+    folderPath?: string
+    subject: string | null
+    fromAddress: string | null
+    fromName: string | null
+    toAddresses: string[] | null
+    ccAddresses: string[] | null
+    sentAt: string | null
+    isRead: boolean
+    isFlagged: boolean
+    hasAttachments: boolean
+    snippet?: string | null
+    linkedTaskIds?: number[]
+}
+
+function toAddressList(values: string[] | null | undefined): { email: string; name: string | null }[] {
+    return (values ?? []).map((email) => ({ email, name: null }))
+}
+
+function mapHeader(m: BackendMailMessage, fallbackFolderPath = ''): MailMessageHeaderDto {
+    return {
+        id: m.id,
+        messageId: m.messageId,
+        folderPath: m.folderPath ?? fallbackFolderPath,
+        subject: m.subject,
+        fromName: m.fromName,
+        fromEmail: m.fromAddress,
+        toRecipients: toAddressList(m.toAddresses),
+        ccRecipients: toAddressList(m.ccAddresses),
+        sentAt: m.sentAt,
+        receivedAt: m.sentAt ?? '',
+        isRead: m.isRead,
+        isFlagged: m.isFlagged,
+        hasAttachments: m.hasAttachments,
+        linkedTaskIds: m.linkedTaskIds ?? [],
+    }
+}
+
 export function useMailService() {
     const api = useApi()
 
@@ -74,10 +115,19 @@ export function useMailService() {
         cursor?: string,
         limit?: number,
     ): Promise<MailMessagesPageDto> {
-        const query: Record<string, unknown> = { folder: folderPath }
+        const query: Record<string, unknown> = {}
         if (cursor) query.cursor = cursor
         if (limit) query.limit = limit
-        return api.get<MailMessagesPageDto>('/mail/messages', query)
+        const path = `/mail/folders/${encodeURIComponent(folderPath)}/messages`
+        const response = await api.get<{ messages: BackendMailMessage[]; nextCursor: string | null }>(
+            path,
+            query,
+        )
+        return {
+            items: response.messages.map((m) => mapHeader(m, folderPath)),
+            nextCursor: response.nextCursor,
+            total: response.messages.length,
+        }
     }
 
     /**
@@ -85,7 +135,19 @@ export function useMailService() {
      * @param id - ID BDD du message (MailMessage.id)
      */
     async function getMessage(id: number): Promise<MailMessageDetailDto> {
-        return api.get<MailMessageDetailDto>(`/mail/messages/${id}`)
+        const response = await api.get<
+            BackendMailMessage & {
+                bodyHtml: string | null
+                bodyText: string | null
+                attachments: MailMessageDetailDto['attachments']
+            }
+        >(`/mail/messages/${id}`)
+        return {
+            header: mapHeader(response),
+            bodyHtml: response.bodyHtml,
+            bodyText: response.bodyText,
+            attachments: response.attachments,
+        }
     }
 
     // ─── Actions sur les messages ─────────────────────────────────────────────