как фильтровать массив подмассива объектов и массив подмассива объектов в javascript

Question

У меня есть два массива объектов. Я хочу отфильтровать данные, основываясь на разрешении Obj.

Это исходит из базы данных. Вот массивы под-массивов в разрешении Obj.

 let permissionObj = [
        {
            "Deposit": [{
                    label: "can create",
                    value: "can_create"
                }, 
            ]
        },
        {
            "Journals": [{
                label: "can create",
                value: "can_create"
            }]
        },

        {
            "Dashboard": [{
                label: "can view",
                value: "can_view"
            }]
        },
    ]

это данные c. Я хочу сравнить эти данные на основании разрешения.

    const PubSidebar = [{
            label: "Dashboard",
            value: "can_view"
        }, 
        {
            label: "OA deal",
            content: [

                {
                    label: "Deposit",
                    key: "Deposit",
                    value: "can_view"
                },
                 {
                    label: "Corrections",
                    key: "Corrections",
                    value: "can_edit"
                },

            ]
        },
        {   
            label: "Journal",
            content: [{
                    label: "Add Journal",
                    key: "Journals",
                    value: "can_create"
                },

            ]
        },
    ];

Вот мой PubSidebar, мне нужно три типа фильтрации - если массив объектов PubSidebar, то он будет фильтроваться на основе метки. Например, Dashboard - если pubSidebar массив подмассива объектов, то фильтрация будет основываться на метке, ключе и значении, например, PermissionObj key: будет именем свойства, таким как OA deal, Deposit, value: can_view или что-либо еще

My ожидаемый результат будет:

    const PubSidebar = [{
            label: "Dashboard",
            value: "can_view"
        }, 
        {
            label: "OA deal",
            content: [
                {
                    label: "edit oadeal ",
                    key: "OA deal",
                    value: "can_edit"
                },

                {
                    label: "Deposit",
                    key: "Deposit",
                    value: "can_view"
                },

            ]
        },
        {   
            label: "Journal",
            content: [{
                    label: "Add Journal",
                    key: "Journals",
                    value: "can_create"
                },

            ]
        },
    ];

Answer 1

Вы можете получить метод reduce, так как он позволяет писать сложные логики c и решать, что следует делать на каждой итерации массива. Я немного отредактировал ваши исходные данные, так как трудно понять логику фильтрации c.

Сначала мы создаем объект, который будет содержать данные фильтра. Почему объект? Поскольку объект имеет O(1) для доступа к своим ключам.

const filterObject = permissionObj.reduce((a, c) => {
    for (const key in c) {
        a[key] = c[key];
    }
    return a;
},{});

Затем мы используем метод reduce, чтобы определить, может ли элемент массива быть нажатым:

const result = PubSidebar.reduce((a, c)=> {
    if (filterObject[c.label] && c.value
        && filterObject[c.label].some(s => s.value == c.value) ) {
        a.push(c);
    }
    else if (c.content.some(s => filterObject[s.key]) && c.content) {
        c.content = c.content.filter(f => filterObject[f.key]
            && filterObject[f.key].some(s => s.value == f.value));
        a.push(c);
    }
    return a;
}, [])

An пример:

let permissionObj = [
    {
        "OA deal": [{
            label: "can view",
            value: "can_view"
        }
        ]
    }, {
        "Deposit": [{
            label: "can edit",
            value: "can_edit"
        },
        ]
    },
    {
        "Deposit": [{
            label: "can_view",
            value: "can_view"
        },
        ]
    },
    {
        "Journals": [{
            label: "can create",
            value: "can_create"
        }]
    },
    {
        "Dashboard": [{
            label: "can view",
            value: "can_view"
        }]
    }
];

const PubSidebar = [
    {
        label: "Dashboard",
        value: "can_view"
    },
    {
        label: "OA deal",
        content: [
            {
                label: "view oadeal",
                key: "OA deal",
                value: "can_view"
            },

            {
                label: "Deposit",
                key: "Deposit",
                value: "can_view"
            },
            {
                label: "Corrections",
                key: "Corrections",
                value: "can_edit"
            },

        ]
    },
    {
        label: "Journal",
        content: [{
            label: "Add Journal",
            key: "Journals",
            value: "can_create"
        },

        ]
    },
];

const filterObject = permissionObj.reduce((a, c) => {
    for (const key in c) {
        a[key] = c[key];
    }
    return a;
},{});


const result = PubSidebar.reduce((a, c)=> {
    if (filterObject[c.label] && c.value
        && filterObject[c.label].some(s => s.value == c.value) ) {
        a.push(c);
    }
    else if (c.content.some(s => filterObject[s.key]) && c.content) {
        c.content = c.content.filter(f => filterObject[f.key]
            && filterObject[f.key].some(s => s.value == f.value));
        a.push(c);
    }
    return a;
}, [])
console.log(result);