You are viewing a plain text version of this content. The canonical link for it is here.
Posted to notifications@superset.apache.org by GitBox <gi...@apache.org> on 2022/04/29 19:52:02 UTC
[GitHub] [superset] diegomedina248 opened a new pull request, #19902: feat: Explore popovers should close on escape
diegomedina248 opened a new pull request, #19902:
URL: https://github.com/apache/superset/pull/19902
### SUMMARY
This PR enables the popovers in the explore to be closed when hitting the escape key.
Also, improves the locking of the explore scroll, so that the popovers are pinned to the triggering div until they're closed.
### BEFORE/AFTER SCREENSHOTS OR ANIMATED GIF
No way to visually show the difference, so this is the actual result:
https://user-images.githubusercontent.com/17252075/166059870-309451f9-3eeb-4db5-bb15-f593a2011819.mov
### TESTING INSTRUCTIONS
In the explore:
* Try to edit the Data, be it metrics, columns, dimensions, filters, etc, and ensure it continues to work as before
* Hit the escape key while a popover is open and ensure it closes
* Ensure you can still interact with the popver (type, click, etc).
### ADDITIONAL INFORMATION
- [ ] Has associated issue:
- [ ] Required feature flags:
- [x] Changes UI
- [ ] Includes DB Migration (follow approval process in [SIP-59](https://github.com/apache/superset/issues/13351))
- [ ] Migration is atomic, supports rollback & is backwards-compatible
- [ ] Confirm DB migration upgrade and downgrade tested
- [ ] Runtime estimates and downtime expectations provided
- [ ] Introduces new feature or API
- [ ] Removes existing feature or API
--
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.
To unsubscribe, e-mail: notifications-unsubscribe@superset.apache.org
For queries about this service, please contact Infrastructure at:
users@infra.apache.org
---------------------------------------------------------------------
To unsubscribe, e-mail: notifications-unsubscribe@superset.apache.org
For additional commands, e-mail: notifications-help@superset.apache.org
[GitHub] [superset] diegomedina248 commented on a diff in pull request #19902: feat: Explore popovers should close on escape
Posted by GitBox <gi...@apache.org>.
diegomedina248 commented on code in PR #19902:
URL: https://github.com/apache/superset/pull/19902#discussion_r863128127
##########
superset-frontend/src/explore/components/controls/ControlPopover/ControlPopover.tsx:
##########
@@ -89,24 +98,50 @@ const ControlPopover: React.FC<PopoverProps> = ({
const handleOnVisibleChange = useCallback(
(visible: boolean) => {
- if (props.visible === undefined) {
+ if (visible === undefined) {
changeContainerScrollStatus(visible);
}
+ setVisible(!!visible);
props.onVisibleChange?.(visible);
},
[props, changeContainerScrollStatus],
);
+ const handleDocumentKeyDownListener = useCallback(
+ (event: KeyboardEvent) => {
+ if (event.key === 'Escape') {
+ setVisible(false);
+ props.onVisibleChange?.(false);
Review Comment:
To control the popover state in this component, to enable closing on escape.
--
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.
To unsubscribe, e-mail: notifications-unsubscribe@superset.apache.org
For queries about this service, please contact Infrastructure at:
users@infra.apache.org
---------------------------------------------------------------------
To unsubscribe, e-mail: notifications-unsubscribe@superset.apache.org
For additional commands, e-mail: notifications-help@superset.apache.org
[GitHub] [superset] diegomedina248 commented on a diff in pull request #19902: feat: Explore popovers should close on escape
Posted by GitBox <gi...@apache.org>.
diegomedina248 commented on code in PR #19902:
URL: https://github.com/apache/superset/pull/19902#discussion_r863127188
##########
superset-frontend/src/explore/components/controls/ControlPopover/ControlPopover.tsx:
##########
@@ -44,9 +44,14 @@ export type PopoverProps = BasePopoverProps & {
const ControlPopover: React.FC<PopoverProps> = ({
getPopupContainer,
getVisibilityRatio = getElementYVisibilityRatioOnContainer,
+ visible: visibleProp,
...props
}) => {
const triggerElementRef = useRef<HTMLElement>();
+
+ const [visible, setVisible] = useState(
Review Comment:
We need the visible state locally to control the popover in this component
--
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.
To unsubscribe, e-mail: notifications-unsubscribe@superset.apache.org
For queries about this service, please contact Infrastructure at:
users@infra.apache.org
---------------------------------------------------------------------
To unsubscribe, e-mail: notifications-unsubscribe@superset.apache.org
For additional commands, e-mail: notifications-help@superset.apache.org
[GitHub] [superset] rusackas merged pull request #19902: feat: Explore popovers should close on escape
Posted by GitBox <gi...@apache.org>.
rusackas merged PR #19902:
URL: https://github.com/apache/superset/pull/19902
--
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.
To unsubscribe, e-mail: notifications-unsubscribe@superset.apache.org
For queries about this service, please contact Infrastructure at:
users@infra.apache.org
---------------------------------------------------------------------
To unsubscribe, e-mail: notifications-unsubscribe@superset.apache.org
For additional commands, e-mail: notifications-help@superset.apache.org
[GitHub] [superset] codecov[bot] commented on pull request #19902: feat: Explore popovers should close on escape
Posted by GitBox <gi...@apache.org>.
codecov[bot] commented on PR #19902:
URL: https://github.com/apache/superset/pull/19902#issuecomment-1113705380
# [Codecov](https://codecov.io/gh/apache/superset/pull/19902?src=pr&el=h1&utm_medium=referral&utm_source=github&utm_content=comment&utm_campaign=pr+comments&utm_term=The+Apache+Software+Foundation) Report
> Merging [#19902](https://codecov.io/gh/apache/superset/pull/19902?src=pr&el=desc&utm_medium=referral&utm_source=github&utm_content=comment&utm_campaign=pr+comments&utm_term=The+Apache+Software+Foundation) (4431013) into [master](https://codecov.io/gh/apache/superset/commit/9328053521830af7f94521897e50c76ecb15933b?el=desc&utm_medium=referral&utm_source=github&utm_content=comment&utm_campaign=pr+comments&utm_term=The+Apache+Software+Foundation) (9328053) will **increase** coverage by `0.00%`.
> The diff coverage is `90.00%`.
```diff
@@ Coverage Diff @@
## master #19902 +/- ##
=======================================
Coverage 66.52% 66.52%
=======================================
Files 1714 1714
Lines 65032 65048 +16
Branches 6717 6720 +3
=======================================
+ Hits 43260 43273 +13
- Misses 20065 20066 +1
- Partials 1707 1709 +2
```
| Flag | Coverage Δ | |
|---|---|---|
| javascript | `51.26% <90.00%> (+0.01%)` | :arrow_up: |
Flags with carried forward coverage won't be shown. [Click here](https://docs.codecov.io/docs/carryforward-flags?utm_medium=referral&utm_source=github&utm_content=comment&utm_campaign=pr+comments&utm_term=The+Apache+Software+Foundation#carryforward-flags-in-the-pull-request-comment) to find out more.
| [Impacted Files](https://codecov.io/gh/apache/superset/pull/19902?src=pr&el=tree&utm_medium=referral&utm_source=github&utm_content=comment&utm_campaign=pr+comments&utm_term=The+Apache+Software+Foundation) | Coverage Δ | |
|---|---|---|
| [...ponents/controls/ControlPopover/ControlPopover.tsx](https://codecov.io/gh/apache/superset/pull/19902/diff?src=pr&el=tree&utm_medium=referral&utm_source=github&utm_content=comment&utm_campaign=pr+comments&utm_term=The+Apache+Software+Foundation#diff-c3VwZXJzZXQtZnJvbnRlbmQvc3JjL2V4cGxvcmUvY29tcG9uZW50cy9jb250cm9scy9Db250cm9sUG9wb3Zlci9Db250cm9sUG9wb3Zlci50c3g=) | `87.03% <90.00%> (-2.71%)` | :arrow_down: |
| [.../components/ExploreAdditionalActionsMenu/index.jsx](https://codecov.io/gh/apache/superset/pull/19902/diff?src=pr&el=tree&utm_medium=referral&utm_source=github&utm_content=comment&utm_campaign=pr+comments&utm_term=The+Apache+Software+Foundation#diff-c3VwZXJzZXQtZnJvbnRlbmQvc3JjL2V4cGxvcmUvY29tcG9uZW50cy9FeHBsb3JlQWRkaXRpb25hbEFjdGlvbnNNZW51L2luZGV4LmpzeA==) | `57.14% <0.00%> (ø)` | |
| [...set-frontend/src/components/ReportModal/styles.tsx](https://codecov.io/gh/apache/superset/pull/19902/diff?src=pr&el=tree&utm_medium=referral&utm_source=github&utm_content=comment&utm_campaign=pr+comments&utm_term=The+Apache+Software+Foundation#diff-c3VwZXJzZXQtZnJvbnRlbmQvc3JjL2NvbXBvbmVudHMvUmVwb3J0TW9kYWwvc3R5bGVzLnRzeA==) | `87.87% <0.00%> (+0.37%)` | :arrow_up: |
------
[Continue to review full report at Codecov](https://codecov.io/gh/apache/superset/pull/19902?src=pr&el=continue&utm_medium=referral&utm_source=github&utm_content=comment&utm_campaign=pr+comments&utm_term=The+Apache+Software+Foundation).
> **Legend** - [Click here to learn more](https://docs.codecov.io/docs/codecov-delta?utm_medium=referral&utm_source=github&utm_content=comment&utm_campaign=pr+comments&utm_term=The+Apache+Software+Foundation)
> `Δ = absolute <relative> (impact)`, `ø = not affected`, `? = missing data`
> Powered by [Codecov](https://codecov.io/gh/apache/superset/pull/19902?src=pr&el=footer&utm_medium=referral&utm_source=github&utm_content=comment&utm_campaign=pr+comments&utm_term=The+Apache+Software+Foundation). Last update [9328053...4431013](https://codecov.io/gh/apache/superset/pull/19902?src=pr&el=lastupdated&utm_medium=referral&utm_source=github&utm_content=comment&utm_campaign=pr+comments&utm_term=The+Apache+Software+Foundation). Read the [comment docs](https://docs.codecov.io/docs/pull-request-comments?utm_medium=referral&utm_source=github&utm_content=comment&utm_campaign=pr+comments&utm_term=The+Apache+Software+Foundation).
--
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.
To unsubscribe, e-mail: notifications-unsubscribe@superset.apache.org
For queries about this service, please contact Infrastructure at:
users@infra.apache.org
---------------------------------------------------------------------
To unsubscribe, e-mail: notifications-unsubscribe@superset.apache.org
For additional commands, e-mail: notifications-help@superset.apache.org
[GitHub] [superset] codemaster08240328 commented on a diff in pull request #19902: feat: Explore popovers should close on escape
Posted by GitBox <gi...@apache.org>.
codemaster08240328 commented on code in PR #19902:
URL: https://github.com/apache/superset/pull/19902#discussion_r863119351
##########
superset-frontend/src/explore/components/controls/ControlPopover/ControlPopover.tsx:
##########
@@ -89,24 +98,50 @@ const ControlPopover: React.FC<PopoverProps> = ({
const handleOnVisibleChange = useCallback(
(visible: boolean) => {
- if (props.visible === undefined) {
+ if (visible === undefined) {
Review Comment:
Is this correct?
Actually, we will never have `visible` state as `undefined`.
I think this should be `visibleProp`?
--
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.
To unsubscribe, e-mail: notifications-unsubscribe@superset.apache.org
For queries about this service, please contact Infrastructure at:
users@infra.apache.org
---------------------------------------------------------------------
To unsubscribe, e-mail: notifications-unsubscribe@superset.apache.org
For additional commands, e-mail: notifications-help@superset.apache.org
[GitHub] [superset] diegomedina248 commented on a diff in pull request #19902: feat: Explore popovers should close on escape
Posted by GitBox <gi...@apache.org>.
diegomedina248 commented on code in PR #19902:
URL: https://github.com/apache/superset/pull/19902#discussion_r863127188
##########
superset-frontend/src/explore/components/controls/ControlPopover/ControlPopover.tsx:
##########
@@ -44,9 +44,14 @@ export type PopoverProps = BasePopoverProps & {
const ControlPopover: React.FC<PopoverProps> = ({
getPopupContainer,
getVisibilityRatio = getElementYVisibilityRatioOnContainer,
+ visible: visibleProp,
...props
}) => {
const triggerElementRef = useRef<HTMLElement>();
+
+ const [visible, setVisible] = useState(
Review Comment:
We need the visible state locally to control the popover in this component.
The "visible" prop can be undefined, (leaving the component in an uncontrolled manner), that's why we need to take over the control, and can't rely on simple calling the onVisibleChange callback
--
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.
To unsubscribe, e-mail: notifications-unsubscribe@superset.apache.org
For queries about this service, please contact Infrastructure at:
users@infra.apache.org
---------------------------------------------------------------------
To unsubscribe, e-mail: notifications-unsubscribe@superset.apache.org
For additional commands, e-mail: notifications-help@superset.apache.org
[GitHub] [superset] diegomedina248 commented on a diff in pull request #19902: feat: Explore popovers should close on escape
Posted by GitBox <gi...@apache.org>.
diegomedina248 commented on code in PR #19902:
URL: https://github.com/apache/superset/pull/19902#discussion_r863131013
##########
superset-frontend/src/explore/components/controls/ControlPopover/ControlPopover.tsx:
##########
@@ -89,24 +98,50 @@ const ControlPopover: React.FC<PopoverProps> = ({
const handleOnVisibleChange = useCallback(
(visible: boolean) => {
- if (props.visible === undefined) {
+ if (visible === undefined) {
Review Comment:
The local state is needed cause "visible" can be undefined, (leaving the component uncontrolled), so we can't just call the `onVisibleChange` and expect someone to update the state, the user might not be using this callback.
--
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.
To unsubscribe, e-mail: notifications-unsubscribe@superset.apache.org
For queries about this service, please contact Infrastructure at:
users@infra.apache.org
---------------------------------------------------------------------
To unsubscribe, e-mail: notifications-unsubscribe@superset.apache.org
For additional commands, e-mail: notifications-help@superset.apache.org
[GitHub] [superset] codemaster08240328 commented on a diff in pull request #19902: feat: Explore popovers should close on escape
Posted by GitBox <gi...@apache.org>.
codemaster08240328 commented on code in PR #19902:
URL: https://github.com/apache/superset/pull/19902#discussion_r863123148
##########
superset-frontend/src/explore/components/controls/ControlPopover/ControlPopover.tsx:
##########
@@ -44,9 +44,14 @@ export type PopoverProps = BasePopoverProps & {
const ControlPopover: React.FC<PopoverProps> = ({
getPopupContainer,
getVisibilityRatio = getElementYVisibilityRatioOnContainer,
+ visible: visibleProp,
...props
}) => {
const triggerElementRef = useRef<HTMLElement>();
+
+ const [visible, setVisible] = useState(
Review Comment:
Totally, I don't think that introducing `visible` state here is a good idea.
We can control `visibleProps`.
Currently you are mixing `visible` state and `visible` props to control visible, but it is not a good idea.
##########
superset-frontend/src/explore/components/controls/ControlPopover/ControlPopover.tsx:
##########
@@ -89,24 +98,50 @@ const ControlPopover: React.FC<PopoverProps> = ({
const handleOnVisibleChange = useCallback(
(visible: boolean) => {
- if (props.visible === undefined) {
+ if (visible === undefined) {
Review Comment:
Is this correct?
Actually, we will never `visible` state as `undefined`.
I think this should be `visibleProp`?
##########
superset-frontend/src/explore/components/controls/ControlPopover/ControlPopover.tsx:
##########
@@ -89,24 +98,50 @@ const ControlPopover: React.FC<PopoverProps> = ({
const handleOnVisibleChange = useCallback(
(visible: boolean) => {
- if (props.visible === undefined) {
+ if (visible === undefined) {
changeContainerScrollStatus(visible);
}
+ setVisible(!!visible);
props.onVisibleChange?.(visible);
},
[props, changeContainerScrollStatus],
);
+ const handleDocumentKeyDownListener = useCallback(
+ (event: KeyboardEvent) => {
+ if (event.key === 'Escape') {
+ setVisible(false);
+ props.onVisibleChange?.(false);
Review Comment:
`props.onVisibleChange?.(false)` is enough. Why did you introduce `visible` state and `setVisible`?
##########
superset-frontend/src/explore/components/controls/ControlPopover/ControlPopover.tsx:
##########
@@ -44,9 +44,14 @@ export type PopoverProps = BasePopoverProps & {
const ControlPopover: React.FC<PopoverProps> = ({
getPopupContainer,
getVisibilityRatio = getElementYVisibilityRatioOnContainer,
+ visible: visibleProp,
...props
}) => {
const triggerElementRef = useRef<HTMLElement>();
+
+ const [visible, setVisible] = useState(
+ !!(visibleProp || props.defaultVisible),
Review Comment:
`visibleProp` and `defaultVisible` are `boolean` types, which means that the above logic maybe wrong in some cases like:
`visibleProp` = false
`defaultVisible` = true
In this case, `visible` state would be set as `true`, even though it should be set as `false`.
--
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.
To unsubscribe, e-mail: notifications-unsubscribe@superset.apache.org
For queries about this service, please contact Infrastructure at:
users@infra.apache.org
---------------------------------------------------------------------
To unsubscribe, e-mail: notifications-unsubscribe@superset.apache.org
For additional commands, e-mail: notifications-help@superset.apache.org
[GitHub] [superset] sadpandajoe commented on pull request #19902: feat: Explore popovers should close on escape
Posted by GitBox <gi...@apache.org>.
sadpandajoe commented on PR #19902:
URL: https://github.com/apache/superset/pull/19902#issuecomment-1127954262
🏷️ preset:2022.19
--
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.
To unsubscribe, e-mail: notifications-unsubscribe@superset.apache.org
For queries about this service, please contact Infrastructure at:
users@infra.apache.org
---------------------------------------------------------------------
To unsubscribe, e-mail: notifications-unsubscribe@superset.apache.org
For additional commands, e-mail: notifications-help@superset.apache.org