From f05607d4c0d7d3c765cb9253d16e44c7182f64cc Mon Sep 17 00:00:00 2001 From: Eric Leijonmarck Date: Thu, 21 Nov 2019 11:44:46 +0100 Subject: [PATCH] UserTableView: Show user name in table view (#18108) * refactor to multiple rows * added name for org user struct * added name getorgusers * added user name to tableview * made test pass * updated userMocks to user name field * added missing UsersTable snapshot * added name on teammembers page, be able to search query for name, login and email * added the updated snapshots * conform to same sorting as output form * conform to previous way of using it * sort first by login and after by email, as it was before --- pkg/models/org_user.go | 1 + pkg/models/team_member.go | 1 + pkg/services/sqlstore/org_users.go | 10 +++++++- pkg/services/sqlstore/team.go | 12 +++++++++- .../app/features/teams/TeamMemberRow.test.tsx | 3 ++- public/app/features/teams/TeamMemberRow.tsx | 1 + public/app/features/teams/TeamMembers.tsx | 3 ++- .../app/features/teams/__mocks__/teamMocks.ts | 2 ++ .../__snapshots__/TeamMemberRow.test.tsx.snap | 12 ++++++++++ .../__snapshots__/TeamMembers.test.tsx.snap | 15 ++++++++++-- public/app/features/teams/state/selectors.ts | 2 +- public/app/features/users/UsersActionBar.tsx | 2 +- public/app/features/users/UsersTable.tsx | 2 ++ .../app/features/users/__mocks__/userMocks.ts | 2 ++ .../UsersActionBar.test.tsx.snap | 8 +++---- .../__snapshots__/UsersTable.test.tsx.snap | 24 +++++++++++++++++++ public/app/features/users/state/selectors.ts | 2 +- public/app/types/teams.ts | 1 + public/app/types/user.ts | 1 + 19 files changed, 91 insertions(+), 13 deletions(-) diff --git a/pkg/models/org_user.go b/pkg/models/org_user.go index 356375589b8..4411a7fc8b5 100644 --- a/pkg/models/org_user.go +++ b/pkg/models/org_user.go @@ -111,6 +111,7 @@ type OrgUserDTO struct { OrgId int64 `json:"orgId"` UserId int64 `json:"userId"` Email string `json:"email"` + Name string `json:"name"` AvatarUrl string `json:"avatarUrl"` Login string `json:"login"` Role string `json:"role"` diff --git a/pkg/models/team_member.go b/pkg/models/team_member.go index 6e17872a072..1ad8dd97e84 100644 --- a/pkg/models/team_member.go +++ b/pkg/models/team_member.go @@ -70,6 +70,7 @@ type TeamMemberDTO struct { External bool `json:"-"` AuthModule string `json:"auth_module"` Email string `json:"email"` + Name string `json:"name"` Login string `json:"login"` AvatarUrl string `json:"avatarUrl"` Labels []string `json:"labels"` diff --git a/pkg/services/sqlstore/org_users.go b/pkg/services/sqlstore/org_users.go index 897ef0ea1ad..3d94f702dda 100644 --- a/pkg/services/sqlstore/org_users.go +++ b/pkg/services/sqlstore/org_users.go @@ -120,7 +120,15 @@ func GetOrgUsers(query *m.GetOrgUsersQuery) error { sess.Limit(query.Limit, 0) } - sess.Cols("org_user.org_id", "org_user.user_id", "user.email", "user.login", "org_user.role", "user.last_seen_at") + sess.Cols( + "org_user.org_id", + "org_user.user_id", + "user.email", + "user.name", + "user.login", + "org_user.role", + "user.last_seen_at", + ) sess.Asc("user.email", "user.login") if err := sess.Find(&query.Result); err != nil { diff --git a/pkg/services/sqlstore/team.go b/pkg/services/sqlstore/team.go index 7697a59ba90..d411a6a11d6 100644 --- a/pkg/services/sqlstore/team.go +++ b/pkg/services/sqlstore/team.go @@ -387,7 +387,17 @@ func GetTeamMembers(query *models.GetTeamMembersQuery) error { if query.External { sess.Where("team_member.external=?", dialect.BooleanStr(true)) } - sess.Cols("team_member.org_id", "team_member.team_id", "team_member.user_id", "user.email", "user.login", "team_member.external", "team_member.permission", "user_auth.auth_module") + sess.Cols( + "team_member.org_id", + "team_member.team_id", + "team_member.user_id", + "user.email", + "user.name", + "user.login", + "team_member.external", + "team_member.permission", + "user_auth.auth_module", + ) sess.Asc("user.login", "user.email") err := sess.Find(&query.Result) diff --git a/public/app/features/teams/TeamMemberRow.test.tsx b/public/app/features/teams/TeamMemberRow.test.tsx index e90ff38b346..f09d4d7742a 100644 --- a/public/app/features/teams/TeamMemberRow.test.tsx +++ b/public/app/features/teams/TeamMemberRow.test.tsx @@ -74,8 +74,9 @@ describe('Functions', () => { teamId: 2, avatarUrl: '', email: 'user@user.org', - labels: [], login: 'member', + name: 'member', + labels: [], permission: TeamPermissionLevel.Member, }; const { instance } = setup({ member }); diff --git a/public/app/features/teams/TeamMemberRow.tsx b/public/app/features/teams/TeamMemberRow.tsx index f6e1a7ecdeb..a22b0cac531 100644 --- a/public/app/features/teams/TeamMemberRow.tsx +++ b/public/app/features/teams/TeamMemberRow.tsx @@ -82,6 +82,7 @@ export class TeamMemberRow extends PureComponent { {member.login} {member.email} + {member.name} {this.renderPermissions(member)} {syncEnabled && this.renderLabels(member.labels)} diff --git a/public/app/features/teams/TeamMembers.tsx b/public/app/features/teams/TeamMembers.tsx index 05e5c6a6375..1f48988d983 100644 --- a/public/app/features/teams/TeamMembers.tsx +++ b/public/app/features/teams/TeamMembers.tsx @@ -115,8 +115,9 @@ export class TeamMembers extends PureComponent { - Name + Login Email + Name Permission diff --git a/public/app/features/teams/__mocks__/teamMocks.ts b/public/app/features/teams/__mocks__/teamMocks.ts index abaa5ef555f..56d1626006e 100644 --- a/public/app/features/teams/__mocks__/teamMocks.ts +++ b/public/app/features/teams/__mocks__/teamMocks.ts @@ -36,6 +36,7 @@ export const getMockTeamMembers = (amount: number, teamAdminId: number): TeamMem teamId: 1, avatarUrl: 'some/url/', email: 'test@test.com', + name: 'testName', login: `testUser-${i}`, labels: ['label 1', 'label 2'], permission: i === teamAdminId ? TeamPermissionLevel.Admin : TeamPermissionLevel.Member, @@ -51,6 +52,7 @@ export const getMockTeamMember = (): TeamMember => { teamId: 1, avatarUrl: 'some/url/', email: 'test@test.com', + name: 'testName', login: 'testUser', labels: [], permission: TeamPermissionLevel.Member, diff --git a/public/app/features/teams/__snapshots__/TeamMemberRow.test.tsx.snap b/public/app/features/teams/__snapshots__/TeamMemberRow.test.tsx.snap index 3f33ab7bf63..630fd712da4 100644 --- a/public/app/features/teams/__snapshots__/TeamMemberRow.test.tsx.snap +++ b/public/app/features/teams/__snapshots__/TeamMemberRow.test.tsx.snap @@ -18,6 +18,9 @@ exports[`Render should render team members when sync enabled 1`] = ` test@test.com + + testName + @@ -71,6 +74,9 @@ exports[`Render when feature toggle editorsCanAdmin is turned off should not ren test@test.com + + testName + @@ -157,6 +163,9 @@ exports[`Render when feature toggle editorsCanAdmin is turned on should render p test@test.com + + testName + @@ -243,6 +252,9 @@ exports[`Render when feature toggle editorsCanAdmin is turned on should render s test@test.com + + testName + diff --git a/public/app/features/teams/__snapshots__/TeamMembers.test.tsx.snap b/public/app/features/teams/__snapshots__/TeamMembers.test.tsx.snap index cf68d79a79c..a1e15069de3 100644 --- a/public/app/features/teams/__snapshots__/TeamMembers.test.tsx.snap +++ b/public/app/features/teams/__snapshots__/TeamMembers.test.tsx.snap @@ -64,11 +64,14 @@ exports[`Render should render component 1`] = ` - Name + Login Email + + Name + @@ -155,11 +158,14 @@ exports[`Render should render team members 1`] = ` - Name + Login Email + + Name + @@ -189,6 +195,7 @@ exports[`Render should render team members 1`] = ` "label 2", ], "login": "testUser-1", + "name": "testName", "permission": 0, "teamId": 1, "userId": 1, @@ -209,6 +216,7 @@ exports[`Render should render team members 1`] = ` "label 2", ], "login": "testUser-2", + "name": "testName", "permission": 0, "teamId": 1, "userId": 2, @@ -229,6 +237,7 @@ exports[`Render should render team members 1`] = ` "label 2", ], "login": "testUser-3", + "name": "testName", "permission": 0, "teamId": 1, "userId": 3, @@ -249,6 +258,7 @@ exports[`Render should render team members 1`] = ` "label 2", ], "login": "testUser-4", + "name": "testName", "permission": 0, "teamId": 1, "userId": 4, @@ -269,6 +279,7 @@ exports[`Render should render team members 1`] = ` "label 2", ], "login": "testUser-5", + "name": "testName", "permission": 4, "teamId": 1, "userId": 5, diff --git a/public/app/features/teams/state/selectors.ts b/public/app/features/teams/state/selectors.ts index 0656c59991e..45603f0033f 100644 --- a/public/app/features/teams/state/selectors.ts +++ b/public/app/features/teams/state/selectors.ts @@ -26,7 +26,7 @@ export const getTeamMembers = (state: TeamState) => { const regex = RegExp(state.searchMemberQuery, 'i'); return state.members.filter(member => { - return regex.test(member.login) || regex.test(member.email); + return regex.test(member.login) || regex.test(member.email) || regex.test(member.name); }); }; diff --git a/public/app/features/users/UsersActionBar.tsx b/public/app/features/users/UsersActionBar.tsx index 9063960eff0..f31384f823b 100644 --- a/public/app/features/users/UsersActionBar.tsx +++ b/public/app/features/users/UsersActionBar.tsx @@ -49,7 +49,7 @@ export class UsersActionBar extends PureComponent { inputClassName="gf-form-input width-20" value={searchQuery} onChange={setUsersSearchQuery} - placeholder="Filter by name or type" + placeholder="Filter by email, login or name" /> {pendingInvitesCount > 0 && (
diff --git a/public/app/features/users/UsersTable.tsx b/public/app/features/users/UsersTable.tsx index 7315adcfa60..e393ad0260a 100644 --- a/public/app/features/users/UsersTable.tsx +++ b/public/app/features/users/UsersTable.tsx @@ -17,6 +17,7 @@ const UsersTable: FC = props => { Login Email + Name Seen Role @@ -33,6 +34,7 @@ const UsersTable: FC = props => { {user.email} + {user.name} {user.lastSeenAtAge}
diff --git a/public/app/features/users/__mocks__/userMocks.ts b/public/app/features/users/__mocks__/userMocks.ts index ef38aab8dd5..7ca8ea71bd8 100644 --- a/public/app/features/users/__mocks__/userMocks.ts +++ b/public/app/features/users/__mocks__/userMocks.ts @@ -5,6 +5,7 @@ export const getMockUsers = (amount: number) => { users.push({ avatarUrl: 'url/to/avatar', email: `user-${i}@test.com`, + name: `user-${i} test`, lastSeenAt: '2018-10-01', lastSeenAtAge: '', login: `user-${i}`, @@ -21,6 +22,7 @@ export const getMockUser = () => { return { avatarUrl: 'url/to/avatar', email: `user@test.com`, + name: 'user test', lastSeenAt: '2018-10-01', lastSeenAtAge: '', login: `user`, diff --git a/public/app/features/users/__snapshots__/UsersActionBar.test.tsx.snap b/public/app/features/users/__snapshots__/UsersActionBar.test.tsx.snap index 5ce1638fc1a..f94225348f4 100644 --- a/public/app/features/users/__snapshots__/UsersActionBar.test.tsx.snap +++ b/public/app/features/users/__snapshots__/UsersActionBar.test.tsx.snap @@ -11,7 +11,7 @@ exports[`Render should render component 1`] = ` inputClassName="gf-form-input width-20" labelClassName="gf-form--has-input-icon" onChange={[MockFunction]} - placeholder="Filter by name or type" + placeholder="Filter by email, login or name" value="" />
Email + + Name + Seen @@ -45,6 +48,9 @@ exports[`Render should render users table 1`] = ` Email + + Name + Seen @@ -82,6 +88,9 @@ exports[`Render should render users table 1`] = ` user-0@test.com + + user-0 test +
+ + user-1 test +
+ + user-2 test +
+ + user-3 test +
+ + user-4 test +
+ + user-5 test +
{ const regex = new RegExp(state.searchQuery, 'i'); return state.users.filter(user => { - return regex.test(user.login) || regex.test(user.email); + return regex.test(user.login) || regex.test(user.email) || regex.test(user.name); }); }; diff --git a/public/app/types/teams.ts b/public/app/types/teams.ts index 707ff97b738..7c247705289 100644 --- a/public/app/types/teams.ts +++ b/public/app/types/teams.ts @@ -14,6 +14,7 @@ export interface TeamMember { teamId: number; avatarUrl: string; email: string; + name: string; login: string; labels: string[]; permission: number; diff --git a/public/app/types/user.ts b/public/app/types/user.ts index 77ded384778..095a7885a26 100644 --- a/public/app/types/user.ts +++ b/public/app/types/user.ts @@ -6,6 +6,7 @@ export interface OrgUser { lastSeenAt: string; lastSeenAtAge: string; login: string; + name: string; orgId: number; role: string; userId: number;