diff --git a/src/views/History/ChoreHistory.jsx b/src/views/History/ChoreHistory.jsx index 458b1f1..b2a213b 100644 --- a/src/views/History/ChoreHistory.jsx +++ b/src/views/History/ChoreHistory.jsx @@ -480,6 +480,11 @@ const ChoreHistory = () => { entry: historyEntry, performers, onClose: () => setDetailModalConfig({ isOpen: false }), + onEdit: record => { + setDetailModalConfig({ isOpen: false }) + setEditHistory(record) + setIsEditModalOpen(true) + }, }) }} onViewNote={notes => { diff --git a/src/views/Modals/HistoryDetailModal.jsx b/src/views/Modals/HistoryDetailModal.jsx index 2173484..e105549 100644 --- a/src/views/Modals/HistoryDetailModal.jsx +++ b/src/views/Modals/HistoryDetailModal.jsx @@ -2,7 +2,9 @@ import { AccessTime, CalendarMonth, Check, + Edit, HourglassEmpty, + OpenInNew, Person, Redo, RunningWithErrors, @@ -10,8 +12,9 @@ import { ThumbDown, Update, } from '@mui/icons-material' -import { Avatar, Box, Chip, Divider, Stack, Typography } from '@mui/joy' +import { Avatar, Box, Button, Chip, Divider, Stack, Typography } from '@mui/joy' import moment from 'moment' +import { useNavigate } from 'react-router-dom' import { useLocalization } from '../../contexts/LocalizationContext' import { useResponsiveModal } from '../../hooks/useResponsiveModal' import { TASK_COLOR } from '../../utils/Colors.jsx' @@ -64,6 +67,7 @@ const TimingBadge = ({ historyEntry }) => { function HistoryDetailModal({ config }) { const { ResponsiveModal } = useResponsiveModal() const { fmt } = useLocalization() + const navigate = useNavigate() const entry = config?.entry const performers = config?.performers ?? [] @@ -190,6 +194,35 @@ function HistoryDetailModal({ config }) { )} + + {/* Action buttons */} + + {entry.choreId && ( + + )} + {config?.onEdit && ( + + )} + ) } diff --git a/src/views/User/UserActivities.jsx b/src/views/User/UserActivities.jsx index c1b2692..663aed8 100644 --- a/src/views/User/UserActivities.jsx +++ b/src/views/User/UserActivities.jsx @@ -7,7 +7,6 @@ import { Checklist, EventBusy, EventNote, - Group, HourglassEmpty, Person, Redo, @@ -36,7 +35,13 @@ import FilterBar from '../../components/common/FilterBar' import { useFilter } from '../../hooks/useFilter' import { useLocalization } from '../../contexts/LocalizationContext' -import { useChores, useChoresHistory } from '../../queries/ChoreQueries' +import { + useChores, + useChoresHistory, + useDeleteChoreHistory, + useUpdateChoreHistory, +} from '../../queries/ChoreQueries' +import EditHistoryModal from '../Modals/EditHistoryModal' import HistoryDetailModal from '../Modals/HistoryDetailModal' import NoteViewerModal from '../Modals/Inputs/NoteViewerModal' import { useCircleMembers, useUserProfile } from '../../queries/UserQueries.jsx' @@ -85,7 +90,7 @@ const ChoreHistoryItem = ({ - - - - Activities Timeline - - - + {Object.entries(groupedHistory).map(([date, items]) => ( @@ -199,7 +194,7 @@ const ChoreHistoryTimeline = ({ ))} - + ) } @@ -414,6 +409,10 @@ const UserActivites = () => { const [selectedChart, setSelectedChart] = React.useState('history') const [noteViewerConfig, setNoteViewerConfig] = useState({ isOpen: false }) const [detailModalConfig, setDetailModalConfig] = useState({ isOpen: false }) + const [editModalConfig, setEditModalConfig] = useState({ isOpen: false }) + const [editHistoryRecord, setEditHistoryRecord] = useState(null) + const updateChoreHistory = useUpdateChoreHistory() + const deleteChoreHistory = useDeleteChoreHistory() const [historyPieChartData, setHistoryPieChartData] = React.useState([]) const [choreDuePieChartData, setChoreDuePieChartData] = React.useState([]) @@ -973,12 +972,12 @@ const UserActivites = () => { }} > - + - User Activities + Activities @@ -1071,21 +1070,62 @@ const UserActivites = () => { entry, performers, onClose: () => setDetailModalConfig({ isOpen: false }), + onEdit: record => { + setDetailModalConfig(prev => ({ ...prev, isOpen: false })) + setEditHistoryRecord(record) + setEditModalConfig({ + isOpen: true, + onClose: () => { + setEditModalConfig({ isOpen: false }) + setEditHistoryRecord(null) + }, + onSave: updated => { + updateChoreHistory.mutate( + { + choreId: record.choreId, + historyId: record.id, + historyData: { + performedAt: updated.performedAt, + dueDate: updated.dueDate, + notes: updated.notes, + }, + }, + { + onSuccess: () => { + setEditModalConfig({ isOpen: false }) + setEditHistoryRecord(null) + }, + }, + ) + }, + onDelete: () => { + deleteChoreHistory.mutate( + { choreId: record.choreId, historyId: record.id }, + { + onSuccess: () => { + setEditModalConfig({ isOpen: false }) + setEditHistoryRecord(null) + }, + }, + ) + }, + }) + }, }) }} /> - {/* Right Sidebar - Charts (Mobile: Full width, Desktop: Fixed width + sticky) */} + {/* Right Sidebar - Charts (Desktop only, hidden on mobile) */} {/* Charts Container */} @@ -1225,6 +1265,10 @@ const UserActivites = () => { )} + ) }