alma/NeahStable
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

widget courrier refactor

Browse Source
This commit is contained in:
alma 2026-01-15 23:39:06 +01:00
parent 60eb2efb20
commit 28a2866e13
1 changed files with 27 additions and 19 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

30
components/email.tsx
View File

@ -34,7 +34,7 @@ export function Email() {
const [refreshing, setRefreshing] = useState(false); const [refreshing, setRefreshing] = useState(false);
const [error, setError] = useState<string | null>(null); const [error, setError] = useState<string | null>(null);
const [mailUrl, setMailUrl] = useState<string | null>(null); const [mailUrl, setMailUrl] = useState<string | null>(null);
const [accounts, setAccounts] = useState<Array<{ id: string; email: string }>>([]); const [accounts, setAccounts] = useState<Array<{ id: string; email: string; color?: string }>>([]);
const [unreadCount, setUnreadCount] = useState<number>(0); const [unreadCount, setUnreadCount] = useState<number>(0);
const [accountErrors, setAccountErrors] = useState<Record<string, string>>({}); const [accountErrors, setAccountErrors] = useState<Record<string, string>>({});
@ -59,7 +59,8 @@ export function Email() {
if (data.accounts) { if (data.accounts) {
setAccounts(data.accounts.map((acc: any) => ({ setAccounts(data.accounts.map((acc: any) => ({
id: acc.id || acc.email, id: acc.id || acc.email,
email: acc.email email: acc.email,
color: acc.color || '#0082c9' // Default color if not set
}))); })));
} }
} }
@ -128,7 +129,7 @@ export function Email() {
})) }))
// Sort emails by date (most recent first) // Sort emails by date (most recent first)
.sort((a: Email, b: Email) => new Date(b.date).getTime() - new Date(a.date).getTime()) .sort((a: Email, b: Email) => new Date(b.date).getTime() - new Date(a.date).getTime())
.slice(0, 5); // Only show the first 5 emails .slice(0, 33); // Show up to 33 emails
setEmails(transformedEmails); setEmails(transformedEmails);
setMailUrl('/courrier'); setMailUrl('/courrier');
@ -249,14 +250,20 @@ export function Email() {
<p className="text-gray-500">Aucun email</p> <p className="text-gray-500">Aucun email</p>
</div> </div>
) : ( ) : (
<div className="space-y-3"> <div className="space-y-3 max-h-[500px] overflow-y-auto pr-1 scrollbar-thin scrollbar-thumb-gray-200 scrollbar-track-transparent">
{emails.map((email) => ( {emails.map((email) => {
// Find the account color for this email
const account = accounts.find(acc => acc.id === (email as any).accountId);
const accountColor = account?.color || '#0082c9';
return (
<div key={email.id} className="flex items-start gap-3 py-1 border-b border-gray-100 last:border-0"> <div key={email.id} className="flex items-start gap-3 py-1 border-b border-gray-100 last:border-0">
<div className="pt-1"> <div className="pt-1 flex-shrink-0">
{email.read ? <div
<MailOpen className="h-4 w-4 text-gray-400" /> : className="w-3 h-3 rounded-full"
<Mail className="h-4 w-4 text-blue-500" /> style={{ backgroundColor: accountColor }}
} title={account?.email || 'Unknown account'}
/>
</div> </div>
<div className="flex-1 min-w-0"> <div className="flex-1 min-w-0">
<div className="flex justify-between"> <div className="flex justify-between">
@ -266,7 +273,8 @@ export function Email() {
<p className="text-sm text-gray-700 truncate">{email.subject}</p> <p className="text-sm text-gray-700 truncate">{email.subject}</p>
</div> </div>
</div> </div>
))} );
})}
{mailUrl && ( {mailUrl && (
<div className="pt-2"> <div className="pt-2">