From ed00b3cf5018ee2ef9651ab32c427fcb59fdf0e6 Mon Sep 17 00:00:00 2001
From: "Grot (@grafanabot)" <43478413+grafanabot@users.noreply.github.com>
Date: Fri, 19 Nov 2021 04:15:07 -0500
Subject: [PATCH] Access Control: use role groups in role picker (#41912)
 (#41941)

* use role groups in role picker UI

* Update public/app/core/components/RolePicker/RolePickerMenu.tsx

Co-authored-by: kay delaney <45561153+kaydelaney@users.noreply.github.com>

Co-authored-by: kay delaney <45561153+kaydelaney@users.noreply.github.com>
(cherry picked from commit 11f133b406dd7b4f1e7e6b24b10f116fba8f5eab)

Co-authored-by: Ieva <ieva.vasiljeva@grafana.com>
---
 public/app/core/components/RolePicker/RolePickerMenu.tsx | 3 +--
 public/app/types/accessControl.ts                        | 1 +
 2 files changed, 2 insertions(+), 2 deletions(-)

diff --git a/public/app/core/components/RolePicker/RolePickerMenu.tsx b/public/app/core/components/RolePicker/RolePickerMenu.tsx
index 2742b13488c..9b6d7d62708 100644
--- a/public/app/core/components/RolePicker/RolePickerMenu.tsx
+++ b/public/app/core/components/RolePicker/RolePickerMenu.tsx
@@ -498,8 +498,7 @@ export const RoleMenuGroupOption = React.forwardRef<HTMLDivElement, RoleMenuGrou
 RoleMenuGroupOption.displayName = 'RoleMenuGroupOption';
 
 const getRoleGroup = (role: Role) => {
-  const parts = role.name.split(':');
-  return parts.length > 1 ? parts[1] : '';
+  return role.group ?? 'Other';
 };
 
 const capitalize = (s: string): string => {
diff --git a/public/app/types/accessControl.ts b/public/app/types/accessControl.ts
index 07e987f7329..09c6bc15b18 100644
--- a/public/app/types/accessControl.ts
+++ b/public/app/types/accessControl.ts
@@ -55,6 +55,7 @@ export interface Role {
   name: string;
   displayName: string;
   description: string;
+  group: string;
   global: boolean;
   version: number;
   created: string;