-
Notifications
You must be signed in to change notification settings - Fork 1
/
TodayMarker.js
59 lines (49 loc) · 1.45 KB
/
TodayMarker.js
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
import React from 'react'
import PropTypes from 'prop-types'
import {
createMarkerStylesWithLeftOffset,
createDefaultRenderer
} from './shared'
const defaultRenderer = createDefaultRenderer('default-today-line')
/** Marker that is placed based on current date. This component updates itself on
* a set interval, dictated by the 'interval' prop.
*/
class TodayMarker extends React.Component {
static propTypes = {
getLeftOffsetFromDate: PropTypes.func.isRequired,
renderer: PropTypes.func,
interval: PropTypes.number.isRequired
}
static defaultProps = {
renderer: defaultRenderer
}
state = {
date: Date.now()
}
componentDidMount() {
this.intervalToken = this.createIntervalUpdater(this.props.interval)
}
componentDidUpdate(prevProps) {
if (prevProps.interval !== this.props.interval) {
clearInterval(this.intervalToken)
this.intervalToken = this.createIntervalUpdater(this.props.interval)
}
}
createIntervalUpdater(interval) {
return setInterval(() => {
this.setState({
date: Date.now() // FIXME: use date utils pass in as props
});
}, interval);
}
componentWillUnmount() {
clearInterval(this.intervalToken)
}
render() {
const { date } = this.state
const leftOffset = this.props.getLeftOffsetFromDate(date)
const styles = createMarkerStylesWithLeftOffset(leftOffset)
return this.props.renderer({ styles, date })
}
}
export default TodayMarker