teams: enabled so that user can update permission for team members

eea2dcc6 · Hugo Häggmark · Leonard Gram · 467b7a40 · eea2dcc6 · eea2dcc6
Commit eea2dcc6 authored Mar 08, 2019 by Hugo Häggmark Committed by Leonard Gram Mar 19, 2019
Showing with 61 additions and 17 deletions

public/app/features/teams/TeamMembers.test.tsx
+23 -1

public/app/features/teams/TeamMembers.tsx
+19 -6

public/app/features/teams/__snapshots__/TeamMembers.test.tsx.snap
+10 -10

public/app/features/teams/state/actions.ts
+9 -0

No files found.
--- a/public/app/features/teams/TeamMembers.test.tsx
+++ b/public/app/features/teams/TeamMembers.test.tsx
 import React from 'react';
 import { shallow } from 'enzyme';
 import { TeamMembers, Props, State } from './TeamMembers';
-import { TeamMember } from '../../types';
+import { TeamMember, TeamPermissionLevel } from '../../types';
 import { getMockTeamMember, getMockTeamMembers } from './__mocks__/teamMocks';
+import { SelectOptionItem } from '@grafana/ui';
 const setup = (propOverrides?: object) => {
  const props: Props = {
@@ -12,6 +13,7 @@ const setup = (propOverrides?: object) => {
    loadTeamMembers: jest.fn(),
    addTeamMember: jest.fn(),
    removeTeamMember: jest.fn(),
+    updateTeamMember: jest.fn(),
    syncEnabled: false,
  };
@@ -86,4 +88,24 @@ describe('Functions', () => {
    expect(instance.props.addTeamMember).toHaveBeenCalledWith(1);
  });
+  describe('on update permision for user in team', () => {
+    const { instance } = setup();
+    const permission = TeamPermissionLevel.Admin;
+    const item: SelectOptionItem = { value: permission };
+    const member: TeamMember = {
+      userId: 3,
+      teamId: 2,
+      avatarUrl: '',
+      email: 'user@user.org',
+      labels: [],
+      login: 'member',
+      permission: TeamPermissionLevel.Member,
+    };
+    const expectedTeamMemeber = { ...member, permission };
+    instance.onPermissionChange(item, member);
+    expect(instance.props.updateTeamMember).toHaveBeenCalledWith(expectedTeamMemeber);
+  });
 });
--- a/public/app/features/teams/TeamMembers.tsx
+++ b/public/app/features/teams/TeamMembers.tsx
@@ -2,10 +2,16 @@ import React, { PureComponent } from 'react';
 import { connect } from 'react-redux';
 import SlideDown from 'app/core/components/Animations/SlideDown';
 import { UserPicker } from 'app/core/components/Select/UserPicker';
-import { DeleteButton, Select } from '@grafana/ui';
+import { DeleteButton, Select, SelectOptionItem } from '@grafana/ui';
 import { TagBadge } from 'app/core/components/TagFilter/TagBadge';
 import { TeamMember, User, teamsPermissionLevels } from 'app/types';
-import { loadTeamMembers, addTeamMember, removeTeamMember, setSearchMemberQuery } from './state/actions';
+import {
+  loadTeamMembers,
+  addTeamMember,
+  removeTeamMember,
+  setSearchMemberQuery,
+  updateTeamMember,
+} from './state/actions';
 import { getSearchMemberQuery, getTeamMembers } from './state/selectors';
 import { FilterInput } from 'app/core/components/FilterInput/FilterInput';
 import { WithFeatureToggle } from 'app/core/components/WithFeatureToggle';
@@ -18,6 +24,7 @@ export interface Props {
  addTeamMember: typeof addTeamMember;
  removeTeamMember: typeof removeTeamMember;
  setSearchMemberQuery: typeof setSearchMemberQuery;
+  updateTeamMember: typeof updateTeamMember;
  syncEnabled: boolean;
 }
@@ -71,8 +78,14 @@ export class TeamMembers extends PureComponent<Props, State> {
    );
  }
+  onPermissionChange = (item: SelectOptionItem, member: TeamMember) => {
+    const permission = item.value;
+    const updatedTeamMember = { ...member, permission };
+    this.props.updateTeamMember(updatedTeamMember);
+  };
  renderMember(member: TeamMember, syncEnabled: boolean) {
-    const currentPermissionLevel = teamsPermissionLevels.find(dp => dp.value === member.permission);
    return (
      <tr key={member.userId}>
        <td className="width-4 text-center">
@@ -86,10 +99,9 @@ export class TeamMembers extends PureComponent<Props, State> {
              <Select
                isSearchable={false}
                options={teamsPermissionLevels}
-                onChange={() => {}}
+                onChange={item => this.onPermissionChange(item, member)}
                className="gf-form-select-box__control--menu-right"
-                value={currentPermissionLevel}
+                value={teamsPermissionLevels.find(dp => dp.value === member.permission)}
-                isDisabled={true}
              />
            </div>
          </td>
@@ -176,6 +188,7 @@ const mapDispatchToProps = {
  addTeamMember,
  removeTeamMember,
  setSearchMemberQuery,
+  updateTeamMember,
 };
 export default connect(

--- a/public/app/features/teams/__snapshots__/TeamMembers.test.tsx.snap
+++ b/public/app/features/teams/__snapshots__/TeamMembers.test.tsx.snap
@@ -206,7 +206,7 @@ exports[`Render should render team members 1`] = `
                  backspaceRemovesValue={true}
                  className="gf-form-select-box__control--menu-right"
                  isClearable={false}
-                  isDisabled={true}
+                  isDisabled={false}
                  isLoading={false}
                  isMulti={false}
                  isSearchable={false}
@@ -276,7 +276,7 @@ exports[`Render should render team members 1`] = `
                  backspaceRemovesValue={true}
                  className="gf-form-select-box__control--menu-right"
                  isClearable={false}
-                  isDisabled={true}
+                  isDisabled={false}
                  isLoading={false}
                  isMulti={false}
                  isSearchable={false}
@@ -346,7 +346,7 @@ exports[`Render should render team members 1`] = `
                  backspaceRemovesValue={true}
                  className="gf-form-select-box__control--menu-right"
                  isClearable={false}
-                  isDisabled={true}
+                  isDisabled={false}
                  isLoading={false}
                  isMulti={false}
                  isSearchable={false}
@@ -416,7 +416,7 @@ exports[`Render should render team members 1`] = `
                  backspaceRemovesValue={true}
                  className="gf-form-select-box__control--menu-right"
                  isClearable={false}
-                  isDisabled={true}
+                  isDisabled={false}
                  isLoading={false}
                  isMulti={false}
                  isSearchable={false}
@@ -486,7 +486,7 @@ exports[`Render should render team members 1`] = `
                  backspaceRemovesValue={true}
                  className="gf-form-select-box__control--menu-right"
                  isClearable={false}
-                  isDisabled={true}
+                  isDisabled={false}
                  isLoading={false}
                  isMulti={false}
                  isSearchable={false}
@@ -649,7 +649,7 @@ exports[`Render should render team members when sync enabled 1`] = `
                  backspaceRemovesValue={true}
                  className="gf-form-select-box__control--menu-right"
                  isClearable={false}
-                  isDisabled={true}
+                  isDisabled={false}
                  isLoading={false}
                  isMulti={false}
                  isSearchable={false}
@@ -735,7 +735,7 @@ exports[`Render should render team members when sync enabled 1`] = `
                  backspaceRemovesValue={true}
                  className="gf-form-select-box__control--menu-right"
                  isClearable={false}
-                  isDisabled={true}
+                  isDisabled={false}
                  isLoading={false}
                  isMulti={false}
                  isSearchable={false}
@@ -821,7 +821,7 @@ exports[`Render should render team members when sync enabled 1`] = `
                  backspaceRemovesValue={true}
                  className="gf-form-select-box__control--menu-right"
                  isClearable={false}
-                  isDisabled={true}
+                  isDisabled={false}
                  isLoading={false}
                  isMulti={false}
                  isSearchable={false}
@@ -907,7 +907,7 @@ exports[`Render should render team members when sync enabled 1`] = `
                  backspaceRemovesValue={true}
                  className="gf-form-select-box__control--menu-right"
                  isClearable={false}
-                  isDisabled={true}
+                  isDisabled={false}
                  isLoading={false}
                  isMulti={false}
                  isSearchable={false}
@@ -993,7 +993,7 @@ exports[`Render should render team members when sync enabled 1`] = `
                  backspaceRemovesValue={true}
                  className="gf-form-select-box__control--menu-right"
                  isClearable={false}
-                  isDisabled={true}
+                  isDisabled={false}
                  isLoading={false}
                  isMulti={false}
                  isSearchable={false}

--- a/public/app/features/teams/state/actions.ts
+++ b/public/app/features/teams/state/actions.ts
@@ -160,3 +160,12 @@ export function deleteTeam(id: number): ThunkResult<void> {
    dispatch(loadTeams());
  };
 }
+export function updateTeamMember(member: TeamMember): ThunkResult<void> {
+  return async dispatch => {
+    await getBackendSrv().put(`/api/teams/${member.teamId}/members/${member.userId}`, {
+      permission: member.permission,
+    });
+    dispatch(loadTeamMembers());
+  };
+}