Fix area search creation date limitations

- Disable past dates - Allow selecting the same date for both start and end - Allow omitting the end date
City-of-Helsinki · Oct 13, 2023 · d076641 · d076641
1 parent c4e7bb4
commit d076641
Show file tree

Hide file tree

Showing 4 changed files with 23 additions and 3 deletions.
diff --git a/src/areaSearch/components/AreaSearchApplicationCreatePage.js b/src/areaSearch/components/AreaSearchApplicationCreatePage.js
@@ -193,6 +193,7 @@ class AreaSearchApplicationCreatePage extends Component<Props, State> {
       createAreaSearchSpecs({
         area_search_attachments: attachments.map((attachment) => attachment.id),
         ...specsFormValues,
+        end_date: specsFormValues.end_date || null,
       });
     }
   };

diff --git a/src/areaSearch/components/AreaSearchApplicationCreateSpecs.js b/src/areaSearch/components/AreaSearchApplicationCreateSpecs.js
@@ -25,6 +25,7 @@ import AddFileButton from '$components/form/AddFileButton';
 import RemoveButton from '$components/form/RemoveButton';
 import type {UploadedFileMeta} from '$src/application/types';
 import {nonEmptyGeometry} from '$src/areaSearch/validators';
+import {startOfToday} from 'date-fns';
 
 type OwnProps = {
   onFileAdded: Function,
@@ -95,6 +96,7 @@ class AreaSearchApplicationCreateSpecs extends Component<Props> {
     }
 
     const geometryHasError = geometryError && (isSaveClicked || formMeta.geometry?.touched);
+    const today = startOfToday();
 
     return (
       <div className="AreaSearchApplicationCreate">
@@ -128,6 +130,7 @@ class AreaSearchApplicationCreateSpecs extends Component<Props> {
                   label: 'Vuokra-ajan alkupvm',
                   read_only: false,
                 }}
+                minDate={today}
               />
             </Column>
           </Authorization>
@@ -139,11 +142,11 @@ class AreaSearchApplicationCreateSpecs extends Component<Props> {
                 fieldAttributes={get(attributes, 'end_date')}
                 name='end_date'
                 overrideValues={{
-                  required: true,
                   fieldType: FieldTypes.DATE,
                   label: 'Vuokra-ajan loppupvm',
                   read_only: false,
                 }}
+                minDate={today}
               />
             </Column>
           </Authorization>
@@ -252,7 +255,7 @@ export default (flowRight(
     validate: (values) => {
       const errors = {};
 
-      if (values.start_date && values.end_date && values.start_date >= values.end_date) {
+      if (values.start_date && values.end_date && values.start_date > values.end_date) {
         errors.start_date = 'Alkupäivämäärän on oltava ennen loppupäivämäärää';
         errors.end_date = 'Loppupäivämäärän on oltava ennen alkupäivämäärää';
       }

diff --git a/src/components/form/FieldTypeDatePicker.js b/src/components/form/FieldTypeDatePicker.js
@@ -14,6 +14,8 @@ type Props = {
   displayError: boolean,
   input: Object,
   isDirty: boolean,
+  minDate?: Date,
+  maxDate?: Date,
   placeholder?: string,
   setRefForField?: Function,
 }
@@ -23,6 +25,8 @@ const FieldTypeDatePicker = ({
   displayError = false,
   input: {name, onChange, value},
   isDirty = false,
+  minDate,
+  maxDate,
   placeholder,
   setRefForField,
 }: Props): React$Node => {
@@ -77,6 +81,8 @@ const FieldTypeDatePicker = ({
         onChangeRaw={handleChange}
         onSelect={handleSelect}
         placeholderText={placeholder}
+        minDate={minDate}
+        maxDate={maxDate}
       />
     </div>
   );

diff --git a/src/components/form/FormField.js b/src/components/form/FormField.js
@@ -106,6 +106,8 @@ type InputProps = {
   label: ?string,
   language?: string,
   meta: Object,
+  minDate?: Date,
+  maxDate?: Date,
   multiSelect?: boolean,
   optionLabel?: string,
   options: ?Array<Object>,
@@ -140,6 +142,8 @@ const FormFieldInput = ({
   label,
   language,
   meta,
+  minDate,
+  maxDate,
   multiSelect,
   optionLabel,
   options,
@@ -234,7 +238,7 @@ const FormFieldInput = ({
           </FormFieldLabel>
         }
         <div className={classNames('form-field__component', {'has-unit': unit})}>
-          {createElement(fieldComponent, {autoBlur, autoComplete, displayError, disabled, filterOption, input, isDirty, isLoading, label, language, multiSelect, optionLabel, placeholder, options, rows, setRefForField, type, valueSelectedCallback})}
+          {createElement(fieldComponent, {autoBlur, autoComplete, displayError, disabled, filterOption, input, isDirty, isLoading, label, language, minDate, maxDate, multiSelect, optionLabel, placeholder, options, rows, setRefForField, type, valueSelectedCallback})}
           {unit && <span className='form-field__unit'>{unit}</span>}
         </div>
         {displayError && <ErrorComponent {...meta}/>}
@@ -285,6 +289,8 @@ type Props = {
   isLoading?: boolean,
   isMulti?: boolean,
   language?: string,
+  minDate?: Date,
+  maxDate?: Date,
   name: string,
   onBlur?: Function,
   onChange?: Function,
@@ -401,6 +407,8 @@ class FormField extends PureComponent<Props, State> {
       invisibleLabel,
       isLoading,
       language,
+      minDate,
+      maxDate,
       name,
       onBlur,
       onChange,
@@ -445,6 +453,8 @@ class FormField extends PureComponent<Props, State> {
         isLoading={isLoading}
         label={label}
         language={language}
+        minDate={minDate}
+        maxDate={maxDate}
         name={name}
         normalize={this.handleGenericNormalize}
         onBlur={onBlur}