From 69ffcfb992534fb9af6c45ee50af88aff7ab3805 Mon Sep 17 00:00:00 2001 From: Michael Zhao Date: Sat, 10 Feb 2024 14:42:58 -0500 Subject: [PATCH] added code from master of event sort for multi day (#2502) --- package.json | 2 +- src/Month.js | 6 +++--- src/localizer.js | 13 ++++++++---- src/localizers/luxon.js | 13 +++++++++--- src/localizers/moment.js | 14 ++++++++++--- src/utils/eventLevels.js | 44 ++++++++++++++++++++++++++++++++++++++++ 6 files changed, 78 insertions(+), 14 deletions(-) diff --git a/package.json b/package.json index ec03bb6c7..fd4004f5a 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "rbc-fork-react-big-calendar", - "version": "0.33.12", + "version": "0.33.16", "description": "Calendar! with events", "author": { "name": "Jason Quense", diff --git a/src/Month.js b/src/Month.js index 78d75d551..0e19edf13 100644 --- a/src/Month.js +++ b/src/Month.js @@ -15,7 +15,7 @@ import Overlay from 'react-overlays/Overlay' import DateContentRow from './DateContentRow' import Header from './Header' import DateHeader from './DateHeader' -import { inRange, sortEvents } from './utils/eventLevels' +import { inRange, sortWeekEvents } from './utils/eventLevels' let eventsForWeek = (evts, start, end, accessors, localizer) => evts.filter(e => inRange(e, start, end, accessors, localizer)) @@ -130,7 +130,7 @@ class MonthView extends React.Component { localizer ) - weeksEvents.sort((a, b) => sortEvents(a, b, accessors, localizer)) + const sorted = sortWeekEvents(weeksEvents, accessors, localizer) return ( value.getTimezoneOffset()) + spec.getTimezoneOffset || ((value) => value.getTimezoneOffset()) this.getDstOffset = spec.getDstOffset || getDstOffset this.getTotalMin = spec.getTotalMin || getTotalMin this.getMinutesFromMidnight = diff --git a/src/localizers/luxon.js b/src/localizers/luxon.js index d3a2d3d80..48cd2ecf5 100644 --- a/src/localizers/luxon.js +++ b/src/localizers/luxon.js @@ -310,6 +310,12 @@ export default function(DateTime, { firstDayOfWeek = 7 } = {}) { return gte(end, last) } + function daySpan(start, end) { + const dtStart = DateTime.fromJSDate(start) + const dtEnd = DateTime.fromJSDate(end) + return dtEnd.diff(dtStart).as('days') + } + // These two are used by eventLevels function sortEvents({ evtA: { start: aStart, end: aEnd, allDay: aAllDay }, @@ -317,13 +323,13 @@ export default function(DateTime, { firstDayOfWeek = 7 } = {}) { }) { const startSort = +startOf(aStart, 'day') - +startOf(bStart, 'day') - const durA = diff(aStart, ceil(aEnd, 'day'), 'day') + const durA = daySpan(aStart, aEnd) - const durB = diff(bStart, ceil(bEnd, 'day'), 'day') + const durB = daySpan(bStart, bEnd) return ( startSort || // sort by start Day first - Math.max(durB, 1) - Math.max(durA, 1) || // events spanning multiple days go first + durB - durA || // events spanning multiple days go first !!bAllDay - !!aAllDay || // then allDay single day events +aStart - +bStart || // then sort by start time *don't need moment conversion here +aEnd - +bEnd // then sort by end time *don't need moment conversion here either @@ -415,6 +421,7 @@ export default function(DateTime, { firstDayOfWeek = 7 } = {}) { sortEvents, inEventRange, isSameDate, + daySpan, browserTZOffset, }) } diff --git a/src/localizers/moment.js b/src/localizers/moment.js index 46b00962b..3acf5a911 100644 --- a/src/localizers/moment.js +++ b/src/localizers/moment.js @@ -289,6 +289,13 @@ export default function(moment) { return mEnd.isSameOrAfter(mLast, 'minutes') } + function daySpan(start, end) { + const mStart = moment(start) + const mEnd = moment(end) + const dur = moment.duration(mEnd.diff(mStart)) + return dur.days() + } + // These two are used by eventLevels function sortEvents({ evtA: { start: aStart, end: aEnd, allDay: aAllDay }, @@ -296,13 +303,13 @@ export default function(moment) { }) { const startSort = +startOf(aStart, 'day') - +startOf(bStart, 'day') - const durA = diff(aStart, ceil(aEnd, 'day'), 'day') + const durA = daySpan(aStart, aEnd) - const durB = diff(bStart, ceil(bEnd, 'day'), 'day') + const durB = daySpan(bStart, bEnd) return ( startSort || // sort by start Day first - Math.max(durB, 1) - Math.max(durA, 1) || // events spanning multiple days go first + durB - durA || // events spanning multiple days go first !!bAllDay - !!aAllDay || // then allDay single day events +aStart - +bStart || // then sort by start time *don't need moment conversion here +aEnd - +bEnd // then sort by end time *don't need moment conversion here either @@ -398,6 +405,7 @@ export default function(moment) { sortEvents, inEventRange, isSameDate, + daySpan, browserTZOffset, }) } diff --git a/src/utils/eventLevels.js b/src/utils/eventLevels.js index efb86a3e2..fa7ddc9a9 100644 --- a/src/utils/eventLevels.js +++ b/src/utils/eventLevels.js @@ -76,6 +76,50 @@ export function segsOverlap(seg, otherSegs) { ) } +export function sortWeekEvents(events, accessors, localizer) { + const base = [...events] + const multiDayEvents = [] + const standardEvents = [] + base.forEach((event) => { + const startCheck = accessors.start(event) + const endCheck = accessors.end(event) + if (localizer.daySpan(startCheck, endCheck) > 1) { + multiDayEvents.push(event) + } else { + standardEvents.push(event) + } + }) + const multiSorted = multiDayEvents.sort((a, b) => + sortEvents(a, b, accessors, localizer) + ) + const standardSorted = standardEvents.sort((a, b) => + sortEvents(a, b, accessors, localizer) + ) + return [...multiSorted, ...standardSorted] +} + +export function sortWeekEvents(events, accessors, localizer) { + const base = [...events] + const multiDayEvents = [] + const standardEvents = [] + base.forEach((event) => { + const startCheck = accessors.start(event) + const endCheck = accessors.end(event) + if (localizer.daySpan(startCheck, endCheck) > 1) { + multiDayEvents.push(event) + } else { + standardEvents.push(event) + } + }) + const multiSorted = multiDayEvents.sort((a, b) => + sortEvents(a, b, accessors, localizer) + ) + const standardSorted = standardEvents.sort((a, b) => + sortEvents(a, b, accessors, localizer) + ) + return [...multiSorted, ...standardSorted] +} + export function sortEvents(eventA, eventB, accessors, localizer) { const evtA = { start: accessors.start(eventA),