... SetChannelHeader

components/channel_header_dropdown/menu_items/index.js

@@ -5,8 +5,8 @@ export {default as ViewChannelInfo} from './view_channel_info';
 export {default as ViewPinnedPosts} from './view_pinned_posts';
 export {default as NotificationPreferences} from './notification_preferences';
 export {default as ToggleFavoriteChannel} from './toggle_favorite_channel';
+export {default as SetChannelHeader} from './set_channel_header';
 
-// export {default as SetChannelHeader} from './set_channel_header';
 // export {default as SetChannelPurpose} from './set_channel_purpose';
 export {default as AddMembers} from './add_members';
 

components/channel_header_dropdown/menu_items/set_channel_header.jsx

@@ -0,0 +1,59 @@
+// Copyright (c) 2015-present Mattermost, Inc. All Rights Reserved.
+// See LICENSE.txt for license information.
+
+import React from 'react';
+import PropTypes from 'prop-types';
+import {FormattedMessage} from 'react-intl';
+import {Permissions} from 'mattermost-redux/constants';
+
+import ChannelPermissionGate from 'components/permissions_gates/channel_permission_gate';
+import ToggleModalButtonRedux from 'components/toggle_modal_button_redux';
+import EditChannelHeaderModal from 'components/edit_channel_header_modal';
+import {Constants, ModalIdentifiers} from 'utils/constants';
+
+const SetChannelHeader = ({channel, isReadonly}) => {
+ if (isReadonly) {
+ return null;
+ }
+
+ const isPrivate = channel.type === Constants.PRIVATE_CHANNEL;
+ const permission = isPrivate ? Permissions.MANAGE_PRIVATE_CHANNEL_PROPERTIES : Permissions.MANAGE_PUBLIC_CHANNEL_PROPERTIES;
+
+ return (
+ <ChannelPermissionGate
+ channelId={channel.id}
+ teamId={channel.team_id}
+ permissions={[permission]}
+ >
+ <li role='presentation'>
+ <ToggleModalButtonRedux
+ id='editChannelHeader'
+ role='menuitem'
+ modalId={ModalIdentifiers.EDIT_CHANNEL_HEADER}
+ dialogType={EditChannelHeaderModal}
+ dialogProps={{channel}}
+ >
+ <FormattedMessage
+ id='channel_header.setHeader'
+ defaultMessage='Edit Channel Header'
+ />
+ </ToggleModalButtonRedux>
+ </li>
+ </ChannelPermissionGate>
+ );
+};
+
+SetChannelHeader.propTypes = {
+
+ /**
+ * Object with info about user
+ */
+ channel: PropTypes.object.isRequired,
+
+ /**
+ * Boolean whether the channel is readonly
+ */
+ isReadonly: PropTypes.bool.isRequired,
+};
+
+export default SetChannelHeader;

tests/components/channel_header_dropdown/menu_items/__snapshots__/set_channel_header.test.jsx.snap

@@ -0,0 +1,39 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`components/ChannelHeaderDropdown/MenuItem.SetChannelHeader should match snapshot 1`] = `
+<Connect(ChannelPermissionGate)
+ channelId="channel_id"
+ permissions={
+ Array [
+ "manage_public_channel_properties",
+ ]
+ }
+ teamId="team_id"
+>
+ <li
+ role="presentation"
+ >
+ <Connect(ModalToggleButtonRedux)
+ dialogProps={
+ Object {
+ "channel": Object {
+ "id": "channel_id",
+ "team_id": "team_id",
+ "type": "O",
+ },
+ }
+ }
+ dialogType={[Function]}
+ id="editChannelHeader"
+ modalId="edit_channel_header"
+ role="menuitem"
+ >
+ <FormattedMessage
+ defaultMessage="Edit Channel Header"
+ id="channel_header.setHeader"
+ values={Object {}}
+ />
+ </Connect(ModalToggleButtonRedux)>
+ </li>
+</Connect(ChannelPermissionGate)>
+`;

tests/components/channel_header_dropdown/menu_items/set_channel_header.test.jsx

@@ -0,0 +1,48 @@
+// Copyright (c) 2015-present Mattermost, Inc. All Rights Reserved.
+// See LICENSE.txt for license information.
+
+import React from 'react';
+import {shallow} from 'enzyme';
+import {Permissions} from 'mattermost-redux/constants';
+
+import {Constants} from 'utils/constants';
+import {SetChannelHeader} from 'components/channel_header_dropdown/menu_items';
+
+describe('components/ChannelHeaderDropdown/MenuItem.SetChannelHeader', () => {
+ const baseProps = {
+ channel: {
+ id: 'channel_id',
+ team_id: 'team_id',
+ type: Constants.OPEN_CHANNEL,
+ },
+ isReadonly: false,
+ };
+
+ it('should match snapshot', () => {
+ const wrapper = shallow(<SetChannelHeader {...baseProps}/>);
+
+ expect(wrapper).toMatchSnapshot();
+ });
+
+ it('should be hidden if the channel is readonly', () => {
+ const props = {
+ ...baseProps,
+ isReadonly: true,
+ };
+ const wrapper = shallow(<SetChannelHeader {...props}/>);
+
+ expect(wrapper.isEmptyRender()).toBeTruthy();
+ });
+
+ it('should requires right permission to manage header', () => {
+ const makeWrapper = () => shallow(<SetChannelHeader {...baseProps}/>);
+
+ // Public, DM, GM (is this correct?)
+ const forNotPrivate = makeWrapper();
+ expect(forNotPrivate.prop('permissions')[0]).toBe(Permissions.MANAGE_PUBLIC_CHANNEL_PROPERTIES);
+
+ baseProps.channel.type = Constants.PRIVATE_CHANNEL;
+ const forPrivate = makeWrapper();
+ expect(forPrivate.prop('permissions')[0]).toBe(Permissions.MANAGE_PRIVATE_CHANNEL_PROPERTIES);
+ });
+});