blob: b5962f0feaf1ef760170d61c129296d6ba92545c (
plain)
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
|
// React import
import { useEffect, useState, useRef } from "react";
/**
* Componenet for checkins. Has a toggle to show more info.
* @param {Object} props The props of the component.
* @returns {import('react').HtmlHTMLAttributes} A list element holding a checkin's info.
*/
function DateInput(props) {
const startInput = useRef();
const endInput = useRef();
const toValue = date => date.toISOString().slice(0, 10);
useEffect(() => setInitDates(), []);
const setInitDates = () => {
startInput.current.value = toValue(new Date());
// Two weeks away -> from stack overflow,
const fortnightAway = toValue(new Date(Date.now() - 12096e5));
endInput.current.value = fortnightAway;
}
return (
<>
<label for="start">Start date:</label>
<input type="date" id="start" ref={startInput} onChange={(e) => props.setStart(e.target.value)}/>
<label for="end">End date:</label>
<input type="date" id="end" ref={endInput} onChange={(e) => props.setEnd(e.target.value)}/>
</>
);
}
export default DateInput;
|