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

Unable to disable option Groups to support options with property "options" #3706

Open
ncrum opened this issue Aug 5, 2019 · 7 comments · May be fixed by #5686
Open

Unable to disable option Groups to support options with property "options" #3706

ncrum opened this issue Aug 5, 2019 · 7 comments · May be fixed by #5686
Labels
issue/bug-confirmed Issues about a bug that has been confirmed by a maintainer

Comments

@ncrum
Copy link

ncrum commented Aug 5, 2019

This code assumes that if an Option has a options property then it MUST be a Group. In my use case, I have no need for a Group, but my option object does indeed have an options property, and so the Select assumes it has option groups anyways and excludes most of my options with empty options property.

It seems to me the solution probably involves one or more of the following:

  1. Add a prop to Select to allow enabling of groups, e.g. isGrouping, isGroups, etc. Make that part of the condition here instead.
  2. Add a prop to allow the user to configure the property that drives option groups, e.g. groupOptionsKey, or a functional version, e.g. getGroupOptions.

Example (notice "Ocean" is filtered out): https://codesandbox.io/s/option-groups-bug-s3pzm

If you guys agree with the issue and any of the solutions and need someone to make a PR, I'd be happy to if it helps. Thanks.
@bladey bladey added the issue/bug-unconfirmed Issues that describe a bug that hasn't been confirmed by a maintainer yet label May 29, 2020
@bladey bladey added cat/enhancement issue/reviewed Issue has recently been reviewed (mid-2020) and removed issue/bug-unconfirmed Issues that describe a bug that hasn't been confirmed by a maintainer yet labels Jun 18, 2020
@bladey
Copy link
Contributor

bladey commented Jun 23, 2020

Hi @ncrum,

I wanted to check in and see if you ended up implementing one of your proposed solutions, thanks!

@bladey bladey added the awaiting-author-response Issues or PRs waiting for more information from the author label Jun 23, 2020
@ncrum
Copy link
Author

ncrum commented Jun 23, 2020

@bladey I did not. Feel free to take it, as I'm not likely to get around to it, thanks!

@bladey bladey removed the awaiting-author-response Issues or PRs waiting for more information from the author label Jun 24, 2020
@ebonow ebonow added issue/bug-confirmed Issues about a bug that has been confirmed by a maintainer and removed issue/enhancement issue/reviewed Issue has recently been reviewed (mid-2020) labels Mar 8, 2021
@jacklimwenjie
Copy link

I was passing options as raw data and use getOptionLabel and getOptionValue prop to extract the label and value, but I kept ran into the following error:

Uncaught TypeError: groupOrOption.options.map is not a function

All this while I have been doing the same to other react-select use sites but have never face this error. Turns out my raw data has an options key which is a nested object, and react-select takes it as a grouped options but failed.

The workaround is to omit the options key in the raw data before passing to the options prop.
I do think that having a prop to disable the default behaviour of grouped option would be helpful

@hedwardd
Copy link

The workaround is to omit the options key in the raw data before passing to the options prop.
I do think that having a prop to disable the default behaviour of grouped option would be helpful

Just ran into this issue myself and ended up doing the same workaround after searching for and failing to find a prop to disable the group behavior.

@m1daz
Copy link

m1daz commented Jun 14, 2023

The workaround is to omit the options key in the raw data before passing to the options prop.
I do think that having a prop to disable the default behaviour of grouped option would be helpful

Just ran into this issue myself and ended up doing the same workaround after searching for and failing to find a prop to disable the group behavior.

I would love to hear your work-around right now because it's preventing my project from compiling, and it still happens now.

@hedwardd
Copy link

The workaround is to omit the options key in the raw data before passing to the options prop.
I do think that having a prop to disable the default behaviour of grouped option would be helpful

Just ran into this issue myself and ended up doing the same workaround after searching for and failing to find a prop to disable the group behavior.

I would love to hear your work-around right now because it's preventing my project from compiling, and it still happens now.

@octavian-ene I basically did something like this to remove the options property on each object before passing them to the component:

const withoutOptionsProperty = withOptionsProperty.map(({ options, ...rest }) => ({ ...rest }));

@Rall3n Rall3n linked a pull request Jun 28, 2023 that will close this issue
Draft
1 task
@phazei
Copy link

phazei commented Jun 24, 2024

Just came across this myself, it took a while to figure out it was all breaking because my own data had the key "options" in it. Would be nice if it didn't make that presumption or looked for a more unique key to exist, like groupOptions or something.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Assignees
No one assigned
Labels
issue/bug-confirmed Issues about a bug that has been confirmed by a maintainer
Projects
None yet
Milestone
No milestone
Development

Successfully merging a pull request may close this issue.

Add new getGroupOptions prop Rall3n/react-select
7 participants
@phazei @bladey @ebonow @ncrum @hedwardd @jacklimwenjie @m1daz