Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

CalciteInputDatePicker with range sets end date when changing the start date if there's an initial value set #10113

Closed
2 of 6 tasks
fnquinteros opened this issue Aug 20, 2024 · 8 comments
Closed
2 of 6 tasks

CalciteInputDatePicker with range sets end date when changing the start date if there's an initial value set #10113

fnquinteros opened this issue Aug 20, 2024 · 8 comments
Assignees
@geospatialem @DitwanP
Labels
4 - verified Issues that have been released and confirmed resolved. ArcGIS Urban Issues logged by ArcGIS Urban team members. bug Bug reports for broken functionality. Issues should include a reproduction of the bug. calcite-components-react Issues specific to the @esri/calcite-components-react package. estimate - 2 Small fix or update, may require updates to tests. impact - p1 - need for current milestone User set priority impact status of p1 - need for current milestone p - high Issue should be addressed in the current milestone, impacts component or core functionality
Milestone
2024-12-17 - Dec ...

Comments

@fnquinteros
Copy link

Check existing issues

Actual Behavior

This only happens when there's an initial value set and only on the first input.

When it has an initial value set, setting the start date changes the end date and leaves the start date as it is.
If you refresh and start over, changing the end date first set the start date to null.

After the first value change, the input behaves es axpected.

Expected Behavior

Setting the start or end date for the first time when there's an initial value changes them accordingly and do not change anything else.

Reproduction Sample

https://codesandbox.io/p/devbox/happy-hooks-742ty6?file=%2Fsrc%2FApp.jsx

Reproduction Steps

  1. Change the start date to some day a few days in the future (3 or 4 days)
  2. Observe the actual value set to the start date and check that the value you set was actually set on the end date.
  3. refresh
  4. set the end date
  5. observe the start date. It will be empty.

Reproduction Version

latest (2.11.1)

Relevant Info

Tested on Chrome latest version, on a Macbook. Also ran on code sandbox, so it should happen regardless of OS.

Regression?

No response

Priority impact

impact - p1 - need for current milestone

Impact

At the moment, this can be solved with a workaround by setting the initial value after rendering the component, instead of passing the initial value to the component right away.

We're planning on releasing a redesign of a feature that includes this date picker in October. Would be nice to have it fixed by then.

Calcite package

  • @esri/calcite-components
  • @esri/calcite-components-angular
  • @esri/calcite-components-react
  • @esri/calcite-design-tokens
  • @esri/eslint-plugin-calcite-components

Esri team

ArcGIS Urban
@fnquinteros fnquinteros added 0 - new New issues that need assignment. bug Bug reports for broken functionality. Issues should include a reproduction of the bug. needs triage Planning workflow - pending design/dev review. labels Aug 20, 2024
@github-actions github-actions bot added ArcGIS Urban Issues logged by ArcGIS Urban team members. calcite-components-react Issues specific to the @esri/calcite-components-react package. impact - p1 - need for current milestone User set priority impact status of p1 - need for current milestone labels Aug 20, 2024
@geospatialem geospatialem added the p - medium Issue is non core or affecting less that 60% of people using the library label Sep 3, 2024
@geospatialem geospatialem added 1 - assigned Issues that are assigned to a sprint and a team member. estimate - 2 Small fix or update, may require updates to tests. and removed 0 - new New issues that need assignment. needs triage Planning workflow - pending design/dev review. labels Sep 3, 2024
@geospatialem geospatialem added 2 - in development Issues that are actively being worked on. and removed 1 - assigned Issues that are assigned to a sprint and a team member. labels Sep 3, 2024
@geospatialem geospatialem mentioned this issue Sep 3, 2024
Merged
anveshmekala added a commit that referenced this issue Sep 5, 2024
@anveshmekala
add tests #10113
813ef02
anveshmekala added a commit that referenced this issue Oct 23, 2024
@anveshmekala
feat(input-date-picker, date-picker): improve date picking experience (…
24d43ad 
…#8402)

**Related Issue:** #3455, #10113 

## Summary

Update `calcite-date-picker` & `calcite-input-date-picker` UI & UX.



![4D1CFC3C-8FF9-4493-9178-4DEDA0417031](https://github.com/user-attachments/assets/4b1f5a12-85df-4577-b1cd-812c22e41ef7)

### Key changes
- display two calendars for range irrespective of layout.
- No longer switches focus from day to end input when startDate is
selected initially.
- Month selection is possible via select menu
- No longer positions the date-picker component relative to endInput
when endInput is focused in range.
- Dates from previous months are not visible in range calendar.
- Divider indicator icons are removed in horizontal layout for range in
input-date-picker.
- No longer uses chevron icon which indicate the open status of
input-date-picker in startInput field.


Other issues resolved :
#6321
#6410
#10301
#10291
#10113
#10243
#10490

Blocked issues: #9167 

Wiki
https://github.com/Esri/calcite-design-system/wiki/date%E2%80%90picker-enhancement-%238402
@anveshmekala anveshmekala added 3 - installed Issues that have been merged to master branch and are ready for final confirmation. and removed 2 - in development Issues that are actively being worked on. labels Oct 23, 2024
@github-actions GitHub Actions
Copy link
Contributor

Installed and assigned for verification.

@github-actions github-actions bot assigned DitwanP and unassigned anveshmekala Oct 23, 2024
@DitwanP DitwanP added 1 - assigned Issues that are assigned to a sprint and a team member. and removed 3 - installed Issues that have been merged to master branch and are ready for final confirmation. labels Oct 28, 2024
@DitwanP DitwanP assigned anveshmekala and unassigned geospatialem Oct 28, 2024
@DitwanP DitwanP removed their assignment Oct 28, 2024
@DitwanP DitwanP added p - high Issue should be addressed in the current milestone, impacts component or core functionality and removed p - medium Issue is non core or affecting less that 60% of people using the library labels Oct 28, 2024
@DitwanP
Copy link
Contributor

DitwanP commented Oct 28, 2024

Moved to Nov milestone and increased priority at the request of Anvesh because an issue with react surfaced while verifying.

@anveshmekala
Copy link
Contributor

While solving the issue ,we introduced a new bug with #8402 which affects calcite-components-react build. This is related to component lifecycle structure. Synced-up with @maxpatiiuk and this will be resolved once the Lit migration is complete.

cc @DitwanP @jcfranco @maxpatiiuk

@anveshmekala anveshmekala mentioned this issue Oct 31, 2024
Closed
@anveshmekala
Copy link
Contributor

This should be fixed in 3.0.0-next.51 version of calcite-components-react.

https://codesandbox.io/p/devbox/input-date-picker-10113-kjynw6

cc @DitwanP , @fnquinteros

@anveshmekala anveshmekala added 3 - installed Issues that have been merged to master branch and are ready for final confirmation. and removed 1 - assigned Issues that are assigned to a sprint and a team member. labels Dec 16, 2024
@github-actions GitHub Actions
Copy link
Contributor

Installed and assigned for verification.

@github-actions github-actions bot assigned DitwanP and unassigned anveshmekala Dec 16, 2024
@DitwanP
Copy link
Contributor

DitwanP commented Dec 16, 2024

@anveshmekala I'm not able to verify with the link you provided, I'm getting this on codesandbox:
image

@anveshmekala
Copy link
Contributor

anveshmekala commented Dec 17, 2024 •
edited
Loading

@anveshmekala I'm not able to verify with the link you provided

Apologies, sandbox is marked as private earlier. Should be accessible now.

@geospatialem geospatialem added 4 - verified Issues that have been released and confirmed resolved. and removed 3 - installed Issues that have been merged to master branch and are ready for final confirmation. labels Dec 17, 2024
@geospatialem
Copy link
Member

Verified with https://codesandbox.io/p/devbox/input-date-picker-10113-kjynw6 in @esri/calcite-components-react@3.0.0-next.51 🎉

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Assignees

@geospatialem geospatialem

@DitwanP DitwanP

Labels
4 - verified Issues that have been released and confirmed resolved. ArcGIS Urban Issues logged by ArcGIS Urban team members. bug Bug reports for broken functionality. Issues should include a reproduction of the bug. calcite-components-react Issues specific to the @esri/calcite-components-react package. estimate - 2 Small fix or update, may require updates to tests. impact - p1 - need for current milestone User set priority impact status of p1 - need for current milestone p - high Issue should be addressed in the current milestone, impacts component or core functionality
Projects
None yet
Milestone
2024-12-17 - Dec Milestone
Development

No branches or pull requests
4 participants
@geospatialem @fnquinteros @DitwanP @anveshmekala