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 PropTypes from 'prop-types'
|
||||||
import { useNavigate, useLocation } from 'react-router-dom'
|
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
|
// Recursively map actions to AntD Dropdown items
|
||||||
function mapActionsToMenuItems(actions, currentUrlWithActions, id) {
|
function mapActionsToMenuItems(actions, currentUrlWithActions, id) {
|
||||||
return actions.map((action) => {
|
return actions.map((action) => {
|
||||||
@ -41,6 +71,7 @@ const ObjectActions = ({
|
|||||||
id,
|
id,
|
||||||
disabled = false,
|
disabled = false,
|
||||||
buttonProps = {},
|
buttonProps = {},
|
||||||
|
visibleActions = {},
|
||||||
...dropdownProps
|
...dropdownProps
|
||||||
}) => {
|
}) => {
|
||||||
const model = getModelByName(type)
|
const model = getModelByName(type)
|
||||||
@ -54,7 +85,13 @@ const ObjectActions = ({
|
|||||||
location.search
|
location.search
|
||||||
)
|
)
|
||||||
|
|
||||||
const filteredActions = actions.filter(
|
// First filter by visibility, then by current URL
|
||||||
|
const visibilityFilteredActions = filterActionsByVisibility(
|
||||||
|
actions,
|
||||||
|
visibleActions
|
||||||
|
)
|
||||||
|
|
||||||
|
const filteredActions = visibilityFilteredActions.filter(
|
||||||
(action) =>
|
(action) =>
|
||||||
typeof action.url !== 'function' ||
|
typeof action.url !== 'function' ||
|
||||||
action.url(id) !== currentUrlWithoutActions
|
action.url(id) !== currentUrlWithoutActions
|
||||||
@ -98,7 +135,8 @@ ObjectActions.propTypes = {
|
|||||||
id: PropTypes.string.isRequired,
|
id: PropTypes.string.isRequired,
|
||||||
disabled: PropTypes.bool,
|
disabled: PropTypes.bool,
|
||||||
buttonProps: PropTypes.object,
|
buttonProps: PropTypes.object,
|
||||||
buttonLabel: PropTypes.string
|
buttonLabel: PropTypes.string,
|
||||||
|
visibleActions: PropTypes.object
|
||||||
}
|
}
|
||||||
|
|
||||||
export default ObjectActions
|
export default ObjectActions
|
||||||
|
|||||||
Loading…
x
Reference in New Issue
Block a user