From 9101855a39dad42b9a98ab181ddc1984aeed1118 Mon Sep 17 00:00:00 2001
From: daniel-zamora <daniel.p.zamora@nasa.gov>
Date: Mon, 27 Jan 2025 13:16:43 -0500
Subject: [PATCH] EDSC-4125 granule filters form fixes

---
 .../GranuleFilters/GranuleFiltersForm.jsx     | 32 +++++++------------
 1 file changed, 12 insertions(+), 20 deletions(-)

diff --git a/static/src/js/components/GranuleFilters/GranuleFiltersForm.jsx b/static/src/js/components/GranuleFilters/GranuleFiltersForm.jsx
index b070a55bea..3cf3d04223 100644
--- a/static/src/js/components/GranuleFilters/GranuleFiltersForm.jsx
+++ b/static/src/js/components/GranuleFilters/GranuleFiltersForm.jsx
@@ -1,4 +1,4 @@
-import React, { useState } from 'react'
+import React from 'react'
 import PropTypes from 'prop-types'
 import { Form as FormikForm } from 'formik'
 import {
@@ -71,11 +71,6 @@ export const GranuleFiltersForm = (props) => {
     temporal = {}
   } = values
 
-  const [datesSelected, setDatesSelected] = useState({
-    start: false,
-    end: false
-  })
-
   const { isRecurring } = temporal
 
   // For recurring dates we don't show the year, it's displayed on the slider
@@ -451,8 +446,8 @@ export const GranuleFiltersForm = (props) => {
                 size="sm"
                 format={temporalDateFormat}
                 temporal={temporal}
-                displayStartDate={datesSelected.start ? temporal.startDate : ''}
-                displayEndDate={datesSelected.end ? temporal.endDate : ''}
+                displayStartDate={temporal.startDate}
+                displayEndDate={temporal.endDate}
                 validate={false}
                 onSliderChange={
                   (value) => {
@@ -528,18 +523,20 @@ export const GranuleFiltersForm = (props) => {
                 }
                 onSubmitStart={
                   (startDate, shouldSubmit) => {
+                    const { temporal: newTemporal } = values
+                    if (newTemporal.isRecurring) {
+                      const existingStartDate = moment(values.temporal.startDate)
+                      if (existingStartDate.isValid()) {
+                        const existingStartDateYear = existingStartDate.year()
+                        startDate.year(existingStartDateYear)
+                      }
+                    }
+
                     const { input } = startDate.creationData()
                     const value = startDate.isValid() ? startDate.toISOString() : input
-
                     setFieldValue('temporal.startDate', value)
                     setFieldTouched('temporal.startDate')
 
-                    setDatesSelected((prev) => ({
-                      ...prev,
-                      start: true
-                    }))
-
-                    const { temporal: newTemporal } = values
                     if (newTemporal.isRecurring && newTemporal.endDate && startDate.isValid()) {
                       const endDate = moment(newTemporal.endDate).utc()
 
@@ -570,11 +567,6 @@ export const GranuleFiltersForm = (props) => {
                     setFieldValue('temporal.endDate', value)
                     setFieldTouched('temporal.endDate')
 
-                    setDatesSelected((prev) => ({
-                      ...prev,
-                      end: true
-                    }))
-
                     const { temporal: newTemporal } = values
                     if (newTemporal.isRecurring && newTemporal.startDate && endDate.isValid()) {
                       const startDate = moment(newTemporal.startDate).utc()