diff --git a/webapp/channels/src/components/add_groups_to_channel_modal/__snapshots__/add_groups_to_channel_modal.test.tsx.snap b/webapp/channels/src/components/add_groups_to_channel_modal/__snapshots__/add_groups_to_channel_modal.test.tsx.snap
index 4ecbf9806d..36b7c687aa 100644
--- a/webapp/channels/src/components/add_groups_to_channel_modal/__snapshots__/add_groups_to_channel_modal.test.tsx.snap
+++ b/webapp/channels/src/components/add_groups_to_channel_modal/__snapshots__/add_groups_to_channel_modal.test.tsx.snap
@@ -65,6 +65,7 @@ exports[`components/AddGroupsToChannelModal should match snapshot 1`] = `
handleInput={[Function]}
handlePageChange={[Function]}
handleSubmit={[Function]}
+ intl={Object {}}
key="addGroupsToChannelKey"
loading={true}
maxValues={10}
diff --git a/webapp/channels/src/components/add_groups_to_channel_modal/add_groups_to_channel_modal.test.tsx b/webapp/channels/src/components/add_groups_to_channel_modal/add_groups_to_channel_modal.test.tsx
index d9b768216b..b5191ecaa3 100644
--- a/webapp/channels/src/components/add_groups_to_channel_modal/add_groups_to_channel_modal.test.tsx
+++ b/webapp/channels/src/components/add_groups_to_channel_modal/add_groups_to_channel_modal.test.tsx
@@ -1,19 +1,22 @@
// Copyright (c) 2015-present Mattermost, Inc. All Rights Reserved.
// See LICENSE.txt for license information.
-import {shallow} from 'enzyme';
import React from 'react';
+import type {IntlShape} from 'react-intl';
import {SyncableType} from '@mattermost/types/groups';
import AddGroupsToChannelModal from 'components/add_groups_to_channel_modal/add_groups_to_channel_modal';
-import type {Props} from 'components/add_groups_to_channel_modal/add_groups_to_channel_modal';
+import type {AddGroupsToChannelModal as AddGroupsToChannelModalClass, Props} from 'components/add_groups_to_channel_modal/add_groups_to_channel_modal';
+
+import {shallowWithIntl} from 'tests/helpers/intl-test-helper';
describe('components/AddGroupsToChannelModal', () => {
const baseProps: Props = {
currentChannelName: 'foo',
currentChannelId: '123',
teamID: '456',
+ intl: {} as IntlShape,
searchTerm: '',
groups: [],
onExited: jest.fn(),
@@ -28,19 +31,19 @@ describe('components/AddGroupsToChannelModal', () => {
};
test('should match snapshot', () => {
- const wrapper = shallow(
+ const wrapper = shallowWithIntl(
,
);
expect(wrapper).toMatchSnapshot();
});
test('should match state when handleResponse is called', () => {
- const wrapper = shallow(
+ const wrapper = shallowWithIntl(
,
);
wrapper.setState({saving: true, addError: ''});
- const instance = wrapper.instance() as AddGroupsToChannelModal;
+ const instance = wrapper.instance() as AddGroupsToChannelModalClass;
instance.handleResponse();
expect(wrapper.state('saving')).toEqual(false);
expect(wrapper.state('addError')).toEqual(null);
@@ -56,10 +59,10 @@ describe('components/AddGroupsToChannelModal', () => {
const linkGroupSyncable = jest.fn().mockResolvedValue({error: true, data: true});
const actions = {...baseProps.actions, linkGroupSyncable};
const props = {...baseProps, actions};
- const wrapper = shallow(
+ const wrapper = shallowWithIntl(
,
);
- const instance = wrapper.instance() as AddGroupsToChannelModal;
+ const instance = wrapper.instance() as AddGroupsToChannelModalClass;
instance.handleResponse = jest.fn();
instance.handleHide = jest.fn();
wrapper.setState({values: []});
@@ -81,14 +84,14 @@ describe('components/AddGroupsToChannelModal', () => {
});
test('should match state when addValue is called', () => {
- const wrapper = shallow(
+ const wrapper = shallowWithIntl(
,
);
const value1: any = {id: 'id_1', label: 'label_1', value: 'value_1'};
const value2: any = {id: 'id_2', label: 'label_2', value: 'value_2'};
wrapper.setState({values: [value1]});
- const instance = wrapper.instance() as AddGroupsToChannelModal;
+ const instance = wrapper.instance() as AddGroupsToChannelModalClass;
instance.addValue(value2);
expect(wrapper.state('values')).toEqual([value1, value2]);
@@ -98,12 +101,12 @@ describe('components/AddGroupsToChannelModal', () => {
});
test('should match state when handlePageChange is called', () => {
- const wrapper = shallow(
+ const wrapper = shallowWithIntl(
,
);
wrapper.setState({users: [{id: 'id_1'}]});
- const instance = wrapper.instance() as AddGroupsToChannelModal;
+ const instance = wrapper.instance() as AddGroupsToChannelModalClass;
instance.handlePageChange(0, 1);
expect(baseProps.actions.getGroupsNotAssociatedToChannel).toHaveBeenCalledTimes(1);
@@ -115,10 +118,10 @@ describe('components/AddGroupsToChannelModal', () => {
});
test('should match state when search is called', () => {
- const wrapper = shallow(
+ const wrapper = shallowWithIntl(
,
);
- const instance = wrapper.instance() as AddGroupsToChannelModal;
+ const instance = wrapper.instance() as AddGroupsToChannelModalClass;
instance.search('');
expect(baseProps.actions.setModalSearchTerm).toHaveBeenCalledTimes(1);
expect(baseProps.actions.setModalSearchTerm).toBeCalledWith('');
@@ -131,7 +134,7 @@ describe('components/AddGroupsToChannelModal', () => {
});
test('should match state when handleDelete is called', () => {
- const wrapper = shallow(
+ const wrapper = shallowWithIntl(
,
);
@@ -141,12 +144,12 @@ describe('components/AddGroupsToChannelModal', () => {
wrapper.setState({values: [value1]});
const newValues: any = [value2, value3];
- (wrapper.instance() as AddGroupsToChannelModal).handleDelete(newValues);
+ (wrapper.instance() as AddGroupsToChannelModalClass).handleDelete(newValues);
expect(wrapper.state('values')).toEqual(newValues);
});
test('should match when renderOption is called', () => {
- const wrapper = shallow(
+ const wrapper = shallowWithIntl(
,
);
@@ -154,7 +157,7 @@ describe('components/AddGroupsToChannelModal', () => {
let isSelected = false;
function onAdd() {} //eslint-disable-line no-empty-function
- const instance = wrapper.instance() as AddGroupsToChannelModal;
+ const instance = wrapper.instance() as AddGroupsToChannelModalClass;
expect(instance.renderOption(option, isSelected, onAdd)).toMatchSnapshot();
isSelected = true;
@@ -165,10 +168,10 @@ describe('components/AddGroupsToChannelModal', () => {
});
test('should match when renderValue is called', () => {
- const wrapper = shallow(
+ const wrapper = shallowWithIntl(
,
);
- expect((wrapper.instance() as AddGroupsToChannelModal).renderValue({data: {display_name: 'foo'}})).toEqual('foo');
+ expect((wrapper.instance() as AddGroupsToChannelModalClass).renderValue({data: {display_name: 'foo'}})).toEqual('foo');
});
});
diff --git a/webapp/channels/src/components/add_groups_to_channel_modal/add_groups_to_channel_modal.tsx b/webapp/channels/src/components/add_groups_to_channel_modal/add_groups_to_channel_modal.tsx
index 2b9a63ee21..a69f8fd0d8 100644
--- a/webapp/channels/src/components/add_groups_to_channel_modal/add_groups_to_channel_modal.tsx
+++ b/webapp/channels/src/components/add_groups_to_channel_modal/add_groups_to_channel_modal.tsx
@@ -3,7 +3,8 @@
import React from 'react';
import {Modal} from 'react-bootstrap';
-import {FormattedMessage} from 'react-intl';
+import type {IntlShape} from 'react-intl';
+import {injectIntl, FormattedMessage} from 'react-intl';
import type {ServerError} from '@mattermost/types/errors';
import type {Group, SyncablePatch} from '@mattermost/types/groups';
@@ -26,10 +27,10 @@ type GroupValue = (Group & Value);
export type Props = {
currentChannelName: string;
currentChannelId: string;
+ intl: IntlShape;
teamID: string;
searchTerm: string;
groups: Group[];
-
excludeGroups?: Group[];
includeGroups?: Group[];
onExited: () => void;
@@ -55,7 +56,7 @@ type State = {
loadingGroups: boolean;
}
-export default class AddGroupsToChannelModal extends React.PureComponent {
+export class AddGroupsToChannelModal extends React.PureComponent {
private searchTimeoutId: number;
private selectedItemRef: React.RefObject;
@@ -288,6 +289,7 @@ export default class AddGroupsToChannelModal extends React.PureComponent {
const baseProps = {
@@ -24,34 +26,36 @@ describe('components/AddGroupsToTeamModal', () => {
};
test('should match snapshot', () => {
- const wrapper = shallow(
+ const wrapper = shallowWithIntl(
,
);
expect(wrapper).toMatchSnapshot();
});
test('should have called onExited when handleExit is called', () => {
- const wrapper = shallow(
+ const wrapper = shallowWithIntl(
,
);
- wrapper.instance().handleExit();
+ (wrapper.instance() as AddGroupsToTeamModalClass).handleExit();
expect(baseProps.onExited).toHaveBeenCalledTimes(1);
});
test('should match state when handleResponse is called', () => {
- const wrapper = shallow(
+ const wrapper = shallowWithIntl(
,
);
+ const instance = wrapper.instance() as AddGroupsToTeamModalClass;
+
wrapper.setState({saving: true, addError: ''});
- wrapper.instance().handleResponse();
+ instance.handleResponse();
expect(wrapper.state('saving')).toEqual(false);
expect(wrapper.state('addError')).toEqual(null);
const message = 'error message';
wrapper.setState({saving: true, addError: ''});
- wrapper.instance().handleResponse(new Error(message));
+ instance.handleResponse(new Error(message));
expect(wrapper.state('saving')).toEqual(false);
expect(wrapper.state('addError')).toEqual(message);
});
@@ -60,10 +64,10 @@ describe('components/AddGroupsToTeamModal', () => {
const linkGroupSyncable = jest.fn().mockResolvedValue({error: true, data: true});
const actions = {...baseProps.actions, linkGroupSyncable};
const props = {...baseProps, actions};
- const wrapper = shallow(
+ const wrapper = shallowWithIntl(
,
);
- const instance = wrapper.instance() as AddGroupsToTeamModal;
+ const instance = wrapper.instance() as AddGroupsToTeamModalClass;
instance.handleResponse = jest.fn();
instance.handleHide = jest.fn();
@@ -86,57 +90,63 @@ describe('components/AddGroupsToTeamModal', () => {
});
test('should match state when addValue is called', () => {
- const wrapper = shallow(
+ const wrapper = shallowWithIntl(
,
);
const value1 = {id: 'id_1', label: 'label_1', value: 'value_1'};
const value2 = {id: 'id_2', label: 'label_2', value: 'value_2'};
+ const instance = wrapper.instance() as AddGroupsToTeamModalClass;
+
wrapper.setState({values: [value1]});
- wrapper.instance().addValue(value2);
+ instance.addValue(value2);
expect(wrapper.state('values')).toEqual([value1, value2]);
wrapper.setState({values: [value1]});
- wrapper.instance().addValue(value1);
+ instance.addValue(value1);
expect(wrapper.state('values')).toEqual([value1]);
});
test('should match state when handlePageChange is called', () => {
- const wrapper = shallow(
+ const wrapper = shallowWithIntl(
,
);
- wrapper.instance().handlePageChange(0, 1);
+ const instance = wrapper.instance() as AddGroupsToTeamModalClass;
+
+ instance.handlePageChange(0, 1);
expect(baseProps.actions.getGroupsNotAssociatedToTeam).toHaveBeenCalledTimes(1);
- wrapper.instance().handlePageChange(1, 0);
+ instance.handlePageChange(1, 0);
expect(baseProps.actions.getGroupsNotAssociatedToTeam).toHaveBeenCalledTimes(2);
- wrapper.instance().handlePageChange(0, 1);
+ instance.handlePageChange(0, 1);
expect(baseProps.actions.getGroupsNotAssociatedToTeam).toHaveBeenCalledTimes(2);
});
test('should match state when search is called', () => {
- const wrapper = shallow(
+ const wrapper = shallowWithIntl(
,
);
+ const instance = wrapper.instance() as AddGroupsToTeamModalClass;
- wrapper.instance().search('');
+ instance.search('');
expect(baseProps.actions.setModalSearchTerm).toHaveBeenCalledTimes(1);
expect(baseProps.actions.setModalSearchTerm).toBeCalledWith('');
const searchTerm = 'term';
- wrapper.instance().search(searchTerm);
+ instance.search(searchTerm);
expect(wrapper.state('loadingGroups')).toEqual(true);
expect(baseProps.actions.setModalSearchTerm).toHaveBeenCalledTimes(2);
expect(baseProps.actions.setModalSearchTerm).toBeCalledWith(searchTerm);
});
test('should match state when handleDelete is called', () => {
- const wrapper = shallow(
+ const wrapper = shallowWithIntl(
,
);
+ const instance = wrapper.instance() as AddGroupsToTeamModalClass;
const value1 = {id: 'id_1', label: 'label_1', value: 'value_1'};
const value2 = {id: 'id_2', label: 'label_2', value: 'value_2'};
@@ -144,31 +154,33 @@ describe('components/AddGroupsToTeamModal', () => {
wrapper.setState({values: [value1]});
const newValues = [value2, value3];
- wrapper.instance().handleDelete(newValues);
+ instance.handleDelete(newValues);
expect(wrapper.state('values')).toEqual(newValues);
});
test('should match when renderOption is called', () => {
- const wrapper = shallow(
+ const wrapper = shallowWithIntl(
,
);
+ const instance = wrapper.instance() as AddGroupsToTeamModalClass;
const option = {id: 'id_1', label: 'label_1', value: 'value_1'};
let isSelected = false;
const onAdd = jest.fn();
const onMouseMove = jest.fn();
- expect(wrapper.instance().renderOption(option, isSelected, onAdd, onMouseMove)).toMatchSnapshot();
+ expect(instance.renderOption(option, isSelected, onAdd, onMouseMove)).toMatchSnapshot();
isSelected = true;
- expect(wrapper.instance().renderOption(option, isSelected, onAdd, onMouseMove)).toMatchSnapshot();
+ expect(instance.renderOption(option, isSelected, onAdd, onMouseMove)).toMatchSnapshot();
});
test('should match when renderValue is called', () => {
- const wrapper = shallow(
+ const wrapper = shallowWithIntl(
,
);
+ const instance = wrapper.instance() as AddGroupsToTeamModalClass;
- expect(wrapper.instance().renderValue({data: {id: 'id_1', label: 'label_1', value: 'value_1', display_name: 'foo'}})).toEqual('foo');
+ expect(instance.renderValue({data: {id: 'id_1', label: 'label_1', value: 'value_1', display_name: 'foo'}})).toEqual('foo');
});
});
diff --git a/webapp/channels/src/components/add_groups_to_team_modal/add_groups_to_team_modal.tsx b/webapp/channels/src/components/add_groups_to_team_modal/add_groups_to_team_modal.tsx
index 757309aecf..11dbb52149 100644
--- a/webapp/channels/src/components/add_groups_to_team_modal/add_groups_to_team_modal.tsx
+++ b/webapp/channels/src/components/add_groups_to_team_modal/add_groups_to_team_modal.tsx
@@ -4,7 +4,8 @@
import React from 'react';
import type {RefObject} from 'react';
import {Modal} from 'react-bootstrap';
-import {FormattedMessage} from 'react-intl';
+import type {IntlShape} from 'react-intl';
+import {injectIntl, FormattedMessage} from 'react-intl';
import type {Group, GroupsWithCount, SyncablePatch} from '@mattermost/types/groups';
import {SyncableType} from '@mattermost/types/groups';
@@ -25,6 +26,7 @@ type GroupValue = Value & {member_count?: number};
type Props = {
currentTeamName: string;
currentTeamId: string;
+ intl: IntlShape;
searchTerm: string;
groups: Group[];
@@ -53,7 +55,7 @@ type State = {
loadingGroups: boolean;
}
-export default class AddGroupsToTeamModal extends React.PureComponent {
+export class AddGroupsToTeamModal extends React.PureComponent {
private searchTimeoutId: number;
private readonly selectedItemRef: RefObject;
@@ -299,6 +301,7 @@ export default class AddGroupsToTeamModal extends React.PureComponent {
};
test('should match snapshot without any profiles', () => {
- const wrapper = shallow(
+ const wrapper = shallowWithIntl(
,
@@ -59,7 +61,7 @@ describe('component/add_user_to_group_multiselect', () => {
});
test('should match snapshot with profiles', () => {
- const wrapper = shallow(
+ const wrapper = shallowWithIntl(
{
});
test('should match snapshot with different submit button text', () => {
- const wrapper = shallow(
+ const wrapper = shallowWithIntl(
{
});
test('should trim the search term', () => {
- const wrapper = shallow(
+ const wrapper = shallowWithIntl(
,
);
- wrapper.instance().search(' something ');
+ (wrapper.instance() as AddUserToGroupMultiSelectClass).search(' something ');
expect(wrapper.state('term')).toEqual('something');
});
test('should add users on handleSubmit', (done) => {
- const wrapper = shallow(
+ const wrapper = shallowWithIntl(
,
);
+ const instance = wrapper.instance() as AddUserToGroupMultiSelectClass;
wrapper.setState({values: users});
- wrapper.instance().handleSubmit();
- expect(wrapper.instance().props.onSubmitCallback).toHaveBeenCalledTimes(1);
+ instance.handleSubmit();
+ expect(instance.props.onSubmitCallback).toHaveBeenCalledTimes(1);
process.nextTick(() => {
done();
});
diff --git a/webapp/channels/src/components/add_user_to_group_multiselect/add_user_to_group_multiselect.tsx b/webapp/channels/src/components/add_user_to_group_multiselect/add_user_to_group_multiselect.tsx
index 15a85c5ce1..e198834977 100644
--- a/webapp/channels/src/components/add_user_to_group_multiselect/add_user_to_group_multiselect.tsx
+++ b/webapp/channels/src/components/add_user_to_group_multiselect/add_user_to_group_multiselect.tsx
@@ -2,6 +2,8 @@
// See LICENSE.txt for license information.
import React from 'react';
+import type {IntlShape} from 'react-intl';
+import {injectIntl} from 'react-intl';
import type {UserProfile} from '@mattermost/types/users';
import type {RelationOneToOne} from '@mattermost/types/utilities';
@@ -27,6 +29,8 @@ export type Props = {
userStatuses: RelationOneToOne;
focusOnLoad?: boolean;
+ intl: IntlShape;
+
// Used if we are adding new members to an existing group
groupId?: string;
@@ -66,7 +70,7 @@ type State = {
loadingUsers: boolean;
}
-export default class AddUserToGroupMultiSelect extends React.PureComponent {
+export class AddUserToGroupMultiSelect extends React.PureComponent {
private searchTimeoutId = 0;
selectedItemRef;
@@ -218,6 +222,7 @@ export default class AddUserToGroupMultiSelect extends React.PureComponent
- {
function createUser(id: string, username: string, bot: boolean): UserProfile {
@@ -58,7 +59,7 @@ describe('components/admin_console/add_users_to_team_modal/AddUsersToTeamModal',
};
test('should match snapshot with 2 users', () => {
- const wrapper = shallow(
+ const wrapper = shallowWithIntl(
,
@@ -67,7 +68,7 @@ describe('components/admin_console/add_users_to_team_modal/AddUsersToTeamModal',
});
test('should match snapshot with 2 users, 1 included and 1 removed', () => {
- const wrapper = shallow(
+ const wrapper = shallowWithIntl(
{
- const wrapper = shallow(
+ const wrapper = shallowWithIntl(
,
);
wrapper.setState({show: true});
- (wrapper.instance() as AddUsersToTeamModal).handleHide();
+ (wrapper.instance() as AddUsersToTeamModalClass).handleHide();
expect(wrapper.state('show')).toEqual(false);
});
test('should search', () => {
- const wrapper = shallow(
+ const wrapper = shallowWithIntl(
,
);
- const addUsers = wrapper.instance() as AddUsersToTeamModal;
+ const addUsers = wrapper.instance() as AddUsersToTeamModalClass;
// search profiles when search term given
addUsers.search('foo');
diff --git a/webapp/channels/src/components/add_users_to_team_modal/add_users_to_team_modal.tsx b/webapp/channels/src/components/add_users_to_team_modal/add_users_to_team_modal.tsx
index 3191e623d4..abd51afb0f 100644
--- a/webapp/channels/src/components/add_users_to_team_modal/add_users_to_team_modal.tsx
+++ b/webapp/channels/src/components/add_users_to_team_modal/add_users_to_team_modal.tsx
@@ -3,7 +3,8 @@
import React from 'react';
import {Modal} from 'react-bootstrap';
-import {FormattedMessage} from 'react-intl';
+import type {IntlShape} from 'react-intl';
+import {injectIntl, FormattedMessage} from 'react-intl';
import type {Team} from '@mattermost/types/teams';
import type {UserProfile} from '@mattermost/types/users';
@@ -27,6 +28,7 @@ type UserProfileValue = Value & UserProfile;
type Props = {
team: Team;
users: UserProfile[];
+ intl: IntlShape;
filterExcludeGuests?: boolean;
excludeUsers: { [userId: string]: UserProfile };
includeUsers: { [userId: string]: UserProfile };
@@ -50,7 +52,7 @@ type State = {
filterOptions: {[key: string]: any};
}
-export default class AddUsersToTeamModal extends React.PureComponent {
+export class AddUsersToTeamModal extends React.PureComponent {
selectedItemRef: React.RefObject;
public constructor(props: Props) {
@@ -239,6 +241,7 @@ export default class AddUsersToTeamModal extends React.PureComponent
-
- {
};
test('should have single passed value', () => {
- const wrapper = shallow(
+ const wrapper = shallowWithIntl(
);
@@ -33,7 +33,7 @@ describe('admin_console/add_users_to_role_modal', () => {
test('should exclude user', () => {
const props = {...baseProps, excludeUsers: {user_id: TestHelper.getUserMock()}};
- const wrapper = shallow(
+ const wrapper = shallowWithIntl(
);
@@ -43,7 +43,7 @@ describe('admin_console/add_users_to_role_modal', () => {
test('should include additional user', () => {
const props = {...baseProps, includeUsers: {user_id1: TestHelper.getUserMock()}};
- const wrapper = shallow(
+ const wrapper = shallowWithIntl(
);
@@ -53,7 +53,7 @@ describe('admin_console/add_users_to_role_modal', () => {
test('should include additional user', () => {
const props = {...baseProps, includeUsers: {user_id1: TestHelper.getUserMock()}};
- const wrapper = shallow(
+ const wrapper = shallowWithIntl(
);
@@ -70,7 +70,7 @@ describe('admin_console/add_users_to_role_modal', () => {
searchProfiles: jest.fn(),
},
};
- const wrapper = shallow(
+ const wrapper = shallowWithIntl(
);
@@ -87,7 +87,7 @@ describe('admin_console/add_users_to_role_modal', () => {
getProfiles: jest.fn(),
},
};
- const wrapper = shallow(
+ const wrapper = shallowWithIntl(
);
diff --git a/webapp/channels/src/components/admin_console/system_roles/system_role/add_users_to_role_modal/add_users_to_role_modal.tsx b/webapp/channels/src/components/admin_console/system_roles/system_role/add_users_to_role_modal/add_users_to_role_modal.tsx
index a7f2bbe316..d89aeca75f 100644
--- a/webapp/channels/src/components/admin_console/system_roles/system_role/add_users_to_role_modal/add_users_to_role_modal.tsx
+++ b/webapp/channels/src/components/admin_console/system_roles/system_role/add_users_to_role_modal/add_users_to_role_modal.tsx
@@ -3,7 +3,8 @@
import React from 'react';
import {Modal} from 'react-bootstrap';
-import {FormattedMessage} from 'react-intl';
+import type {IntlShape} from 'react-intl';
+import {injectIntl, FormattedMessage} from 'react-intl';
import type {Role} from '@mattermost/types/roles';
import type {UserProfile} from '@mattermost/types/users';
@@ -30,6 +31,7 @@ export type Props = {
users: UserProfile[];
excludeUsers: { [userId: string]: UserProfile };
includeUsers: { [userId: string]: UserProfile };
+ intl: IntlShape;
onAddCallback: (users: UserProfile[]) => void;
onExited: () => void;
@@ -55,7 +57,7 @@ function searchUsersToAdd(users: Record, term: string): Rec
return filterProfiles(profileListToMap(filteredProfilesList), {});
}
-export default class AddUsersToRoleModal extends React.PureComponent {
+export class AddUsersToRoleModal extends React.PureComponent {
constructor(props: Props) {
super(props);
@@ -248,6 +250,7 @@ export default class AddUsersToRoleModal extends React.PureComponent {
@@ -91,7 +93,7 @@ describe('components/channel_invite_modal', () => {
};
test('should match snapshot for channel_invite_modal with profiles', () => {
- const wrapper = shallow(
+ const wrapper = shallowWithIntl(
{
});
test('should match snapshot for channel_invite_modal with profiles from DMs', () => {
- const wrapper = shallow(
+ const wrapper = shallowWithIntl(
{
});
test('should match snapshot with exclude and include users', () => {
- const wrapper = shallow(
+ const wrapper = shallowWithIntl(
{
});
test('should match snapshot for channel_invite_modal with userStatuses', () => {
- const wrapper = shallow(
+ const wrapper = shallowWithIntl(
{
profilesFromRecentDMs={[]}
/>,
);
- const instance = wrapper.instance() as ChannelInviteModal;
+ const instance = wrapper.instance() as ChannelInviteModalClass;
expect(instance.renderOption(users[0], true, jest.fn(), jest.fn())).toMatchSnapshot();
});
test('should match state when onHide is called', () => {
- const wrapper = shallow(
+ const wrapper = shallowWithIntl(
,
);
wrapper.setState({show: true});
- wrapper.instance().onHide();
+
+ const instance = wrapper.instance() as ChannelInviteModalClass;
+ instance.onHide();
+
expect(wrapper.state('show')).toEqual(false);
});
test('should have called props.onHide when Modal.onExited is called', () => {
const props = {...baseProps};
- const wrapper = shallow(
+ const wrapper = shallowWithIntl(
,
);
@@ -184,16 +189,19 @@ describe('components/channel_invite_modal', () => {
});
test('should fail to add users on handleSubmit', (done) => {
- const wrapper = shallow(
+ const wrapper = shallowWithIntl(
,
);
wrapper.setState({selectedUsers: users, show: true});
- wrapper.instance().handleSubmit();
+
+ const instance = wrapper.instance() as ChannelInviteModalClass;
+ instance.handleSubmit();
+
expect(wrapper.state('saving')).toEqual(true);
- expect(wrapper.instance().props.actions.addUsersToChannel).toHaveBeenCalledTimes(1);
+ expect(instance.props.actions.addUsersToChannel).toHaveBeenCalledTimes(1);
process.nextTick(() => {
expect(wrapper.state('inviteError')).toEqual('Failed');
expect(wrapper.state('saving')).toEqual(false);
@@ -213,16 +221,19 @@ describe('components/channel_invite_modal', () => {
},
};
- const wrapper = shallow(
+ const wrapper = shallowWithIntl(
,
);
wrapper.setState({selectedUsers: users, show: true});
- wrapper.instance().handleSubmit();
+
+ const instance = wrapper.instance() as ChannelInviteModalClass;
+ instance.handleSubmit();
+
expect(wrapper.state('saving')).toEqual(true);
- expect(wrapper.instance().props.actions.addUsersToChannel).toHaveBeenCalledTimes(1);
+ expect(instance.props.actions.addUsersToChannel).toHaveBeenCalledTimes(1);
process.nextTick(() => {
expect(wrapper.state('inviteError')).toBeUndefined();
expect(wrapper.state('saving')).toEqual(false);
@@ -239,24 +250,28 @@ describe('components/channel_invite_modal', () => {
onAddCallback,
};
- const wrapper = shallow(
+ const wrapper = shallowWithIntl(
,
);
wrapper.setState({selectedUsers: users, show: true});
- wrapper.instance().handleSubmit();
+ const instance = wrapper.instance() as ChannelInviteModalClass;
+ instance.handleSubmit();
+
expect(onAddCallback).toHaveBeenCalled();
- expect(wrapper.instance().props.actions.addUsersToChannel).toHaveBeenCalledTimes(0);
+ expect(instance.props.actions.addUsersToChannel).toHaveBeenCalledTimes(0);
});
test('should trim the search term', () => {
- const wrapper = shallow(
+ const wrapper = shallowWithIntl(
,
);
- wrapper.instance().search(' something ');
+ const instance = wrapper.instance() as ChannelInviteModalClass;
+
+ instance.search(' something ');
expect(wrapper.state('term')).toEqual('something');
});
@@ -266,7 +281,7 @@ describe('components/channel_invite_modal', () => {
canInviteGuests: true,
emailInvitationsEnabled: true,
};
- const wrapper = shallow(
+ const wrapper = shallowWithIntl(
,
);
@@ -283,7 +298,7 @@ describe('components/channel_invite_modal', () => {
canInviteGuests: false,
emailInvitationsEnabled: false,
};
- const wrapper = shallow(
+ const wrapper = shallowWithIntl(
,
);
diff --git a/webapp/channels/src/components/channel_invite_modal/channel_invite_modal.tsx b/webapp/channels/src/components/channel_invite_modal/channel_invite_modal.tsx
index 058e75a334..86cdad98c1 100644
--- a/webapp/channels/src/components/channel_invite_modal/channel_invite_modal.tsx
+++ b/webapp/channels/src/components/channel_invite_modal/channel_invite_modal.tsx
@@ -4,7 +4,8 @@
import {isEqual} from 'lodash';
import React from 'react';
import {Modal} from 'react-bootstrap';
-import {FormattedMessage} from 'react-intl';
+import type {IntlShape} from 'react-intl';
+import {injectIntl, FormattedMessage} from 'react-intl';
import styled from 'styled-components';
import type {Channel} from '@mattermost/types/channels';
@@ -45,6 +46,7 @@ export type Props = {
profilesInCurrentChannel: UserProfile[];
profilesNotInCurrentTeam: UserProfile[];
profilesFromRecentDMs: UserProfile[];
+ intl: IntlShape;
membersInTeam: RelationOneToOne;
userStatuses: RelationOneToOne;
onExited: () => void;
@@ -98,7 +100,7 @@ const UserMappingSpan = styled.span`
right: 20px;
`;
-export default class ChannelInviteModal extends React.PureComponent {
+export class ChannelInviteModal extends React.PureComponent {
private searchTimeoutId = 0;
private selectedItemRef = React.createRef();
@@ -499,6 +501,7 @@ export default class ChannelInviteModal extends React.PureComponent {
@@ -36,7 +36,7 @@ describe('components/ChannelSelectorModal', () => {
};
test('should match snapshot', () => {
- const wrapper = shallow();
+ const wrapper = shallowWithIntl();
wrapper.setState({channels: [
channel1,
channel2,
@@ -46,7 +46,7 @@ describe('components/ChannelSelectorModal', () => {
});
test('exclude already selected', () => {
- const wrapper = shallow(
+ const wrapper = shallowWithIntl(
void;
onChannelsSelected?: (channels: ChannelWithTeamData[]) => void;
+ intl: IntlShape;
groupID: string;
actions: {
loadChannels: (page?: number, perPage?: number, notAssociatedToGroup?: string, excludeDefaultChannels?: boolean, excludePolicyConstrained?: boolean) => Promise<{data: ChannelWithTeamData[]}>;
@@ -43,7 +45,7 @@ type State = {
const CHANNELS_PER_PAGE = 50;
-export default class ChannelSelectorModal extends React.PureComponent {
+export class ChannelSelectorModal extends React.PureComponent {
searchTimeoutId = 0;
selectedItemRef = React.createRef();
@@ -245,6 +247,7 @@ export default class ChannelSelectorModal extends React.PureComponent
-
-
);
});
+
export default List;
function renderValue(props: {data: OptionValue}) {
diff --git a/webapp/channels/src/components/multiselect/multiselect.test.tsx b/webapp/channels/src/components/multiselect/multiselect.test.tsx
index c8508b4b32..6a0d2983c7 100644
--- a/webapp/channels/src/components/multiselect/multiselect.test.tsx
+++ b/webapp/channels/src/components/multiselect/multiselect.test.tsx
@@ -3,6 +3,7 @@
import {shallow} from 'enzyme';
import React from 'react';
+import type {IntlShape} from 'react-intl';
import {mountWithIntl} from 'tests/helpers/intl-test-helper';
@@ -27,6 +28,7 @@ describe('components/multiselect/multiselect', () => {
handleDelete: jest.fn(),
handleInput: jest.fn(),
handleSubmit: jest.fn(),
+ intl: {} as IntlShape,
optionRenderer: element,
options: users,
perPage: 5,
@@ -35,11 +37,14 @@ describe('components/multiselect/multiselect', () => {
users,
valueRenderer: element as any,
values: [{id: 'id', label: 'label', value: 'value'}],
+ valueWithImage: false,
};
test('should match snapshot', () => {
const wrapper = shallow(
- ,
+ ,
);
expect(wrapper).toMatchSnapshot();
@@ -47,7 +52,9 @@ describe('components/multiselect/multiselect', () => {
test('should match snapshot for page 2', () => {
const wrapper = shallow(
- ,
+ ,
);
wrapper.find('.filter-control__next').simulate('click');
diff --git a/webapp/channels/src/components/multiselect/multiselect.tsx b/webapp/channels/src/components/multiselect/multiselect.tsx
index 1567ed931b..116e77eaa3 100644
--- a/webapp/channels/src/components/multiselect/multiselect.tsx
+++ b/webapp/channels/src/components/multiselect/multiselect.tsx
@@ -4,12 +4,12 @@
import classNames from 'classnames';
import React from 'react';
import type {ReactNode} from 'react';
+import type {IntlShape} from 'react-intl';
import {FormattedMessage} from 'react-intl';
import ReactSelect, {components} from 'react-select';
import type {getOptionValue} from 'react-select/src/builtins';
import type {InputActionMeta} from 'react-select/src/types';
-import LocalizedIcon from 'components/localized_icon';
import SaveButton from 'components/save_button';
import CloseCircleSolidIcon from 'components/widgets/icons/close_circle_solid_icon';
import Avatar from 'components/widgets/users/avatar';
@@ -40,6 +40,7 @@ export type Props = {
handleInput: (input: string, multiselect: MultiSelect) => void;
handlePageChange?: (newPage: number, currentPage: number) => void;
handleSubmit: (value?: T[]) => void;
+ intl: IntlShape;
loading?: boolean;
saveButtonPosition?: string;
maxValues?: number;
@@ -76,7 +77,7 @@ export type State = {
const KeyCodes = Constants.KeyCodes;
-export default class MultiSelect extends React.PureComponent, State> {
+export class MultiSelect extends React.PureComponent, State> {
private listRef = React.createRef>();
private reactSelectRef = React.createRef();
private selected: T | null = null;
@@ -332,9 +333,9 @@ export default class MultiSelect extends React.PureComponent
-
{this.props.noteText}
@@ -571,3 +572,5 @@ const styles = {
};
},
};
+
+export default MultiSelect;
diff --git a/webapp/channels/src/components/team_selector_modal/__snapshots__/team_selector_modal.test.tsx.snap b/webapp/channels/src/components/team_selector_modal/__snapshots__/team_selector_modal.test.tsx.snap
index ccb027b315..e5b1be76a2 100644
--- a/webapp/channels/src/components/team_selector_modal/__snapshots__/team_selector_modal.test.tsx.snap
+++ b/webapp/channels/src/components/team_selector_modal/__snapshots__/team_selector_modal.test.tsx.snap
@@ -1,326 +1,13 @@
// Jest Snapshot v1, https://goo.gl/fbAQLP
exports[`components/TeamSelectorModal should hide group constrained teams when excludeGroupConstrained is true 1`] = `
-
-
-
-
-
-
-
-
- }
- message={
-
- }
- modalClass=""
- onCancel={[Function]}
- onConfirm={[Function]}
- show={false}
- title={
-
- }
- />
-
- }
- optionRenderer={[Function]}
- options={
- Array [
- Object {
- "allow_open_invite": false,
- "allowed_domains": "",
- "company_name": "",
- "create_at": 0,
- "delete_at": 0,
- "description": "",
- "display_name": "Team 3",
- "email": "",
- "group_constrained": false,
- "id": "id3",
- "invite_id": "",
- "label": "DN",
- "name": "DN",
- "scheme_id": "test",
- "type": "O",
- "update_at": 0,
- "value": "id3",
- },
- Object {
- "allow_open_invite": false,
- "allowed_domains": "",
- "company_name": "",
- "create_at": 0,
- "delete_at": 0,
- "description": "",
- "display_name": "Team 4",
- "email": "",
- "group_constrained": false,
- "id": "id4",
- "invite_id": "",
- "label": "DN",
- "name": "DN",
- "scheme_id": "",
- "type": "O",
- "update_at": 0,
- "value": "id4",
- },
- ]
- }
- perPage={50}
- placeholderText="Search and add teams"
- saveButtonPosition="top"
- saving={false}
- savingEnabled={true}
- selectedItemRef={
- Object {
- "current": null,
- }
- }
- valueRenderer={[Function]}
- valueWithImage={false}
- values={Array []}
- />
-
-
+
+
+
`;
exports[`components/TeamSelectorModal should match snapshot 1`] = `
-
-
-
-
-
-
-
-
- }
- message={
-
- }
- modalClass=""
- onCancel={[Function]}
- onConfirm={[Function]}
- show={false}
- title={
-
- }
- />
-
- }
- optionRenderer={[Function]}
- options={
- Array [
- Object {
- "allow_open_invite": false,
- "allowed_domains": "",
- "company_name": "",
- "create_at": 0,
- "delete_at": 0,
- "description": "",
- "display_name": "Team 3",
- "email": "",
- "group_constrained": false,
- "id": "id3",
- "invite_id": "",
- "label": "DN",
- "name": "DN",
- "scheme_id": "test",
- "type": "O",
- "update_at": 0,
- "value": "id3",
- },
- Object {
- "allow_open_invite": false,
- "allowed_domains": "",
- "company_name": "",
- "create_at": 0,
- "delete_at": 0,
- "description": "",
- "display_name": "Team 4",
- "email": "",
- "group_constrained": false,
- "id": "id4",
- "invite_id": "",
- "label": "DN",
- "name": "DN",
- "scheme_id": "",
- "type": "O",
- "update_at": 0,
- "value": "id4",
- },
- Object {
- "allow_open_invite": false,
- "allowed_domains": "",
- "company_name": "",
- "create_at": 0,
- "delete_at": 0,
- "description": "",
- "display_name": "Team 5",
- "email": "",
- "group_constrained": true,
- "id": "id5",
- "invite_id": "",
- "label": "DN",
- "name": "DN",
- "scheme_id": "",
- "type": "O",
- "update_at": 0,
- "value": "id5",
- },
- ]
- }
- perPage={50}
- placeholderText="Search and add teams"
- saveButtonPosition="top"
- saving={false}
- savingEnabled={true}
- selectedItemRef={
- Object {
- "current": null,
- }
- }
- valueRenderer={[Function]}
- valueWithImage={false}
- values={Array []}
- />
-
-
+
+
+
`;
diff --git a/webapp/channels/src/components/team_selector_modal/team_selector_modal.test.tsx b/webapp/channels/src/components/team_selector_modal/team_selector_modal.test.tsx
index ec15fe93e9..287a3b37cf 100644
--- a/webapp/channels/src/components/team_selector_modal/team_selector_modal.test.tsx
+++ b/webapp/channels/src/components/team_selector_modal/team_selector_modal.test.tsx
@@ -3,6 +3,7 @@
import {shallow} from 'enzyme';
import React from 'react';
+import type {IntlShape} from 'react-intl';
import {TestHelper} from 'utils/test_helper';
@@ -13,6 +14,7 @@ describe('components/TeamSelectorModal', () => {
const defaultProps: Props = {
currentSchemeId: 'xxx',
alreadySelected: ['id1'],
+ intl: {} as IntlShape,
searchTerm: '',
teams: [
TestHelper.getTeamMock({
diff --git a/webapp/channels/src/components/team_selector_modal/team_selector_modal.tsx b/webapp/channels/src/components/team_selector_modal/team_selector_modal.tsx
index 924eede687..6a358ddaa8 100644
--- a/webapp/channels/src/components/team_selector_modal/team_selector_modal.tsx
+++ b/webapp/channels/src/components/team_selector_modal/team_selector_modal.tsx
@@ -3,7 +3,8 @@
import React from 'react';
import {Modal} from 'react-bootstrap';
-import {FormattedMessage} from 'react-intl';
+import type {IntlShape} from 'react-intl';
+import {injectIntl, FormattedMessage} from 'react-intl';
import type {Team} from '@mattermost/types/teams';
@@ -25,6 +26,7 @@ type TeamValue = (Team & Value);
export type Props = {
currentSchemeId?: string;
alreadySelected?: string[];
+ intl: IntlShape;
excludeGroupConstrained?: boolean;
searchTerm: string;
teams: Team[];
@@ -49,7 +51,7 @@ type State = {
confirmAddTeam: any;
};
-export default class TeamSelectorModal extends React.PureComponent {
+export class TeamSelectorModal extends React.PureComponent {
private searchTimeoutId?: number;
private selectedItemRef?: React.RefObject | undefined;
private currentSchemeId?: string;
@@ -297,6 +299,7 @@ export default class TeamSelectorModal extends React.PureComponent
key='addTeamsToSchemeKey'
options={teamsValues}
optionRenderer={this.renderOption}
+ intl={this.props.intl}
selectedItemRef={this.selectedItemRef}
values={this.state.values}
valueRenderer={this.renderValue}
@@ -317,3 +320,5 @@ export default class TeamSelectorModal extends React.PureComponent
);
}
}
+
+export default injectIntl(TeamSelectorModal);