villebro commented on a change in pull request #13029:
URL: https://github.com/apache/superset/pull/13029#discussion_r575821616
##########
File path:
superset-frontend/src/explore/components/controls/FilterControl/AdhocFilterEditPopoverSimpleTabContent.jsx
##########
@@ -379,12 +386,25 @@ export default class
AdhocFilterEditPopoverSimpleTabContent extends React.Compon
name="filter-value"
{...comparatorSelectProps}
getPopupContainer={triggerNode => triggerNode.parentNode}
+ onSearch={val => this.setState({ currentSuggestionSearch: val })}
+ onSelect={this.clearSuggestionSearch}
+ onBlur={this.clearSuggestionSearch}
>
{this.state.suggestions.map(suggestion => (
<Select.Option value={suggestion} key={suggestion}>
{suggestion}
</Select.Option>
))}
+
+ {/* enable selecting an option not included in suggestions */}
+ {currentSuggestionSearch &&
+ !this.state.suggestions.some(
+ suggestion => suggestion === currentSuggestionSearch,
+ ) && (
+ <Select.Option value={currentSuggestionSearch}>
+ {currentSuggestionSearch}
+ </Select.Option>
+ )}
Review comment:
I think adding a wrapper that hides the specifics of how the component
actually implements the creatable option sounds like a good option. To my
understanding this is essentially how the migration process has been carried
out this far, i.e. importing components from `src/common/components/`, where we
start out by just exporting the vanilla component, and later extending the
component if needed. This way we can later much easier swap out the
implementation of said component if a new better library comes along (or if the
current implementation ends up being more problematic than we had envisioned).
Granted, the abstracted component's props will end up looking fairly identical
with their original implementation, but as we probably end up using only a
small subset of the features, migrating to a new implementation will at least
be slightly easier than not having any centralized abstraction.
Btw, I looked at what the current react-select implementation looks like in
the Filter Box, and that flow seems quite hacky to the end user (see below).
The select control that's used in the control panel isn't as bad, but it does
go to show that the react-select experience in Superset has not been optimal
from a UX perspective, either.
----------------------------------------------------------------
This is an automated message from the Apache Git Service.
To respond to the message, please log on to GitHub and use the
URL above to go to the specific comment.
For queries about this service, please contact Infrastructure at:
[email protected]
---------------------------------------------------------------------
To unsubscribe, e-mail: [email protected]
For additional commands, e-mail: [email protected]
