From bf1baa09cbdd0a7640b70ccbe74c0759a9cee462 Mon Sep 17 00:00:00 2001
From: Andreas Ellewsen <ae@uio.no>
Date: Thu, 16 Sep 2021 14:54:54 +0200
Subject: [PATCH] Update dateinput component
- Language is no longer a prop
- Dateformat chagned to ISO 8601
- set minDate and maxDate range to between today and 1 year from now
---
frontend/src/components/dateinput/index.tsx | 12 ++++++++----
frontend/src/routes/frontpage/index.tsx | 2 +-
2 files changed, 9 insertions(+), 5 deletions(-)
diff --git a/frontend/src/components/dateinput/index.tsx b/frontend/src/components/dateinput/index.tsx
index bed55cd4..27617fae 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 8bd7a8db..b552134e 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'}
--
GitLab