88 lines
2.3 KiB
TypeScript
88 lines
2.3 KiB
TypeScript
"use client";
|
|
|
|
import { useEffect, useState } from "react";
|
|
import { useSession } from "next-auth/react";
|
|
import { useRouter } from "next/navigation";
|
|
import { MailToolbar } from "@/components/mail/mail-toolbar";
|
|
import { MailList } from "@/components/mail/mail-list";
|
|
import { useMail } from "@/hooks/use-mail";
|
|
import { Mail } from "@/types/mail";
|
|
|
|
export default function CourrierPage() {
|
|
const { data: session } = useSession();
|
|
const router = useRouter();
|
|
const { mails, loading, error, fetchMails } = useMail();
|
|
const [searchQuery, setSearchQuery] = useState("");
|
|
|
|
useEffect(() => {
|
|
if (!session) {
|
|
router.push("/signin");
|
|
return;
|
|
}
|
|
|
|
// Check if we have mail credentials
|
|
const mailCredentials = localStorage.getItem("mailCredentials");
|
|
if (mailCredentials) {
|
|
fetchMails();
|
|
}
|
|
}, [session, router, fetchMails]);
|
|
|
|
const handleRefresh = () => {
|
|
fetchMails();
|
|
};
|
|
|
|
const handleCompose = () => {
|
|
// TODO: Implement compose functionality
|
|
};
|
|
|
|
const handleSearch = (query: string) => {
|
|
setSearchQuery(query);
|
|
};
|
|
|
|
const handleMailClick = (mail: Mail) => {
|
|
// TODO: Implement mail view functionality
|
|
};
|
|
|
|
if (loading) {
|
|
return (
|
|
<div className="flex items-center justify-center h-screen">
|
|
<div className="text-center">
|
|
<div className="animate-spin rounded-full h-12 w-12 border-b-2 border-gray-900"></div>
|
|
<p className="mt-4 text-gray-600">Chargement des courriers...</p>
|
|
</div>
|
|
</div>
|
|
);
|
|
}
|
|
|
|
if (error) {
|
|
return (
|
|
<div className="flex items-center justify-center h-screen">
|
|
<div className="text-center">
|
|
<p className="text-red-600">Erreur: {error}</p>
|
|
<button
|
|
onClick={handleRefresh}
|
|
className="mt-4 px-4 py-2 bg-blue-500 text-white rounded hover:bg-blue-600"
|
|
>
|
|
Réessayer
|
|
</button>
|
|
</div>
|
|
</div>
|
|
);
|
|
}
|
|
|
|
return (
|
|
<div className="flex flex-col h-screen">
|
|
<MailToolbar
|
|
onRefresh={handleRefresh}
|
|
onCompose={handleCompose}
|
|
onSearch={handleSearch}
|
|
/>
|
|
<div className="flex-1 overflow-auto">
|
|
<MailList
|
|
mails={mails}
|
|
onMailClick={handleMailClick}
|
|
/>
|
|
</div>
|
|
</div>
|
|
);
|
|
}
|