diff options
author | Michael Foiani <sotech117@michaels-mbp-3.lan> | 2021-04-16 12:43:17 -0400 |
---|---|---|
committer | Michael Foiani <sotech117@michaels-mbp-3.lan> | 2021-04-16 12:43:17 -0400 |
commit | 8e7c77b5bff25762dbd874ac6999ad7f493ba41d (patch) | |
tree | 3678a0153d87db804798d979064dbc5ad72950ef /frontend/src/DateInput.js | |
parent | 250f5edc1ed502c74c398b5850a0bb7a7b01848c (diff) |
Have a little bug with backend. Going to skip over it for now.
Diffstat (limited to 'frontend/src/DateInput.js')
-rw-r--r-- | frontend/src/DateInput.js | 35 |
1 files changed, 35 insertions, 0 deletions
diff --git a/frontend/src/DateInput.js b/frontend/src/DateInput.js new file mode 100644 index 0000000..b5962f0 --- /dev/null +++ b/frontend/src/DateInput.js @@ -0,0 +1,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;
\ No newline at end of file |