Доступ к меню по различным ролям в проекте на VueJs?

Question

[Sashqa]

Как правильнее реализовать подобный функционал?
Сейчас при логине отправляется запрос на бек и в ответе содержится текущая роль пользователя и роль его компании.

Пункты меню выглядят примерно так

[
    {
        title: 'title',
        href: 'url',
        companyRoles: ['role1', 'role2'],
        userRoles: ['userRole1', 'userRole2'],
    }
]

Метод для создания меню

export default createMenu(menuItems, userProfile) {
    return userProfile ? menuItems.filter(match(userProfile)) : []
}
const match = (userProfile) => (item) => rules.every(f => f(userProfile, item))

const rules = [check1, check2, etc] // передаем проверки

Собственно вопрос, как можно это сделать более гибким и лаконичным. Есть какие-то примеры?

Answer 1

[Evgeny Kulakov]

Есть готовые решения для подобных дел, типа такого: https://github.com/stalniy/casl
Но в целом, свой велосипед иногда не плохая идея - нет лишней зависимости, гибкость зависит от вас.

Comments

[Sashqa]

Да, по итогу оставил свое решение. Спасибо