diff --git a/public/app/features/teams/TeamMembers.test.tsx b/public/app/features/teams/TeamMembers.test.tsx index 8584edd86c8..696880bebd9 100644 --- a/public/app/features/teams/TeamMembers.test.tsx +++ b/public/app/features/teams/TeamMembers.test.tsx @@ -12,6 +12,7 @@ const setup = (propOverrides?: object) => { loadTeamMembers: jest.fn(), addTeamMember: jest.fn(), removeTeamMember: jest.fn(), + syncEnabled: false, }; Object.assign(props, propOverrides); @@ -39,6 +40,15 @@ describe('Render', () => { expect(wrapper).toMatchSnapshot(); }); + + it('should render team members when sync enabled', () => { + const { wrapper } = setup({ + members: getMockTeamMembers(5), + syncEnabled: true, + }); + + expect(wrapper).toMatchSnapshot(); + }); }); describe('Functions', () => { diff --git a/public/app/features/teams/TeamMembers.tsx b/public/app/features/teams/TeamMembers.tsx index 38e8c0a9aa0..cda175f4395 100644 --- a/public/app/features/teams/TeamMembers.tsx +++ b/public/app/features/teams/TeamMembers.tsx @@ -3,6 +3,7 @@ import { connect } from 'react-redux'; import SlideDown from 'app/core/components/Animations/SlideDown'; import { UserPicker, User } from 'app/core/components/Picker/UserPicker'; import DeleteButton from 'app/core/components/DeleteButton/DeleteButton'; +import { TagBadge } from 'app/core/components/TagFilter/TagBadge'; import { TeamMember } from '../../types'; import { loadTeamMembers, addTeamMember, removeTeamMember, setSearchMemberQuery } from './state/actions'; import { getSearchMemberQuery, getTeamMembers } from './state/selectors'; @@ -14,6 +15,7 @@ export interface Props { addTeamMember: typeof addTeamMember; removeTeamMember: typeof removeTeamMember; setSearchMemberQuery: typeof setSearchMemberQuery; + syncEnabled: boolean; } export interface State { @@ -52,7 +54,19 @@ export class TeamMembers extends PureComponent { this.setState({ newTeamMember: null }); }; - renderMember(member: TeamMember) { + renderLabels(labels: string[]) { + if (!labels) { + return ; + } + + return ( + + {labels.map(label => {}} />)} + + ); + } + + renderMember(member: TeamMember, syncEnabled: boolean) { return ( @@ -60,6 +74,7 @@ export class TeamMembers extends PureComponent { {member.login} {member.email} + {syncEnabled ? this.renderLabels(member.labels) : ''} this.onRemoveMember(member)} /> @@ -69,7 +84,7 @@ export class TeamMembers extends PureComponent { render() { const { newTeamMember, isAdding } = this.state; - const { searchMemberQuery, members } = this.props; + const { searchMemberQuery, members, syncEnabled } = this.props; const newTeamMemberValue = newTeamMember && newTeamMember.id.toString(); return ( @@ -120,10 +135,11 @@ export class TeamMembers extends PureComponent { Name Email + {syncEnabled ? : ''} - {members && members.map(member => this.renderMember(member))} + {members && members.map(member => this.renderMember(member, syncEnabled))} diff --git a/public/app/features/teams/TeamPages.tsx b/public/app/features/teams/TeamPages.tsx index bbc8b7013ca..3dc5a9f6f15 100644 --- a/public/app/features/teams/TeamPages.tsx +++ b/public/app/features/teams/TeamPages.tsx @@ -63,7 +63,7 @@ export class TeamPages extends PureComponent { switch (currentPage) { case PageTypes.Members: - return ; + return ; case PageTypes.Settings: return ; diff --git a/public/app/features/teams/__mocks__/teamMocks.ts b/public/app/features/teams/__mocks__/teamMocks.ts index c9e9a27bee0..34fa06b2d09 100644 --- a/public/app/features/teams/__mocks__/teamMocks.ts +++ b/public/app/features/teams/__mocks__/teamMocks.ts @@ -35,6 +35,7 @@ export const getMockTeamMembers = (amount: number): TeamMember[] => { avatarUrl: 'some/url/', email: 'test@test.com', login: `testUser-${i}`, + labels: ['label 1', 'label 2'], }); } @@ -48,6 +49,7 @@ export const getMockTeamMember = (): TeamMember => { avatarUrl: 'some/url/', email: 'test@test.com', login: 'testUser', + labels: [], }; }; diff --git a/public/app/features/teams/__snapshots__/TeamMembers.test.tsx.snap b/public/app/features/teams/__snapshots__/TeamMembers.test.tsx.snap index 2a42897e2b9..93e6f2131aa 100644 --- a/public/app/features/teams/__snapshots__/TeamMembers.test.tsx.snap +++ b/public/app/features/teams/__snapshots__/TeamMembers.test.tsx.snap @@ -315,3 +315,305 @@ exports[`Render should render team members 1`] = ` `; + +exports[`Render should render team members when sync enabled 1`] = ` +
+
+
+ +
+
+ +
+ +
+ +
+ Add Team Member +
+
+ +
+
+
+
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
+ + Name + + Email + + +
+ + + testUser-1 + + test@test.com + + + + + +
+ + + testUser-2 + + test@test.com + + + + + +
+ + + testUser-3 + + test@test.com + + + + + +
+ + + testUser-4 + + test@test.com + + + + + +
+ + + testUser-5 + + test@test.com + + + + + +
+
+
+`; diff --git a/public/app/features/teams/__snapshots__/TeamPages.test.tsx.snap b/public/app/features/teams/__snapshots__/TeamPages.test.tsx.snap index 4ce4df4acb2..f32b8211d2c 100644 --- a/public/app/features/teams/__snapshots__/TeamPages.test.tsx.snap +++ b/public/app/features/teams/__snapshots__/TeamPages.test.tsx.snap @@ -29,7 +29,9 @@ exports[`Render should render member page if team not empty 1`] = `
- +
`; diff --git a/public/app/types/teams.ts b/public/app/types/teams.ts index bcf752c86c0..b85ff3833d6 100644 --- a/public/app/types/teams.ts +++ b/public/app/types/teams.ts @@ -12,6 +12,7 @@ export interface TeamMember { avatarUrl: string; email: string; login: string; + labels: string[]; } export interface TeamGroup {