Topology: Prevent user action on disabled context menu items #3695
Conversation
openshift-ci-robot
added
the
size/M
| const KebabContextMenuItemConnected = ( | ||
| props: kebabContextMenuItemProps & { impersonate: string }, | ||
| ) => { | ||
| const { option, impersonate } = props; | ||
| const isAllowed = useAccessReview(option.accessReview, impersonate); | ||
| return ( | ||
| <ContextMenuItem | ||
| className="odc2-topology-context-menu__kebab-wrapper" | ||
| key={option.label} | ||
| onClick={() => onKebabOptionClick(option)} | ||
| isDisabled={option.isDisabled || !isAllowed} | ||
| > | ||
| <KebabItem option={option} onClick={null} /> | ||
| </ContextMenuItem> | ||
| ); | ||
| }; |
There was a problem hiding this comment.
What if you use the PF4 DropdownContext like this:
const createMenuItem = (option: KebabOption) => (
<DropdownContext.Consumer key={option.label}>
{({ onSelect }) => (
<KebabItem
option={option}
onClick={() => {
onKebabOptionClick(option);
onSelect();
}}
/>
)}
</DropdownContext.Consumer>
);
There was a problem hiding this comment.
The issue is that the KebabItem changes once the accessReview is retrieved. The context menu is getting a ref from the KebabItem and saving it away. Since the KebabItem changes the saved ref is no longe valid and setting focus and key handlers to it is useless.
Using the wrapper ContextMenuItem causes the ref to remain constant and focus and key handlers then work correctly.
There was a problem hiding this comment.
Updated such that the kebab item does not change once the access review is retrieved simplifying and unnesting!
jeff-phillips-18
force-pushed
the
disabled-context
branch
from
c6c4298
to
a3c1abb
Compare
|
/retest |
|
/lgtm |
|
[APPROVALNOTIFIER] This PR is APPROVED This pull-request has been approved by: christianvogt, jeff-phillips-18 The full list of commands accepted by this bot can be found here. The pull request process is described here
Needs approval from an approver in each of these files:
Approvers can indicate their approval by writing |
openshift-ci-robot
added
the
approved
|
/retest |
|
/retest Please review the full test history for this PR and help us cut down flakes. |
4 similar comments
|
/retest Please review the full test history for this PR and help us cut down flakes. |
|
/retest Please review the full test history for this PR and help us cut down flakes. |
|
/retest Please review the full test history for this PR and help us cut down flakes. |
|
/retest Please review the full test history for this PR and help us cut down flakes. |
Resolves https://jira.coreos.com/browse/ODC-2400