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

State change occurs before hitting reducer on Enter key #1514

Closed
okonet opened this issue Jul 4, 2023 · 2 comments
Closed

State change occurs before hitting reducer on Enter key #1514

okonet opened this issue Jul 4, 2023 · 2 comments
Labels

Comments

@okonet
Copy link

okonet commented Jul 4, 2023

  • downshift version: 7.6.0
  • node version: 20
  • npm (or yarn) version: 1.9

What you did:

I was trying to implement a customer request to keep the input's field value intact after selecting. So I tried doing this in the stateReducer:

const { changes, type } = actionAndChanges;
switch (type) {
    case stateChangeTypes.InputKeyDownEnter:
    case stateChangeTypes.ItemClick:
      return {
        ...changes,
        inputValue: state.inputValue, // Keep the previous input value.
      };
    default:
      return changes;
}

That didn't work so after printing the state and changes I found out that it's already having both selectedItem and inputValue set. In my understanding that should happen in the reducer, so the state should not have those values set, and changes should. After returning changes, the new state should be updated.

What happened:

CleanShot 2023-07-04 at 09 58 08@2x

Suggested solution:

I'm not sure but it seems like the state was already update prior the reducer function was called.

@okonet
Copy link
Author

okonet commented Jul 4, 2023

I think it might be a duplicate of #759

@silviuaavram
Copy link
Collaborator

@okonet can you create a full code sandbox with the issue you are facing? There may be something wrong with your implementation.

You can also check our examples repo: https://codesandbox.io/s/github/kentcdodds/downshift-examples

You will find a stateReducer example there for useCombobox, if that's what you are using. Just replace the uppercase thing from there with state.inputValue and it should be good to go. Thanks!

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
Projects
None yet
Development

No branches or pull requests

2 participants