carnet panel dairy health
This commit is contained in:
parent
dea5ae1ff8
commit
26fe0433e7
@ -2,7 +2,7 @@
|
||||
|
||||
import React, { useState, useEffect } from 'react';
|
||||
import { Search, Plus, X, FileText, Calendar, Heart, Users } from 'lucide-react';
|
||||
import { format } from 'date-fns';
|
||||
import { format, parse } from 'date-fns';
|
||||
import { fr } from 'date-fns/locale';
|
||||
|
||||
interface Note {
|
||||
@ -61,7 +61,7 @@ export const NotesView: React.FC<NotesViewProps> = ({ onNoteSelect, currentFolde
|
||||
};
|
||||
|
||||
const formatDate = (dateString: string) => {
|
||||
return format(new Date(dateString), 'EEEE d MMM yyyy, HH:mm', { locale: fr });
|
||||
return format(new Date(dateString), 'EEEE d MMM yyyy', { locale: fr });
|
||||
};
|
||||
|
||||
const getFolderIcon = (folder: string) => {
|
||||
@ -79,6 +79,34 @@ export const NotesView: React.FC<NotesViewProps> = ({ onNoteSelect, currentFolde
|
||||
}
|
||||
};
|
||||
|
||||
const formatNoteTitle = (note: Note) => {
|
||||
if (currentFolder === 'Diary' || currentFolder === 'Health') {
|
||||
// Try to extract date from title (format: YYYY-MM-DD)
|
||||
const dateMatch = note.title.match(/^(\d{4}-\d{2}-\d{2})/);
|
||||
if (dateMatch) {
|
||||
const date = parse(dateMatch[1], 'yyyy-MM-dd', new Date());
|
||||
return `${format(date, 'EEEE d MMM yyyy', { locale: fr })} - ${note.title.replace(dateMatch[1], '').trim()}`;
|
||||
}
|
||||
}
|
||||
return note.title;
|
||||
};
|
||||
|
||||
const sortNotes = (notes: Note[]) => {
|
||||
if (currentFolder === 'Diary' || currentFolder === 'Health') {
|
||||
return [...notes].sort((a, b) => {
|
||||
// Try to extract dates from titles
|
||||
const dateA = a.title.match(/^(\d{4}-\d{2}-\d{2})/);
|
||||
const dateB = b.title.match(/^(\d{4}-\d{2}-\d{2})/);
|
||||
|
||||
if (dateA && dateB) {
|
||||
return new Date(dateB[1]).getTime() - new Date(dateA[1]).getTime();
|
||||
}
|
||||
return 0;
|
||||
});
|
||||
}
|
||||
return notes;
|
||||
};
|
||||
|
||||
const Icon = getFolderIcon(currentFolder);
|
||||
|
||||
return (
|
||||
@ -122,34 +150,31 @@ export const NotesView: React.FC<NotesViewProps> = ({ onNoteSelect, currentFolde
|
||||
{/* Notes List */}
|
||||
<div className="flex-1 overflow-y-auto">
|
||||
{loading ? (
|
||||
<div className="flex items-center justify-center h-full">
|
||||
<div className="animate-spin rounded-full h-8 w-8 border-t-2 border-b-2 border-primary"></div>
|
||||
</div>
|
||||
<div className="p-4 text-center text-carnet-text-muted">Chargement...</div>
|
||||
) : notes.length === 0 ? (
|
||||
<div className="flex items-center justify-center h-full">
|
||||
<p className="text-sm text-carnet-text-muted">Aucune note trouvée</p>
|
||||
</div>
|
||||
<div className="p-4 text-center text-carnet-text-muted">Aucune note</div>
|
||||
) : (
|
||||
notes.map((note) => (
|
||||
<div
|
||||
key={note.id}
|
||||
className="px-4 py-3 border-b border-carnet-border hover:bg-carnet-hover cursor-pointer"
|
||||
onClick={() => onNoteSelect?.(note)}
|
||||
>
|
||||
<div className="flex flex-col">
|
||||
<div className="flex items-center">
|
||||
<span className="text-sm font-medium text-carnet-text-primary">
|
||||
{note.title}
|
||||
</span>
|
||||
<ul className="divide-y divide-carnet-border">
|
||||
{sortNotes(notes).map((note) => (
|
||||
<li
|
||||
key={note.id}
|
||||
onClick={() => onNoteSelect?.(note)}
|
||||
className="p-4 hover:bg-carnet-hover cursor-pointer"
|
||||
>
|
||||
<div className="flex items-center space-x-2">
|
||||
<Icon className="h-4 w-4 text-carnet-text-muted" />
|
||||
<div className="flex-1">
|
||||
<div className="text-sm font-medium text-carnet-text-primary">
|
||||
{formatNoteTitle(note)}
|
||||
</div>
|
||||
<div className="text-xs text-carnet-text-muted">
|
||||
{formatDate(note.lastModified)}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div className="mt-1 flex items-center text-xs text-carnet-text-muted">
|
||||
<span>{formatDate(note.lastModified)}</span>
|
||||
<span className="mx-1.5">•</span>
|
||||
<span>{note.size} bytes</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
))
|
||||
</li>
|
||||
))}
|
||||
</ul>
|
||||
)}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
Loading…
Reference in New Issue
Block a user