EDSC-4125: Recurring temporal slider doesn't work

[daniel-zamora]

Overview

What is the feature?

On the granule temporal filter there are some issues that arise with the recurring toggle. If start and end have the same year, the InputRange handlers overlap and are unmoveable. When recurring is toggled on, you can still change year values with the date picker. And when you scrub the InputRange handlers left or right, on each step change it will send a search request to CMR

What is the Solution?

When the same year is selected for start and end via the datepicker, and recurring is toggled on, we max out the range from 1960 to w/e the end date is

When recurring is toggled on, the date picker will not allow you to traverse outside the bounds of a single year's worth of months(i.e. you cannot go to the previous month when on January or the next month after December) and the year is no longer displayed on the column header when in days mode. It prevents traversing by disabling the navigation buttons.

CMR searches are now only sent in the onChangeComplete callback, not onChange

What areas of the application does this impact?

Datepicker, TemporalSelection, and GranuleFilterForm components

Testing

Reproduction steps

1. Select a Collection and filter granules by temporal filter
2. Select a start and end with the same year
3. Toggle recurring on.
4. Attempt to move the InputRange handle.

Attachments

Please include relevant screenshots or files that would be helpful in reviewing and verifying this change.

Checklist

• I have added automated tests that prove my fix is effective or that my feature works
• New and existing unit tests pass locally with my changes
• I have performed a self-review of my own code
• I have commented my code, particularly in hard-to-understand areas
• I have made corresponding changes to the documentation
• My changes generate no new warnings

[daniel-zamora]

in draft, just running tests

[codecov]

Codecov Report

Attention: Patch coverage is 71.81208% with 42 lines in your changes missing coverage. Please review.

Project coverage is 93.37%. Comparing base (54ee5da) to head (486700a).
Report is 1 commits behind head on main.

Files with missing lines	Patch %	Lines
...s/components/GranuleFilters/GranuleFiltersForm.jsx	28.20%	21 Missing and 7 partials ⚠️
static/src/js/components/Datepicker/Datepicker.jsx	86.66%	10 Missing ⚠️
...ents/TemporalDisplay/TemporalSelectionDropdown.jsx	87.87%	4 Missing ⚠️

Additional details and impacted files

@@            Coverage Diff             @@
##             main    #1841      +/-   ##
==========================================
- Coverage   93.78%   93.37%   -0.42%     
==========================================
  Files         778      778              
  Lines       18902    19022     +120     
  Branches     4884     4894      +10     
==========================================
+ Hits        17728    17761      +33     
- Misses       1099     1202     +103     
+ Partials       75       59      -16     

☔ View full report in Codecov by Sentry.
📢 Have feedback on the report? Share it here.

[eudoroolivares2016]

I'm seeing a behavior on this branch where on the temporal filter (the top level collection filter I mean) the recurring slider if enabled is only able to include the years so it cannot actually be moved vs on the granule filter we can still slide back to previous or post times

[bnp26]

@daniel-zamora What effort level do you think converting Datepicker.jsx & TemporalSelection.jsx to a functional component would be?

[trevorlang]

Definitely seeing some nice improvement here. One thing I noticed though, if a user does not have any dates selected when checking "Recurring" they end up in the state where the start and end slider handles are overlapping and the range cannot be changed. It would be nice if instead, the entire range was selected.

[trevorlang]

I find it a little odd that once you select "Recurring?" the date inputs fill with what seems to be the beginning of the year and the current date/time. Any way we can keep them empty?

Also, I'm just noticing that it looks like the "Apply" button is not disabling when the fields are empty, which it should be. Not sure if this is a bug or just something we need to improve. Looks like its the same in production. I don't want to increase the scope of this effort but that would be a great improvement. We can file a ticket and follow up with it if thats the best path forward.

[macrouch]

Found another issue where the year is being changed.

1. Select a start and end date, the end date should not be 2025.
2. Check the recurring checkbox.
3. Pick a new end date.

The year in the recurring range will be changed to 2025.

Alternate:

1. Select a start and end date.
2. Check the recurring checkbox.
3. Drag the range slider's end year to be earlier than 2025.
4. Pick a new end date.

The year in the recurring range will be changed to 2025.