Filter recursive array

Question

I am trying to find the best way (minimal code) to filter a recursive list of items based on some condition. The list describes some navigation that contains multiple sections and each section contains navigation items (where each navigation item can contain a recursive amount of navigation items).

Example:

const navSections = [{
    title: 'Section A',
    items: [
        {
            title: 'A1',
            permission: 'Moderator'
        },
        {
            title: 'A2',
            permission: 'Moderator',
            items: [{
                title: 'A21',
                permission: 'Admin'
            },
            {
                title: 'A22',
                permission: 'Admin'
            }]
        }]
},
{
    title: 'Section B',
    items: [
        {
            title: 'B1',
            permission: 'User'
        },
        {
            title: 'B2',
            permission: 'User'
        },
        {
            title: 'B3',
            permission: 'Admin'
        }]
}]

The user has an array of permissions and I want to filter out all items that are not in the set of permissions of the user.

const userPermissions = ['Moderator', 'User']

I am not searching for a solution that simply loops through the elements; I can code that myself.

Should we not call this "nested" rather than "recursive"? I'm not trying to be smartypants - genuine question. :) — Nicolas Goosen
– Nicolas Goosen, Commented May 17, 2022 at 15:28
Regarding your last sentence: so you're looking for a "functional" style, rather than "iterative" one... — Nicolas Goosen
– Nicolas Goosen, Commented May 17, 2022 at 15:30
Yes, exactly! If I had to guess, there is probably a neat solution using .reduce @NicolasGoosen — Tom el Safadi
– Tom el Safadi, Commented May 17, 2022 at 15:31
Check out these answers: stackoverflow.com/questions/38375646/… — Nicolas Goosen
– Nicolas Goosen, Commented May 17, 2022 at 15:31

Yosvel Quintero · Accepted Answer · 2022-05-17 16:19:00Z

1

Check this:

const navSections = [{title: 'Section A',items: [{title: 'A1',permission: 'Moderator',},{title: 'A2',permission: 'Moderator',items: [{title: 'A21',permission: 'Admin',},{title: 'A22',permission: 'Admin',}]}]},{title: 'Section B',items: [{title: 'B1',permission: 'User',},{title: 'B2',permission: 'User',},{title: 'B3',permission: 'Admin',}]}]

const userPermissions = ['Moderator', 'User']

const navSectionsByPermissions = (arr, permissions, isBase = true) =>
  arr.filter(o => {
    if (o.items) {
      o.items = navSectionsByPermissions(o.items, permissions, false)
    }
    return o.permission && permissions.includes(o.permission) || isBase
  })
  
const result = navSectionsByPermissions(navSections, userPermissions)

console.log(result)

.as-console-wrapper { max-height: 100% !important; top: 0; }

edited May 17, 2022 at 16:19

answered May 17, 2022 at 15:56

Yosvel Quintero

19.1k5 gold badges39 silver badges47 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

Tom el Safadi Over a year ago

Great! This is the solution I was looking for. Thanks

Collectives™ on Stack Overflow

Filter recursive array

1 Answer 1

1 Comment

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

1 Comment

Your Answer

Sign up or log in

Post as a guest

Linked

Related