From 4f4e58c569d7cbd17d43a3767fe870ef319ab822 Mon Sep 17 00:00:00 2001 From: Stan Kolkovsky Date: Thu, 7 Sep 2023 15:39:41 +0500 Subject: [PATCH 1/4] fix(component): fixing unsafe_method in daycolumn.js --- src/DayColumn.js | 25 +++++++++++++++++-------- 1 file changed, 17 insertions(+), 8 deletions(-) diff --git a/src/DayColumn.js b/src/DayColumn.js index 173662037f..b364e3db75 100644 --- a/src/DayColumn.js +++ b/src/DayColumn.js @@ -18,6 +18,23 @@ class DayColumn extends React.Component { state = { selecting: false, timeIndicatorPosition: null } intervalTriggered = false + static getDerivedStateFromProps(nextProps, prevState) { + if (nextProps.selectable && !prevState?.selectable) { + this._selectable() + } + + if (!nextProps.selectable && prevState?.selectable) { + this._teardownSelectable() + } + + const updatedSlotMetrics = prevState?.slotMetrics?.update(nextProps) + + return { + selectable: nextProps.selectable, + slotMetrics: updatedSlotMetrics, + } + } + constructor(...args) { super(...args) @@ -38,14 +55,6 @@ class DayColumn extends React.Component { this.clearTimeIndicatorInterval() } - UNSAFE_componentWillReceiveProps(nextProps) { - if (nextProps.selectable && !this.props.selectable) this._selectable() - if (!nextProps.selectable && this.props.selectable) - this._teardownSelectable() - - this.slotMetrics = this.slotMetrics.update(nextProps) - } - componentDidUpdate(prevProps, prevState) { const { getNow, isNow, localizer, date, min, max } = this.props const getNowChanged = localizer.neq(prevProps.getNow(), getNow(), 'minutes') From b27fee5eb22a82f4e31f273487c80317ca6dbf26 Mon Sep 17 00:00:00 2001 From: Stanislau Date: Mon, 9 Oct 2023 16:08:56 +0500 Subject: [PATCH 2/4] fix(component): fixing component for no_overlapping events --- src/DayColumn.js | 34 ++++++++++++++++++++-------------- src/utils/TimeSlots.js | 5 +++-- 2 files changed, 23 insertions(+), 16 deletions(-) diff --git a/src/DayColumn.js b/src/DayColumn.js index b364e3db75..437b00f4e2 100644 --- a/src/DayColumn.js +++ b/src/DayColumn.js @@ -20,7 +20,9 @@ class DayColumn extends React.Component { static getDerivedStateFromProps(nextProps, prevState) { if (nextProps.selectable && !prevState?.selectable) { - this._selectable() + if (this && this._selectable) { + this._selectable() + } } if (!nextProps.selectable && prevState?.selectable) { @@ -45,9 +47,7 @@ class DayColumn extends React.Component { componentDidMount() { this.props.selectable && this._selectable() - if (this.props.isNow) { - this.setTimeIndicatorPositionUpdateInterval() - } + this.setTimeIndicatorPositionUpdateInterval() } componentWillUnmount() { @@ -101,16 +101,21 @@ class DayColumn extends React.Component { } positionTimeIndicator() { - const { min, max, getNow } = this.props + const { getNow } = this.props const current = getNow() - if (current >= min && current <= max) { - const top = this.slotMetrics.getCurrentTimePosition(current) - this.intervalTriggered = true - this.setState({ timeIndicatorPosition: top }) - } else { - this.clearTimeIndicatorInterval() - } + // ? Custom improvement + const top = this.slotMetrics.getCurrentTimePosition(current) + this.intervalTriggered = true + this.setState({ timeIndicatorPosition: top }) + // ! Original code. Please don't remove + // if (current >= min && current <= max) { + // const top = this.slotMetrics.getCurrentTimePosition(current) + // this.intervalTriggered = true + // this.setState({ timeIndicatorPosition: top }) + // } else { + // this.clearTimeIndicatorInterval() + // } } render() { @@ -182,12 +187,13 @@ class DayColumn extends React.Component { {localizer.format(selectDates, 'selectRangeFormat')} )} - {isNow && this.intervalTriggered && ( + {/* // ! Modified code */} + {
- )} + } ) } diff --git a/src/utils/TimeSlots.js b/src/utils/TimeSlots.js index b49bc2b9c1..c56d93f4e1 100644 --- a/src/utils/TimeSlots.js +++ b/src/utils/TimeSlots.js @@ -44,9 +44,10 @@ export function getSlotMetrics({ ) function positionFromDate(date) { + const startOfDay = localizer.startOf(date, 'day') const diff = - localizer.diff(start, date, 'minutes') + - localizer.getDstOffset(start, date) + localizer.diff(startOfDay, date, 'minutes') + + localizer.getDstOffset(startOfDay, date) return Math.min(diff, totalMin) } From 54dd28c968b8e7a1823af3579a72eee1dd946b24 Mon Sep 17 00:00:00 2001 From: Stanislau Date: Mon, 9 Oct 2023 16:25:05 +0500 Subject: [PATCH 3/4] Revert "fix(component): fixing component for no_overlapping events" This reverts commit b27fee5eb22a82f4e31f273487c80317ca6dbf26. --- src/DayColumn.js | 34 ++++++++++++++-------------------- src/utils/TimeSlots.js | 5 ++--- 2 files changed, 16 insertions(+), 23 deletions(-) diff --git a/src/DayColumn.js b/src/DayColumn.js index 437b00f4e2..b364e3db75 100644 --- a/src/DayColumn.js +++ b/src/DayColumn.js @@ -20,9 +20,7 @@ class DayColumn extends React.Component { static getDerivedStateFromProps(nextProps, prevState) { if (nextProps.selectable && !prevState?.selectable) { - if (this && this._selectable) { - this._selectable() - } + this._selectable() } if (!nextProps.selectable && prevState?.selectable) { @@ -47,7 +45,9 @@ class DayColumn extends React.Component { componentDidMount() { this.props.selectable && this._selectable() - this.setTimeIndicatorPositionUpdateInterval() + if (this.props.isNow) { + this.setTimeIndicatorPositionUpdateInterval() + } } componentWillUnmount() { @@ -101,21 +101,16 @@ class DayColumn extends React.Component { } positionTimeIndicator() { - const { getNow } = this.props + const { min, max, getNow } = this.props const current = getNow() - // ? Custom improvement - const top = this.slotMetrics.getCurrentTimePosition(current) - this.intervalTriggered = true - this.setState({ timeIndicatorPosition: top }) - // ! Original code. Please don't remove - // if (current >= min && current <= max) { - // const top = this.slotMetrics.getCurrentTimePosition(current) - // this.intervalTriggered = true - // this.setState({ timeIndicatorPosition: top }) - // } else { - // this.clearTimeIndicatorInterval() - // } + if (current >= min && current <= max) { + const top = this.slotMetrics.getCurrentTimePosition(current) + this.intervalTriggered = true + this.setState({ timeIndicatorPosition: top }) + } else { + this.clearTimeIndicatorInterval() + } } render() { @@ -187,13 +182,12 @@ class DayColumn extends React.Component { {localizer.format(selectDates, 'selectRangeFormat')}
)} - {/* // ! Modified code */} - { + {isNow && this.intervalTriggered && (
- } + )} ) } diff --git a/src/utils/TimeSlots.js b/src/utils/TimeSlots.js index c56d93f4e1..b49bc2b9c1 100644 --- a/src/utils/TimeSlots.js +++ b/src/utils/TimeSlots.js @@ -44,10 +44,9 @@ export function getSlotMetrics({ ) function positionFromDate(date) { - const startOfDay = localizer.startOf(date, 'day') const diff = - localizer.diff(startOfDay, date, 'minutes') + - localizer.getDstOffset(startOfDay, date) + localizer.diff(start, date, 'minutes') + + localizer.getDstOffset(start, date) return Math.min(diff, totalMin) } From a072594f2030784811e8f7e2ed678ff336014768 Mon Sep 17 00:00:00 2001 From: Stanislau Date: Mon, 9 Oct 2023 16:57:37 +0500 Subject: [PATCH 4/4] fix(component): fix no-overlap event --- src/DayColumn.js | 4 +++- 1 file changed, 3 insertions(+), 1 deletion(-) diff --git a/src/DayColumn.js b/src/DayColumn.js index b364e3db75..a2e396352d 100644 --- a/src/DayColumn.js +++ b/src/DayColumn.js @@ -20,7 +20,9 @@ class DayColumn extends React.Component { static getDerivedStateFromProps(nextProps, prevState) { if (nextProps.selectable && !prevState?.selectable) { - this._selectable() + if (this && this._selectable) { + this._selectable() + } } if (!nextProps.selectable && prevState?.selectable) {