diff --git a/frontend/src/components/dateinput/index.tsx b/frontend/src/components/dateinput/index.tsx index bed55cd458c4ee88c3e413d52a1942de9f1b4788..27617fae702e703ce498dbbbeee8f6c3101a57ae 100644 --- a/frontend/src/components/dateinput/index.tsx +++ b/frontend/src/components/dateinput/index.tsx @@ -1,24 +1,28 @@ import React, { useState } from "react" import DatePicker, { registerLocale } from "react-datepicker" import nb from 'date-fns/locale/nb' +import { addDays } from "date-fns"; +import { useTranslation } from 'react-i18next' import "react-datepicker/dist/react-datepicker.css" registerLocale("nb", nb) // CSS Modules, react-datepicker-cssmodules.css // import 'react-datepicker/dist/react-datepicker-cssmodules.css'; -interface DateInputProps { - lang: string +interface DateInputProps { } const DateInput = (props: DateInputProps) => { const [startDate, setStartDate] = useState(new Date()) + const { i18n } = useTranslation() return ( <DatePicker - dateFormat={props.lang === 'en' ? 'MM/dd/yyyy' : 'dd.MM.yyyy'} - locale={props.lang} + dateFormat='yyyy-MM-dd' + locale={i18n.language} selected={startDate} + minDate={startDate} + maxDate={addDays(new Date(), 365)} onChange={(date: any) => setStartDate(date)} /> ) diff --git a/frontend/src/routes/frontpage/index.tsx b/frontend/src/routes/frontpage/index.tsx index 8bd7a8dbf1c9928d5f5c5c20252de067649a74d8..b552134e5c0110fd15b4df455ddacd263c4f3090 100644 --- a/frontend/src/routes/frontpage/index.tsx +++ b/frontend/src/routes/frontpage/index.tsx @@ -28,7 +28,7 @@ export default function FrontPage() { } return ( <Page header="Greg main page"> - <DateInput lang={i18n.language} /> + <DateInput /> <br /> <button onClick={() => i18n.language === 'en' ? i18n.changeLanguage('nb') : i18n.changeLanguage('en')}> {i18n.language === 'en' ? 'Norwegian' : 'English'}