- actions.map((action, i) =>{
- const { hasAlts, useAlts, name, altName, icon, altIcon } = action;
- return hasAlts ? (
- <Tooltip
- className={classes.button}
- title={currentPathIsTrash || (useAlts && useAlts(singleSelectedUuid, iconProps)) ? altName : name}
- key={i}
- disableFocusListener
- >
- <span className={classes.iconContainer}>
- <IconButton
- data-cy='multiselect-button'
- disabled={disabledButtons.has(name)}
- onClick={() => props.executeMulti(action, checkedList, iconProps.resources)}
- >
- {currentPathIsTrash || (useAlts && useAlts(singleSelectedUuid, iconProps)) ? altIcon && altIcon({}) : icon({})}
- </IconButton>
- </span>
- </Tooltip>
- ) : (
- <Tooltip
- className={classes.button}
- title={action.name}
- key={i}
- disableFocusListener
- >
- <span className={classes.iconContainer}>
- <IconButton
- data-cy='multiselect-button'
- onClick={() => props.executeMulti(action, checkedList, iconProps.resources)}
+ <IntersectionObserverWrapper menuLength={actions.length}>
+ {actions.map((action, i) =>{
+ const { hasAlts, useAlts, name, altName, icon, altIcon } = action;
+ return action.name === ContextMenuActionNames.DIVIDER ? (
+ action.component && (
+ <div
+ className={classes.divider}
+ data-targetid={`${name}${i}`}
+ key={i}