From 3ec2f6b4d10019c757f336f23048342aab835d13 Mon Sep 17 00:00:00 2001
From: Novak Zaballa <41410593+novakzaballa@users.noreply.github.com>
Date: Fri, 29 Sep 2023 08:52:45 -0400
Subject: [PATCH] fix: Shows "Identities" nav element as disabled for users
 without relevant permission (#2813)

---
 frontend/web/components/Aside.js        | 20 ++++++++++++++++----
 frontend/web/styles/project/_utils.scss |  4 ++++
 2 files changed, 20 insertions(+), 4 deletions(-)

diff --git a/frontend/web/components/Aside.js b/frontend/web/components/Aside.js
index 6117aec1643e..184bf05e4198 100644
--- a/frontend/web/components/Aside.js
+++ b/frontend/web/components/Aside.js
@@ -13,6 +13,7 @@ import Permission from 'common/providers/Permission'
 import Icon from './Icon'
 import ProjectSelect from './ProjectSelect'
 import AsideProjectButton from './AsideProjectButton'
+import Constants from 'common/constants'
 
 const Aside = class extends Component {
   static displayName = 'Aside'
@@ -484,21 +485,32 @@ const Aside = class extends Component {
                                                     </span>
                                                   ) : null}
                                                 </NavLink>
-                                                {manageIdentityPermission && (
+                                                {Utils.renderWithPermission(
+                                                  manageIdentityPermission,
+                                                  Constants.environmentPermissions(
+                                                    'View Identities',
+                                                  ),
                                                   <NavLink
                                                     id='users-link'
-                                                    className='aside__environment-list-item mt-1'
+                                                    className={`aside__environment-list-item ${
+                                                      !manageIdentityPermission &&
+                                                      'disabled'
+                                                    } mt-1`}
                                                     exact
                                                     to={`/project/${project.id}/environment/${environment.api_key}/users`}
                                                   >
                                                     <span className='mr-2'>
                                                       <Icon
                                                         name='people'
-                                                        fill='#9DA4AE'
+                                                        fill={
+                                                          manageIdentityPermission
+                                                            ? '#9DA4AE'
+                                                            : '#696969'
+                                                        }
                                                       />
                                                     </span>
                                                     Identities
-                                                  </NavLink>
+                                                  </NavLink>,
                                                 )}
 
                                                 {environmentAdmin && (
diff --git a/frontend/web/styles/project/_utils.scss b/frontend/web/styles/project/_utils.scss
index a53d8a88a74c..7d0d614ff872 100644
--- a/frontend/web/styles/project/_utils.scss
+++ b/frontend/web/styles/project/_utils.scss
@@ -144,6 +144,10 @@
         background-color: rgba(0,0,0,.2);
     }
 }
+.aside__environment-list-item.disabled {
+    color:#696969;
+    pointer-events: none;
+  }
 
 .justify-content-end {
     justify-content: flex-end;