Extract DurationSelector to its own component

src/components/Schedule/DurationSelector.js

@@ -0,0 +1,31 @@
+import React, {useState} from 'react';
+import { InputGroup, Icon } from 'rsuite';
+import { durations } from '../../assets/data/durations';
+
+export default function DurationSelector() {
+	const [durationIdx, setDurationIdx] = useState(0);
+
+	const handleIncrement = () => {
+		if (durationIdx <= durations.length - 2) {
+			setDurationIdx(durationIdx + 1);
+		}
+	};
+	const handleDecrement = () => {
+		if (durationIdx > 0) {
+			setDurationIdx(durationIdx - 1);
+		}
+	};
+	return (
+		<InputGroup style={{ background: 'white' }}>
+			<InputGroup.Button onClick={handleDecrement}>
+				<Icon icon='minus' />
+			</InputGroup.Button>
+			<div style={{ textAlign: 'center', paddingTop: 5 }}>
+				{durations[durationIdx].label}
+			</div>
+			<InputGroup.Button onClick={handleIncrement}>
+				<Icon icon='plus' />
+			</InputGroup.Button>
+		</InputGroup>
+	);
+}