On selection of date in the drop down I'm trying to auto-select calendar date, however corresponding auto-selection into date, works only for first selection into dropdown, not on subsequent changes.

Could you advise on why and relevant concept I need to refer back?

const [formValue, setFormValues] =
useState({

  date: null
});

const stringToDate = (data: any) => {
  const date = data.value === "6 Months"
    ? moment().subtract(6, "months")
    : data.value === "Last Month"
      ? moment().subtract(1, "months")
      : moment().subtract(1, "weeks");
  return date.toDate();
}

<GridColumn width={8} className="fullWidth">
          <label>How much back </label>
          <Dropdown
            fluid
            selection
            options={dropdownOptions}
            value={dateDropdownValue}
            onChange={(_e: any, data: any) => {
              setFormValues({
                ...formValue,
                date: stringToDate(data.value),
              });

              setDateDropdownValue(data.value);
            }}
          />
        </GridColumn>
        <GridColumn width={8} className="fullWidth">
          <label>Exact Date is:</label>
          <CalendarWrap>
            <DatePicker
              onChange={(date) => {
                setFormValues({
                  ...formValue,
                  date: date,
                });
              }}                  
              selected={formValue.date}
            />
            <CalendarImg src={Icons.CalendarImage}></CalendarImg>
          </CalendarWrap>
        </GridColumn>