Enhance ObjectActions component to support action visibility filtering
- Introduced a recursive function to filter actions based on visibility, allowing for dynamic control over which actions are displayed. - Updated the component to accept a new 'visibleActions' prop for improved customization. - Improved code readability by restructuring the action filtering logic and ensuring proper handling of nested actions.
This commit is contained in:
parent
27e843e183
commit
08dbbefada
@ -4,6 +4,36 @@ import { getModelByName } from '../../../database/ObjectModels'
|
||||
import PropTypes from 'prop-types'
|
||||
import { useNavigate, useLocation } from 'react-router-dom'
|
||||
|
||||
// Recursively filter actions based on visibleActions
|
||||
function filterActionsByVisibility(actions, visibleActions) {
|
||||
if (!visibleActions) return actions
|
||||
|
||||
return actions.filter((action) => {
|
||||
if (action.type === 'divider') {
|
||||
return true // Always show dividers
|
||||
}
|
||||
|
||||
const actionKey = action.key || action.name
|
||||
const isVisible = visibleActions[actionKey] !== false
|
||||
|
||||
// If this action has children, filter them recursively
|
||||
if (action.children && Array.isArray(action.children)) {
|
||||
const filteredChildren = filterActionsByVisibility(
|
||||
action.children,
|
||||
visibleActions
|
||||
)
|
||||
action.children = filteredChildren
|
||||
// Show parent if it has visible children or if it's explicitly visible
|
||||
return (
|
||||
isVisible &&
|
||||
(filteredChildren.length > 0 || visibleActions[actionKey] === true)
|
||||
)
|
||||
}
|
||||
|
||||
return isVisible
|
||||
})
|
||||
}
|
||||
|
||||
// Recursively map actions to AntD Dropdown items
|
||||
function mapActionsToMenuItems(actions, currentUrlWithActions, id) {
|
||||
return actions.map((action) => {
|
||||
@ -41,6 +71,7 @@ const ObjectActions = ({
|
||||
id,
|
||||
disabled = false,
|
||||
buttonProps = {},
|
||||
visibleActions = {},
|
||||
...dropdownProps
|
||||
}) => {
|
||||
const model = getModelByName(type)
|
||||
@ -54,7 +85,13 @@ const ObjectActions = ({
|
||||
location.search
|
||||
)
|
||||
|
||||
const filteredActions = actions.filter(
|
||||
// First filter by visibility, then by current URL
|
||||
const visibilityFilteredActions = filterActionsByVisibility(
|
||||
actions,
|
||||
visibleActions
|
||||
)
|
||||
|
||||
const filteredActions = visibilityFilteredActions.filter(
|
||||
(action) =>
|
||||
typeof action.url !== 'function' ||
|
||||
action.url(id) !== currentUrlWithoutActions
|
||||
@ -98,7 +135,8 @@ ObjectActions.propTypes = {
|
||||
id: PropTypes.string.isRequired,
|
||||
disabled: PropTypes.bool,
|
||||
buttonProps: PropTypes.object,
|
||||
buttonLabel: PropTypes.string
|
||||
buttonLabel: PropTypes.string,
|
||||
visibleActions: PropTypes.object
|
||||
}
|
||||
|
||||
export default ObjectActions
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user