clients icon indicating copy to clipboard operation
clients copied to clipboard

Restructure the `org-permissions` guard to be Angular 17+ compliant

Open addisonbeck opened this issue 3 weeks ago â€ĸ 3 comments

Restructure the org-permissions guard to be Angular 17+ compliant

🎟ī¸ Tracking

https://bitwarden.atlassian.net/browse/AC-2759

📔 Objective

In the web vault: in order to support Angular versions 17 and higher we must restructure the way organization landing page URL redirects are written and configured.

Currently most URL guards in the Bitwarden Angular clients are written as router guard classes. The base CanActivate / CanDeactivate classes have been deprecated by the Angular team and are subject to removal. See the Angular deprecation notice for details.

At the time of writing, platform team has already completed this work for their guards here. Any guard declarations are swapped from exporting a class to exporting a function, and the function is added to CanActivate arrays in routers the same way the classes already are. There are some other guards that are already function based scattered throughout the codebase that can also be used as examples for style, like auth team's lock guard.

This PR achieves this goal for the org-permissions guard.

This change should result in no functional changes to the system. It is purely a code restructure to comply with a deprecation in Angular.

This ticket applies to urls that are:

  1. Subroutes of <https://THE_WEB_VAULT/organizations/{id}/>
  2. <https://THE_WEB_VAULT/sm/settings/import>
  3. <https://THE_WEB_VAULT/sm/settings/export>

ℹī¸ There are many subroutes of organizations/{id}, too many to list at once and test individually. If specific examples are needed for testing please reach out to development.

For URLs that are subject to this guard the following rules apply:

  1. If the organizationId route parameter is not set or is not valid for the user then the user is redirected to /
  2. There is a special case to support linkable ciphers. If the user fails the permission check, meaning they can not access the admin console, but a cipher id is found in the route parameters the user is redirected to /vault with the item id passed along.
  3. If the required permissions are found navigation proceeds as normal. If the required permissions are not found the user should be redirected to /organizations/{id} or / depending on whether or not they have access to the admin console at all.

📸 Screenshots

Organization ID Not Found

In this example I try to access an organization ID that isn't found in the logged in user's organizations, and am redirected back to the home screen

https://github.com/bitwarden/clients/assets/15897251/29d70801-30fa-4f2a-bd1d-e135622261f5

Linkable Ciphers

In this example I have view access to a cipher that I have a link to from the admin console. Instead of breaking, or being send to the admin console, I am redirected to the cipher in my vault.

https://github.com/bitwarden/clients/assets/15897251/f98d851d-5982-41a1-b9ae-adf602f248f7

Permission Denied

In this example I am an organization user that can manage groups, but I try to access the members screen from the URL bar and am blocked.

https://github.com/bitwarden/clients/assets/15897251/81d4117f-d793-4a64-9824-0171895718c5

⏰ Reminders before review

  • Contributor guidelines followed
  • All formatters and local linters executed and passed
  • Written new unit and / or integration tests where applicable
  • Protected functional changes with optionality (feature flags)
  • Used internationalization (i18n) for all UI strings
  • CI builds passed
  • Communicated to DevOps any deployment requirements
  • Updated any necessary documentation (Confluence, contributing docs) or informed the documentation team

đŸĻŽ Reviewer guidelines

  • 👍 (:+1:) or similar for great changes
  • 📝 (:memo:) or ℹī¸ (:information_source:) for notes or general info
  • ❓ (:question:) for questions
  • 🤔 (:thinking:) or 💭 (:thought_balloon:) for more open inquiry that's not quite a confirmed issue and could potentially benefit from discussion
  • 🎨 (:art:) for suggestions / improvements
  • ❌ (:x:) or ⚠ī¸ (:warning:) for more significant problems or concerns needing attention
  • 🌱 (:seedling:) or â™ģī¸ (:recycle:) for future improvements or indications of technical debt
  • ⛏ (:pick:) for minor or nitpick changes

addisonbeck avatar Jun 13 '24 18:06 addisonbeck