Skip to content

Commit

Permalink
MM-12227 Always provide defaults for Channel Notification Settings mo…
Browse files Browse the repository at this point in the history 
…dal (mattermost#1796)
  • Loading branch information
@hmhealey
hmhealey committed Oct 1, 2018
1 parent cad0dc0 commit 6e710d7
Show file tree
Hide file tree
Showing 3 changed files with 58 additions and 119 deletions.
59 changes: 21 additions & 38 deletions components/channel_notifications_modal/channel_notifications_modal.jsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -32,32 +32,31 @@ export default class ChannelNotificationsModal extends React.Component {

this.state = {
activeSection: NotificationSections.NONE,
desktopNotifyLevel: props.channelMember.notify_props.desktop,
markUnreadNotifyLevel: props.channelMember.notify_props.mark_unread,
pushNotifyLevel: props.channelMember.notify_props.push || NotificationLevels.DEFAULT,
serverError: null,
...this.getStateFromNotifyProps(props.channelMember.notify_props),
};
}

componentDidUpdate(prevProps) {
if (!Utils.areObjectsEqual(this.props.channelMember.notify_props, prevProps.channelMember.notify_props)) {
this.setStateFromNotifyProps(this.props.channelMember.notify_props);
this.resetStateFromNotifyProps(this.props.channelMember.notify_props);
}
}

setStateFromNotifyProps(notifyProps) {
this.setState({
desktopNotifyLevel: notifyProps.desktop,
markUnreadNotifyLevel: notifyProps.mark_unread,
resetStateFromNotifyProps(notifyProps) {
this.setState(this.getStateFromNotifyProps(notifyProps));
}

getStateFromNotifyProps(notifyProps) {
return {
desktopNotifyLevel: notifyProps.desktop || NotificationLevels.DEFAULT,
markUnreadNotifyLevel: notifyProps.mark_unread || NotificationLevels.ALL,
pushNotifyLevel: notifyProps.push || NotificationLevels.DEFAULT,
});
};
}

handleOnHide = () => {
this.setState({
activeSection: NotificationSections.NONE,
});

this.setStateFromNotifyProps(this.props.channelMember.notify_props);
this.updateSection('');

this.props.onHide();
}
Expand All @@ -66,7 +65,12 @@ export default class ChannelNotificationsModal extends React.Component {
if ($('.section-max').length) {
$('.settings-modal .modal-body').scrollTop(0).perfectScrollbar('update');
}

this.setState({activeSection: section});

if (section === '') {
this.resetStateFromNotifyProps(this.props.channelMember.notify_props);
}
}

handleUpdateChannelNotifyProps = async (props) => {
Expand Down Expand Up @@ -101,13 +105,6 @@ export default class ChannelNotificationsModal extends React.Component {
this.setState({desktopNotifyLevel});
}

handleUpdateDesktopSection = (section = NotificationSections.NONE) => {
this.updateSection(section);
this.setState({
desktopNotifyLevel: this.props.channelMember.notify_props.desktop,
});
}

handleSubmitMarkUnreadLevel = () => {
const {channelMember} = this.props;
const {markUnreadNotifyLevel} = this.state;
Expand All @@ -125,13 +122,6 @@ export default class ChannelNotificationsModal extends React.Component {
this.setState({markUnreadNotifyLevel});
}

handleUpdateMarkUnreadSection = (section = NotificationSections.NONE) => {
this.updateSection(section);
this.setState({
markUnreadNotifyLevel: this.props.channelMember.notify_props.mark_unread,
});
}

handleSubmitPushNotificationLevel = () => {
const {pushNotifyLevel} = this.state;

Expand All @@ -148,13 +138,6 @@ export default class ChannelNotificationsModal extends React.Component {
this.setState({pushNotifyLevel});
}

handleUpdatePushSection = (section = NotificationSections.NONE) => {
this.updateSection(section);
this.setState({
pushNotifyLevel: this.props.channelMember.notify_props.push,
});
}

render() {
const {
activeSection,
Expand Down Expand Up @@ -208,7 +191,7 @@ export default class ChannelNotificationsModal extends React.Component {
memberNotificationLevel={markUnreadNotifyLevel}
onChange={this.handleUpdateMarkUnreadLevel}
onSubmit={this.handleSubmitMarkUnreadLevel}
onUpdateSection={this.handleUpdateMarkUnreadSection}
onUpdateSection={this.updateSection}
serverError={serverError}
/>
{!isChannelMuted(channelMember) &&
Expand All @@ -221,7 +204,7 @@ export default class ChannelNotificationsModal extends React.Component {
globalNotificationLevel={currentUser.notify_props ? currentUser.notify_props.desktop : NotificationLevels.ALL}
onChange={this.handleUpdateDesktopNotifyLevel}
onSubmit={this.handleSubmitDesktopNotifyLevel}
onUpdateSection={this.handleUpdateDesktopSection}
onUpdateSection={this.updateSection}
serverError={serverError}
/>
<div className='divider-light'/>
Expand All @@ -233,7 +216,7 @@ export default class ChannelNotificationsModal extends React.Component {
globalNotificationLevel={currentUser.notify_props ? currentUser.notify_props.push : NotificationLevels.ALL}
onChange={this.handleUpdatePushNotificationLevel}
onSubmit={this.handleSubmitPushNotificationLevel}
onUpdateSection={this.handleUpdatePushSection}
onUpdateSection={this.updateSection}
serverError={serverError}
/>
}
Expand Down
3 changes: 3 additions & 0 deletions tests/components/__snapshots__/channel_notifications_modal.test.jsx.snap
View file
Original file line number Diff line number Diff line change
Expand Up @@ -73,6 +73,7 @@ exports[`components/channel_notifications_modal/ChannelNotificationsModal should
onSubmit={[Function]}
onUpdateSection={[Function]}
section="markUnread"
serverError={null}
/>
<div>
<div
Expand All @@ -86,6 +87,7 @@ exports[`components/channel_notifications_modal/ChannelNotificationsModal should
onSubmit={[Function]}
onUpdateSection={[Function]}
section="desktop"
serverError={null}
/>
<div
className="divider-light"
Expand All @@ -97,6 +99,7 @@ exports[`components/channel_notifications_modal/ChannelNotificationsModal should
onSubmit={[Function]}
onUpdateSection={[Function]}
section="push"
serverError={null}
/>
</div>
<div
Expand Down
115 changes: 34 additions & 81 deletions tests/components/channel_notifications_modal.test.jsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -16,6 +16,7 @@ describe('components/channel_notifications_modal/ChannelNotificationsModal', ()
notify_props: {
desktop: NotificationLevels.ALL,
mark_unread: NotificationLevels.ALL,
push: NotificationLevels.DEFAULT,
},
},
currentUser: {
Expand All @@ -38,6 +39,19 @@ describe('components/channel_notifications_modal/ChannelNotificationsModal', ()
expect(wrapper).toMatchSnapshot();
});

test('should provide default notify props when missing', () => {
const wrapper = shallow(
<ChannelNotificationsModal
{...baseProps}
channelMember={{notify_props: {}}}
/>
);

expect(wrapper.state('desktopNotifyLevel')).toEqual(NotificationLevels.DEFAULT);
expect(wrapper.state('markUnreadNotifyLevel')).toEqual(NotificationLevels.ALL);
expect(wrapper.state('pushNotifyLevel')).toEqual(NotificationLevels.DEFAULT);
});

test('should call onHide and match state on handleOnHide', () => {
const onHide = jest.fn();
const props = {...baseProps, onHide};
Expand Down Expand Up @@ -74,6 +88,21 @@ describe('components/channel_notifications_modal/ChannelNotificationsModal', ()
expect(wrapper.state('activeSection')).toEqual(NotificationSections.DESKTOP);
});

test('should reset state when collapsing a section', () => {
const wrapper = shallow(
<ChannelNotificationsModal {...baseProps}/>
);

wrapper.instance().updateSection(NotificationSections.DESKTOP);
wrapper.instance().handleUpdateDesktopNotifyLevel(NotificationLevels.NONE);

expect(wrapper.state('desktopNotifyLevel')).toEqual(NotificationLevels.NONE);

wrapper.instance().updateSection('');

expect(wrapper.state('desktopNotifyLevel')).toEqual(baseProps.channelMember.notify_props.desktop);
});

test('should match state on handleSubmitDesktopNotifyLevel', () => {
const wrapper = shallow(
<ChannelNotificationsModal {...baseProps}/>
Expand Down Expand Up @@ -103,26 +132,6 @@ describe('components/channel_notifications_modal/ChannelNotificationsModal', ()
expect(wrapper.state('desktopNotifyLevel')).toEqual(NotificationLevels.MENTION);
});

test('should match state on handleUpdateDesktopSection', () => {
const wrapper = shallow(
<ChannelNotificationsModal {...baseProps}/>
);

const instance = wrapper.instance();
instance.updateSection = jest.fn();

wrapper.setState({desktopNotifyLevel: NotificationLevels.NONE});
instance.handleUpdateDesktopSection();
expect(wrapper.state('desktopNotifyLevel')).toEqual(NotificationLevels.ALL);

expect(instance.updateSection).toHaveBeenCalledTimes(1);
expect(instance.updateSection).toBeCalledWith(NotificationSections.NONE);

instance.handleUpdateDesktopSection(NotificationSections.DESKTOP);
expect(instance.updateSection).toHaveBeenCalledTimes(2);
expect(instance.updateSection).toBeCalledWith(NotificationSections.DESKTOP);
});

test('should match state on handleSubmitMarkUnreadLevel', () => {
const channelMember = {
notify_props: {
Expand Down Expand Up @@ -166,33 +175,6 @@ describe('components/channel_notifications_modal/ChannelNotificationsModal', ()
expect(wrapper.state('markUnreadNotifyLevel')).toEqual(NotificationLevels.MENTION);
});

test('should match state on handleUpdateMarkUnreadSection', () => {
const channelMember = {
notify_props: {
desktop: NotificationLevels.NONE,
mark_unread: NotificationLevels.ALL,
},
};
const props = {...baseProps, channelMember};
const wrapper = shallow(
<ChannelNotificationsModal {...props}/>
);

const instance = wrapper.instance();
instance.updateSection = jest.fn();

wrapper.setState({markUnreadNotifyLevel: NotificationLevels.NONE});
instance.handleUpdateMarkUnreadSection();
expect(wrapper.state('markUnreadNotifyLevel')).toEqual(NotificationLevels.ALL);

expect(instance.updateSection).toHaveBeenCalledTimes(1);
expect(instance.updateSection).toBeCalledWith(NotificationSections.NONE);

instance.handleUpdateMarkUnreadSection(NotificationSections.MARK_UNREAD);
expect(instance.updateSection).toHaveBeenCalledTimes(2);
expect(instance.updateSection).toBeCalledWith(NotificationSections.MARK_UNREAD);
});

test('should match state on handleSubmitPushNotificationLevel', () => {
const channelMember = {
notify_props: {
Expand Down Expand Up @@ -238,36 +220,7 @@ describe('components/channel_notifications_modal/ChannelNotificationsModal', ()
expect(wrapper.state('pushNotifyLevel')).toEqual(NotificationLevels.MENTION);
});

test('should match state on handleUpdatePushSection', () => {
const channelMember = {
notify_props: {
desktop: NotificationLevels.NONE,
mark_unread: NotificationLevels.NONE,
push: NotificationLevels.ALL,
},
};

const props = {...baseProps, channelMember};
const wrapper = shallow(
<ChannelNotificationsModal {...props}/>
);

const instance = wrapper.instance();
instance.updateSection = jest.fn();

wrapper.setState({pushNotifyLevel: NotificationLevels.NONE});
instance.handleUpdatePushSection();
expect(wrapper.state('pushNotifyLevel')).toEqual(NotificationLevels.ALL);

expect(instance.updateSection).toHaveBeenCalledTimes(1);
expect(instance.updateSection).toBeCalledWith(NotificationSections.NONE);

instance.handleUpdatePushSection(NotificationSections.PUSH);
expect(instance.updateSection).toHaveBeenCalledTimes(2);
expect(instance.updateSection).toBeCalledWith(NotificationSections.PUSH);
});

test('should match state on setStateFromNotifyProps', () => {
test('should match state on resetStateFromNotifyProps', () => {
const notifyProps = {
desktop: NotificationLevels.NONE,
mark_unread: NotificationLevels.NONE,
Expand All @@ -278,18 +231,18 @@ describe('components/channel_notifications_modal/ChannelNotificationsModal', ()
<ChannelNotificationsModal {...baseProps}/>
);

wrapper.instance().setStateFromNotifyProps(notifyProps);
wrapper.instance().resetStateFromNotifyProps(notifyProps);
expect(wrapper.state('desktopNotifyLevel')).toEqual(NotificationLevels.NONE);
expect(wrapper.state('markUnreadNotifyLevel')).toEqual(NotificationLevels.NONE);
expect(wrapper.state('pushNotifyLevel')).toEqual(NotificationLevels.ALL);

wrapper.instance().setStateFromNotifyProps({...notifyProps, desktop: NotificationLevels.ALL});
wrapper.instance().resetStateFromNotifyProps({...notifyProps, desktop: NotificationLevels.ALL});
expect(wrapper.state('desktopNotifyLevel')).toEqual(NotificationLevels.ALL);

wrapper.instance().setStateFromNotifyProps({...notifyProps, mark_unread: NotificationLevels.ALL});
wrapper.instance().resetStateFromNotifyProps({...notifyProps, mark_unread: NotificationLevels.ALL});
expect(wrapper.state('markUnreadNotifyLevel')).toEqual(NotificationLevels.ALL);

wrapper.instance().setStateFromNotifyProps({...notifyProps, push: NotificationLevels.NONE});
wrapper.instance().resetStateFromNotifyProps({...notifyProps, push: NotificationLevels.NONE});
expect(wrapper.state('pushNotifyLevel')).toEqual(NotificationLevels.NONE);
});
});

0 comments on commit 6e710d7

Please sign in to comment.