fixing calendar issues

This commit is contained in:
victorAnumudu
2024-12-18 17:41:10 +01:00
parent bd28971de0
commit 592229b172
2 changed files with 18 additions and 19 deletions
+10 -4
View File
@@ -8,11 +8,17 @@ export default function Calendar(){
const [draggedEvent, setDraggedEvent] = useState('undroppable')
const handleDragStart = useCallback((event) => setDraggedEvent(event), [])
// const dummyEvents = [
// {id: '1', title: 'Family Vacation', color: 'fc-event-primary', start: new Date('2024-12-18'), end: new Date('2024-12-18'), isAllDay: false, resource: ''},
// {id: '2', title: 'Meeting In Office', color: 'fc-event-warning', start: new Date('2024-12-19'), end: new Date('2024-12-19'), isAllDay: false, resource: ''},
// {id: '3', title: 'Client Call', color: 'fc-event-danger', start: new Date('2024-12-20'), end: new Date('2024-12-20'), isAllDay: false, resource: ''},
// {id: '4', title: 'Interview', color: 'fc-event-success', start: new Date('2024-12-21'), end: new Date('2024-12-21'), isAllDay: false, resource: ''}
// ]
const dummyEvents = [
{id: '1', title: 'Family Vacation', color: 'fc-event-primary', start: new Date('2024-12-18'), end: new Date('2024-12-18'), isAllDay: false, resource: ''},
{id: '2', title: 'Meeting In Office', color: 'fc-event-warning', start: new Date('2024-12-19'), end: new Date('2024-12-19'), isAllDay: false, resource: ''},
{id: '3', title: 'Client Call', color: 'fc-event-danger', start: new Date('2024-12-20'), end: new Date('2024-12-20'), isAllDay: false, resource: ''},
{id: '4', title: 'Interview', color: 'fc-event-success', start: new Date('2024-12-21'), end: new Date('2024-12-21'), isAllDay: false, resource: ''}
{id: '1', title: 'Family Vacation', color: 'fc-event-primary', isAllDay: false},
{id: '2', title: 'Meeting In Office', color: 'fc-event-warning', isAllDay: false},
{id: '3', title: 'Client Call', color: 'fc-event-danger', isAllDay: false},
{id: '4', title: 'Interview', color: 'fc-event-success', isAllDay: false}
]
return(
+8 -15
View File
@@ -11,20 +11,12 @@ const localizer = dayjsLocalizer(dayjs)
const DnDCalendar = withDragAndDrop(Calendar)
export default function EventCalendar({draggedEvent, setDraggedEvent}) {
const myEventsList = [
// {
// title: 'title',
// start: new Date('2024-12-18'),
// end: new Date('2024-12-18'),
// isAllDay: false,
// }
]
const myEventsList = []
const [myEvents, setMyEvents] = useState(myEventsList)
const moveEvent = useCallback(
({ event, start, end, isAllDay: droppedOnAllDaySlot = false }) => {
const { isAllDay } = event
// const { isAllDay } = event
// if (!allDay && droppedOnAllDaySlot) {
// event.allDay = true
// }
@@ -35,13 +27,12 @@ export default function EventCalendar({draggedEvent, setDraggedEvent}) {
setMyEvents((prev) => {
const existing = prev.find((ev) => ev.id === event.id) ?? {}
const filtered = prev.filter((ev) => ev.id !== event.id)
return [...filtered, { ...existing, start, end, allDay: event.allDay }]
// return [...prev, { ...event, start, end, allDay: event.allDay }]
// return [...filtered, { ...existing, start, end, allDay: event.allDay }]
return [...prev]
})
},
[setMyEvents]
)
const [displayDragItemInCell, setDisplayDragItemInCell] = useState(true)
@@ -77,7 +68,8 @@ export default function EventCalendar({draggedEvent, setDraggedEvent}) {
setMyEvents((prev) => {
const idList = prev.map((item) => item.id)
const newId = Math.max(...idList) + 1
return [...prev, { ...event, id: newId }]
// return [...prev, { ...event, id: newId }]
return [...prev, { ...event}]
})
},
[setMyEvents]
@@ -90,12 +82,13 @@ export default function EventCalendar({draggedEvent, setDraggedEvent}) {
return
}
const { title } = draggedEvent
const { title, id } = draggedEvent
const event = {
title: title,
start,
end,
isAllDay,
id
}
setDraggedEvent(null)
newEvent(event)