diff --git a/frontend/src/components/EntryList.tsx b/frontend/src/components/EntryList.tsx index 62d6664..be5d527 100644 --- a/frontend/src/components/EntryList.tsx +++ b/frontend/src/components/EntryList.tsx @@ -1,12 +1,17 @@ +import { useState } from 'react'; import type { Event } from '../lib/api'; interface Props { events: Event[]; onDelete: (id: string) => void; + onEdit: (id: string, content: string) => Promise; readOnly?: boolean; } -export default function EntryList({ events, onDelete, readOnly }: Props) { +export default function EntryList({ events, onDelete, onEdit, readOnly }: Props) { + const [editingId, setEditingId] = useState(null); + const [editContent, setEditContent] = useState(''); + const formatTime = (dateStr: string) => { return new Date(dateStr).toLocaleTimeString('en-US', { hour: 'numeric', minute: '2-digit' }); }; @@ -20,9 +25,26 @@ export default function EntryList({ events, onDelete, readOnly }: Props) { } }; + const startEdit = (event: Event) => { + setEditingId(event.id); + setEditContent(event.content); + }; + + const cancelEdit = () => { + setEditingId(null); + setEditContent(''); + }; + + const saveEdit = async () => { + if (editingId && editContent.trim()) { + await onEdit(editingId, editContent.trim()); + setEditingId(null); + setEditContent(''); + } + }; + return (
- {events.map((event) => (
{formatTime(event.createdAt)} {event.type}
-

{event.content}

- {event.mediaPath && ( + {editingId === event.id ? ( +
+