From c68603a5734184f414d7c2feb73197d0f25acf5d Mon Sep 17 00:00:00 2001
From: Alex Khomenko <Clarity-89@users.noreply.github.com>
Date: Wed, 4 Jan 2023 14:08:03 +0200
Subject: [PATCH] Teams: Use generated TS types (#60618)

* Teams: Use generated TS types

* Teams: Update types usage

* Teams: Update types import

* Teams: Move metadata to mock function

* Teams: Move TeamDTO to types

* Update kind
---
 kinds/structured/team/team_kind.cue           |  2 +-
 .../grafana-data/src/types/accesscontrol.ts   |  4 +---
 .../src/raw/team/x/team_types.gen.ts          |  1 +
 pkg/kinds/team/team_types_gen.go              |  2 ++
 .../profile/UserProfileEditPage.test.tsx      |  6 ++---
 .../features/profile/state/reducers.test.ts   | 23 +++---------------
 public/app/features/teams/CreateTeam.tsx      |  7 +-----
 public/app/features/teams/TeamListRow.tsx     |  4 ++--
 public/app/features/teams/TeamSettings.tsx    |  2 +-
 .../app/features/teams/__mocks__/teamMocks.ts | 24 +++++++++----------
 public/app/features/teams/state/navModel.ts   |  4 ++++
 public/app/types/acl.ts                       | 16 ++++++-------
 public/app/types/teams.ts                     | 16 +++++--------
 13 files changed, 44 insertions(+), 67 deletions(-)

diff --git a/kinds/structured/team/team_kind.cue b/kinds/structured/team/team_kind.cue
index c4ead8ceb29..a7214bd2082 100644
--- a/kinds/structured/team/team_kind.cue
+++ b/kinds/structured/team/team_kind.cue
@@ -27,7 +27,7 @@ lineage: seqs: [
 				// Updated indicates when the team was updated.
 				updated: int64 @grafanamaturity(ToMetadata="sys")
 
-				#Permission: 1 | 2 | 4 @cuetsy(kind="enum",memberNames="Viewer|Editor|Admin")
+				#Permission: 0 | 1 | 2 | 4 @cuetsy(kind="enum",memberNames="Member|Viewer|Editor|Admin")
 			},
 		]
 	},
diff --git a/packages/grafana-data/src/types/accesscontrol.ts b/packages/grafana-data/src/types/accesscontrol.ts
index 22c2be37250..e2afc5c335c 100644
--- a/packages/grafana-data/src/types/accesscontrol.ts
+++ b/packages/grafana-data/src/types/accesscontrol.ts
@@ -1,5 +1,3 @@
-import { KeyValue } from '.';
-
 /**
  * With RBAC, the backend will return additional access control metadata to objects.
  * These metadata will contain user permissions associated to a given resource.
@@ -10,5 +8,5 @@ import { KeyValue } from '.';
  * }
  */
 export interface WithAccessControlMetadata {
-  accessControl?: KeyValue<boolean>;
+  accessControl?: Record<string, boolean>;
 }
diff --git a/packages/grafana-schema/src/raw/team/x/team_types.gen.ts b/packages/grafana-schema/src/raw/team/x/team_types.gen.ts
index 177c10168a5..a8de8427106 100644
--- a/packages/grafana-schema/src/raw/team/x/team_types.gen.ts
+++ b/packages/grafana-schema/src/raw/team/x/team_types.gen.ts
@@ -11,6 +11,7 @@
 export enum Permission {
   Admin = 4,
   Editor = 2,
+  Member = 0,
   Viewer = 1,
 }
 
diff --git a/pkg/kinds/team/team_types_gen.go b/pkg/kinds/team/team_types_gen.go
index c38820d7667..7e865831869 100644
--- a/pkg/kinds/team/team_types_gen.go
+++ b/pkg/kinds/team/team_types_gen.go
@@ -12,6 +12,8 @@ package team
 
 // Defines values for Permission.
 const (
+	PermissionN0 Permission = 0
+
 	PermissionN1 Permission = 1
 
 	PermissionN2 Permission = 2
diff --git a/public/app/features/profile/UserProfileEditPage.test.tsx b/public/app/features/profile/UserProfileEditPage.test.tsx
index 31ecb2d0fad..791b7a48efc 100644
--- a/public/app/features/profile/UserProfileEditPage.test.tsx
+++ b/public/app/features/profile/UserProfileEditPage.test.tsx
@@ -11,6 +11,7 @@ import TestProvider from '../../../test/helpers/TestProvider';
 import { backendSrv } from '../../core/services/backend_srv';
 import { configureStore } from '../../store/configureStore';
 import { TeamPermissionLevel } from '../../types';
+import { getMockTeam } from '../teams/__mocks__/teamMocks';
 
 import { Props, UserProfileEditPage } from './UserProfileEditPage';
 import { initialUserState } from './state/reducers';
@@ -27,14 +28,13 @@ const defaultProps: Props = {
     orgId: 0,
   },
   teams: [
-    {
-      id: 0,
+    getMockTeam(0, {
       name: 'Team One',
       email: 'team.one@test.com',
       avatarUrl: '/avatar/07d881f402480a2a511a9a15b5fa82c0',
       memberCount: 2000,
       permission: TeamPermissionLevel.Admin,
-    },
+    }),
   ],
   orgs: [
     {
diff --git a/public/app/features/profile/state/reducers.test.ts b/public/app/features/profile/state/reducers.test.ts
index 6993b46283d..766bbfca5ab 100644
--- a/public/app/features/profile/state/reducers.test.ts
+++ b/public/app/features/profile/state/reducers.test.ts
@@ -1,5 +1,6 @@
 import { reducerTester } from '../../../../test/core/redux/reducerTester';
 import { OrgRole, TeamPermissionLevel } from '../../../types';
+import { getMockTeam } from '../../teams/__mocks__/teamMocks';
 
 import {
   initialUserState,
@@ -89,31 +90,13 @@ describe('userReducer', () => {
         .givenReducer(userReducer, { ...initialUserState, teamsAreLoading: true })
         .whenActionIsDispatched(
           teamsLoaded({
-            teams: [
-              {
-                id: 1,
-                email: 'team@team.com',
-                name: 'Team',
-                avatarUrl: '/avatar/12345',
-                memberCount: 4,
-                permission: TeamPermissionLevel.Admin,
-              },
-            ],
+            teams: [getMockTeam(1, { permission: TeamPermissionLevel.Admin })],
           })
         )
         .thenStateShouldEqual({
           ...initialUserState,
           teamsAreLoading: false,
-          teams: [
-            {
-              id: 1,
-              email: 'team@team.com',
-              name: 'Team',
-              avatarUrl: '/avatar/12345',
-              memberCount: 4,
-              permission: TeamPermissionLevel.Admin,
-            },
-          ],
+          teams: [getMockTeam(1, { permission: TeamPermissionLevel.Admin })],
         });
     });
   });
diff --git a/public/app/features/teams/CreateTeam.tsx b/public/app/features/teams/CreateTeam.tsx
index 5b38b77a367..90a846cecc6 100644
--- a/public/app/features/teams/CreateTeam.tsx
+++ b/public/app/features/teams/CreateTeam.tsx
@@ -8,12 +8,7 @@ import { TeamRolePicker } from 'app/core/components/RolePicker/TeamRolePicker';
 import { updateTeamRoles } from 'app/core/components/RolePicker/api';
 import { useRoleOptions } from 'app/core/components/RolePicker/hooks';
 import { contextSrv } from 'app/core/core';
-import { AccessControlAction, Role } from 'app/types';
-
-interface TeamDTO {
-  email: string;
-  name: string;
-}
+import { AccessControlAction, Role, TeamDTO } from 'app/types';
 
 const pageNav: NavModelItem = {
   icon: 'users-alt',
diff --git a/public/app/features/teams/TeamListRow.tsx b/public/app/features/teams/TeamListRow.tsx
index ad7fc7f6c9e..b0a05e96a8b 100644
--- a/public/app/features/teams/TeamListRow.tsx
+++ b/public/app/features/teams/TeamListRow.tsx
@@ -35,11 +35,11 @@ export const TeamListRow = ({ team, roleOptions, isTeamAdmin, displayRolePicker,
       </td>
       <td className="link-td">
         {canReadTeam ? (
-          <a href={teamUrl} aria-label={team.email?.length > 0 ? undefined : 'Empty email cell'}>
+          <a href={teamUrl} aria-label={team.email || 'Empty email cell'}>
             {team.email}
           </a>
         ) : (
-          <div style={{ padding: '0px 8px' }} aria-label={team.email?.length > 0 ? undefined : 'Empty email cell'}>
+          <div style={{ padding: '0px 8px' }} aria-label={team.email || 'Empty email cell'}>
             {team.email}
           </div>
         )}
diff --git a/public/app/features/teams/TeamSettings.tsx b/public/app/features/teams/TeamSettings.tsx
index 7e652ab1970..e6e4dd55b05 100644
--- a/public/app/features/teams/TeamSettings.tsx
+++ b/public/app/features/teams/TeamSettings.tsx
@@ -41,7 +41,7 @@ export const TeamSettings: FC<Props> = ({ team, updateTeam }) => {
           if (contextSrv.licensedAccessControlEnabled() && canUpdateRoles) {
             await updateTeamRoles(pendingRoles, team.id);
           }
-          updateTeam(formTeam.name, formTeam.email);
+          updateTeam(formTeam.name, formTeam.email || '');
         }}
         disabled={!canWriteTeamSettings}
       >
diff --git a/public/app/features/teams/__mocks__/teamMocks.ts b/public/app/features/teams/__mocks__/teamMocks.ts
index 56d1626006e..7e80354880d 100644
--- a/public/app/features/teams/__mocks__/teamMocks.ts
+++ b/public/app/features/teams/__mocks__/teamMocks.ts
@@ -3,27 +3,25 @@ import { Team, TeamGroup, TeamMember, TeamPermissionLevel } from 'app/types';
 export const getMultipleMockTeams = (numberOfTeams: number): Team[] => {
   const teams: Team[] = [];
   for (let i = 1; i <= numberOfTeams; i++) {
-    teams.push({
-      id: i,
-      name: `test-${i}`,
-      avatarUrl: 'some/url/',
-      email: `test-${i}@test.com`,
-      memberCount: i,
-      permission: TeamPermissionLevel.Member,
-    });
+    teams.push(getMockTeam(i));
   }
 
   return teams;
 };
 
-export const getMockTeam = (): Team => {
+export const getMockTeam = (i = 1, overrides = {}): Team => {
   return {
-    id: 1,
-    name: 'test',
+    id: i,
+    name: `test-${i}`,
     avatarUrl: 'some/url/',
-    email: 'test@test.com',
-    memberCount: 1,
+    email: `test-${i}@test.com`,
+    memberCount: i,
     permission: TeamPermissionLevel.Member,
+    accessControl: { isEditor: false },
+    created: 0,
+    orgId: 0,
+    updated: 0,
+    ...overrides,
   };
 };
 
diff --git a/public/app/features/teams/state/navModel.ts b/public/app/features/teams/state/navModel.ts
index bdfb6a01231..2ed6e36d895 100644
--- a/public/app/features/teams/state/navModel.ts
+++ b/public/app/features/teams/state/navModel.ts
@@ -13,6 +13,10 @@ const loadingTeam = {
   email: 'loading',
   memberCount: 0,
   permission: TeamPermissionLevel.Member,
+  accessControl: { isEditor: false },
+  created: 0,
+  orgId: 0,
+  updated: 0,
 };
 
 export function buildNavModel(team: Team): NavModelItem {
diff --git a/public/app/types/acl.ts b/public/app/types/acl.ts
index 4a74db51adf..f603bf5dd20 100644
--- a/public/app/types/acl.ts
+++ b/public/app/types/acl.ts
@@ -1,3 +1,8 @@
+import { Permission } from '@grafana/schema';
+
+// Alias to an existing type to reduce the number of changes
+export { Permission as TeamPermissionLevel };
+
 export enum OrgRole {
   Viewer = 'Viewer',
   Editor = 'Editor',
@@ -111,21 +116,16 @@ export const dashboardPermissionLevels: DashboardPermissionInfo[] = [
   },
 ];
 
-export enum TeamPermissionLevel {
-  Member = 0,
-  Admin = 4,
-}
-
 export interface TeamPermissionInfo {
-  value: TeamPermissionLevel;
+  value: Permission;
   label: string;
   description: string;
 }
 
 export const teamsPermissionLevels: TeamPermissionInfo[] = [
-  { value: TeamPermissionLevel.Member, label: 'Member', description: 'Is team member' },
+  { value: Permission.Member, label: 'Member', description: 'Is team member' },
   {
-    value: TeamPermissionLevel.Admin,
+    value: Permission.Admin,
     label: 'Admin',
     description: 'Can add/remove permissions, members and delete team.',
   },
diff --git a/public/app/types/teams.ts b/public/app/types/teams.ts
index 07617caaa0a..2df78c6e231 100644
--- a/public/app/types/teams.ts
+++ b/public/app/types/teams.ts
@@ -1,16 +1,12 @@
-import { WithAccessControlMetadata } from '@grafana/data';
+import { Team as TeamBase } from '@grafana/schema';
 
-import { TeamPermissionLevel } from './acl';
-
-export interface Team extends WithAccessControlMetadata {
-  id: number;
-  name: string;
-  avatarUrl: string;
-  email: string;
-  memberCount: number;
-  permission: TeamPermissionLevel;
+export interface Team extends TeamBase {
+  id: number; // TODO switch to UUID
 }
 
+// Represents the data sent via an API to create a team
+export interface TeamDTO extends Pick<TeamBase, 'name' | 'email'> {}
+
 export interface TeamMember {
   userId: number;
   teamId: number;