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.

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

Reset after-hovered-start in componentWillReceiveProps - Fixes #831 #843

Merged
merged 2 commits into from
Nov 27, 2017

Conversation

wyattdanger
Copy link
Collaborator

after-hovered-start was being unset in onDayClick, which led to an issue
where the modifier was left as applied when changing dates via keyboard
navigation. This moves that logic into componentWillReceiveProps so that
it works in both cases.

Fixes #831

Gif of keyboard navigation and changing dates after the fix, for comparison with gif in the issue:
ghostvaluesgone

cc @backwardok @majapw

@coveralls
Copy link

Coverage Status

Coverage increased (+0.009%) to 87.108% when pulling cee2e7b on swb--dayrangepicker-ghost-values into 55d6453 on master.

@wyattdanger wyattdanger added the semver-patch: fixes/refactors/etc Anything that's not major or minor. label Nov 15, 2017
Copy link
Contributor

@backwardok backwardok left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Don't know that I know this library well enough to definitively approve it (maybe @ljharb does?) but the gif seems like better behavior. What it is highlighting to me is that the after-hovered-start doesn't make as much sense in its current state in a keyboard world, and should probably be added as you move around the calendar in the same way that it is if you were hovering. However, that's perhaps out of scope for this PR (but seems worth a separate PR to really tackle the desired UX)

Also want to verify that you also tested that this is not broken for mouse users

@@ -258,6 +258,11 @@ export default class DayPickerRangeController extends React.Component {
if (didStartDateChange) {
modifiers = this.deleteModifier(modifiers, this.props.startDate, 'selected-start');
modifiers = this.addModifier(modifiers, startDate, 'selected-start');
if (this.props.startDate) {
const startSpan = this.props.startDate.clone().add(1, 'day');
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I wonder if we should do something like

const {
  startDate: prevStartDate,
  minimumNights: prevMinimumNights,
  ...
} = this.props

so that we're not referencing this.props so many times in this function

ljharb
ljharb previously approved these changes Nov 16, 2017
Copy link
Member

@ljharb ljharb left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

This seems reasonable, but let's get some more eyes on it if possible before merging.

@ljharb ljharb requested review from majapw and erin-doyle November 16, 2017 16:01
@wyattdanger
Copy link
Collaborator Author

Oh, hello again @erin-doyle!

@erin-doyle
Copy link
Collaborator

Isn't it a small React world @wyattdanger ! I think this looks good besides the suggestion to unpack this.prop.

after-hovered-start was being unset in onDayClick, which led to an issue
where the modifier was left as applied when changing dates via keyboard
navigation. This moves that logic into componentWillReceiveProps so that
it works in both cases.
@wyattdanger
Copy link
Collaborator Author

@backwardok @erin-doyle alright, all this.props references in componentWillReceiveProps have been destructured in a second commit

@coveralls
Copy link

Coverage Status

Coverage increased (+0.02%) to 86.571% when pulling 1160090 on swb--dayrangepicker-ghost-values into bd5f52a on master.

Copy link
Collaborator

@erin-doyle erin-doyle left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

LGTM! Thanks! 👍

Copy link
Collaborator

@majapw majapw left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

LGTM! Thanks!

@majapw majapw merged commit b226d9c into master Nov 27, 2017
@majapw majapw deleted the swb--dayrangepicker-ghost-values branch November 27, 2017 21:26
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
semver-patch: fixes/refactors/etc Anything that's not major or minor.
Projects
None yet
Development

Successfully merging this pull request may close these issues.

DayPickerRangeController leaves ghost values when using a keyboard
6 participants