toki/mattermost-mobile
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions 1

[MM-23271] Check canAddReaction permission inside of render reactions (#4032)

Browse source 
* MM-23271 check canAddReaction when creating in reactions component

* MM-23271 Fixing linting
This commit is contained in:
Farhan Munshi 2020-03-16 11:29:13 -04:00 committed by GitHub
parent 77fdde091e
commit 217ef59f1c
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
3 changed files with 338 additions and 2 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

289
app/components/reactions/__snapshots__/reactions.test.js.snap Normal file
View file

@ -0,0 +1,289 @@
// Jest Snapshot v1, https://goo.gl/fbAQLP
exports[`Reactions should match snapshot 1`] = `
<View
style={
Object {
"alignContent": "flex-start",
"flex": 1,
"flexDirection": "row",
"flexWrap": "wrap",
}
}
>
<Reaction
count={1}
emojiName="frowning_face"
highlight={true}
onLongPress={[Function]}
onPress={[Function]}
postId="post-id"
theme={
Object {
"awayIndicator": "#ffbc42",
"buttonBg": "#166de0",
"buttonColor": "#ffffff",
"centerChannelBg": "#ffffff",
"centerChannelColor": "#3d3c40",
"codeTheme": "github",
"dndIndicator": "#f74343",
"errorTextColor": "#fd5960",
"linkColor": "#2389d7",
"mentionBg": "#ffffff",
"mentionBj": "#ffffff",
"mentionColor": "#145dbf",
"mentionHighlightBg": "#ffe577",
"mentionHighlightLink": "#166de0",
"newMessageSeparator": "#ff8800",
"onlineIndicator": "#06d6a0",
"sidebarBg": "#145dbf",
"sidebarHeaderBg": "#1153ab",
"sidebarHeaderTextColor": "#ffffff",
"sidebarText": "#ffffff",
"sidebarTextActiveBorder": "#579eff",
"sidebarTextActiveColor": "#ffffff",
"sidebarTextHoverBg": "#4578bf",
"sidebarUnreadText": "#ffffff",
"type": "Mattermost",
}
}
/>
<Reaction
count={1}
emojiName="grinning"
highlight={true}
onLongPress={[Function]}
onPress={[Function]}
postId="post-id"
theme={
Object {
"awayIndicator": "#ffbc42",
"buttonBg": "#166de0",
"buttonColor": "#ffffff",
"centerChannelBg": "#ffffff",
"centerChannelColor": "#3d3c40",
"codeTheme": "github",
"dndIndicator": "#f74343",
"errorTextColor": "#fd5960",
"linkColor": "#2389d7",
"mentionBg": "#ffffff",
"mentionBj": "#ffffff",
"mentionColor": "#145dbf",
"mentionHighlightBg": "#ffe577",
"mentionHighlightLink": "#166de0",
"newMessageSeparator": "#ff8800",
"onlineIndicator": "#06d6a0",
"sidebarBg": "#145dbf",
"sidebarHeaderBg": "#1153ab",
"sidebarHeaderTextColor": "#ffffff",
"sidebarText": "#ffffff",
"sidebarTextActiveBorder": "#579eff",
"sidebarTextActiveColor": "#ffffff",
"sidebarTextHoverBg": "#4578bf",
"sidebarUnreadText": "#ffffff",
"type": "Mattermost",
}
}
/>
<Reaction
count={1}
emojiName="sweat"
highlight={true}
onLongPress={[Function]}
onPress={[Function]}
postId="post-id"
theme={
Object {
"awayIndicator": "#ffbc42",
"buttonBg": "#166de0",
"buttonColor": "#ffffff",
"centerChannelBg": "#ffffff",
"centerChannelColor": "#3d3c40",
"codeTheme": "github",
"dndIndicator": "#f74343",
"errorTextColor": "#fd5960",
"linkColor": "#2389d7",
"mentionBg": "#ffffff",
"mentionBj": "#ffffff",
"mentionColor": "#145dbf",
"mentionHighlightBg": "#ffe577",
"mentionHighlightLink": "#166de0",
"newMessageSeparator": "#ff8800",
"onlineIndicator": "#06d6a0",
"sidebarBg": "#145dbf",
"sidebarHeaderBg": "#1153ab",
"sidebarHeaderTextColor": "#ffffff",
"sidebarText": "#ffffff",
"sidebarTextActiveBorder": "#579eff",
"sidebarTextActiveColor": "#ffffff",
"sidebarTextHoverBg": "#4578bf",
"sidebarUnreadText": "#ffffff",
"type": "Mattermost",
}
}
/>
<TouchableWithFeedbackIOS
onPress={[Function]}
style={
Array [
Object {
"alignItems": "center",
"borderColor": "rgba(61,60,64,0.3)",
"borderRadius": 2,
"borderWidth": 1,
"flexDirection": "row",
"height": 30,
"justifyContent": "center",
"marginBottom": 5,
"marginRight": 6,
"marginTop": 10,
"paddingHorizontal": 6,
"paddingVertical": 2,
"width": 40,
},
]
}
type="opacity"
>
<Image
source={
Object {
"testUri": "../../../dist/assets/images/icons/reaction.png",
}
}
style={
Object {
"height": 20,
"tintColor": "rgba(61,60,64,0.5)",
"width": 23,
}
}
/>
</TouchableWithFeedbackIOS>
</View>
`;
exports[`Reactions should match snapshot with canAddReaction = false 1`] = `
<View
style={
Object {
"alignContent": "flex-start",
"flex": 1,
"flexDirection": "row",
"flexWrap": "wrap",
}
}
>
<Reaction
count={1}
emojiName="frowning_face"
highlight={true}
onLongPress={[Function]}
onPress={[Function]}
postId="post-id"
theme={
Object {
"awayIndicator": "#ffbc42",
"buttonBg": "#166de0",
"buttonColor": "#ffffff",
"centerChannelBg": "#ffffff",
"centerChannelColor": "#3d3c40",
"codeTheme": "github",
"dndIndicator": "#f74343",
"errorTextColor": "#fd5960",
"linkColor": "#2389d7",
"mentionBg": "#ffffff",
"mentionBj": "#ffffff",
"mentionColor": "#145dbf",
"mentionHighlightBg": "#ffe577",
"mentionHighlightLink": "#166de0",
"newMessageSeparator": "#ff8800",
"onlineIndicator": "#06d6a0",
"sidebarBg": "#145dbf",
"sidebarHeaderBg": "#1153ab",
"sidebarHeaderTextColor": "#ffffff",
"sidebarText": "#ffffff",
"sidebarTextActiveBorder": "#579eff",
"sidebarTextActiveColor": "#ffffff",
"sidebarTextHoverBg": "#4578bf",
"sidebarUnreadText": "#ffffff",
"type": "Mattermost",
}
}
/>
<Reaction
count={1}
emojiName="grinning"
highlight={true}
onLongPress={[Function]}
onPress={[Function]}
postId="post-id"
theme={
Object {
"awayIndicator": "#ffbc42",
"buttonBg": "#166de0",
"buttonColor": "#ffffff",
"centerChannelBg": "#ffffff",
"centerChannelColor": "#3d3c40",
"codeTheme": "github",
"dndIndicator": "#f74343",
"errorTextColor": "#fd5960",
"linkColor": "#2389d7",
"mentionBg": "#ffffff",
"mentionBj": "#ffffff",
"mentionColor": "#145dbf",
"mentionHighlightBg": "#ffe577",
"mentionHighlightLink": "#166de0",
"newMessageSeparator": "#ff8800",
"onlineIndicator": "#06d6a0",
"sidebarBg": "#145dbf",
"sidebarHeaderBg": "#1153ab",
"sidebarHeaderTextColor": "#ffffff",
"sidebarText": "#ffffff",
"sidebarTextActiveBorder": "#579eff",
"sidebarTextActiveColor": "#ffffff",
"sidebarTextHoverBg": "#4578bf",
"sidebarUnreadText": "#ffffff",
"type": "Mattermost",
}
}
/>
<Reaction
count={1}
emojiName="sweat"
highlight={true}
onLongPress={[Function]}
onPress={[Function]}
postId="post-id"
theme={
Object {
"awayIndicator": "#ffbc42",
"buttonBg": "#166de0",
"buttonColor": "#ffffff",
"centerChannelBg": "#ffffff",
"centerChannelColor": "#3d3c40",
"codeTheme": "github",
"dndIndicator": "#f74343",
"errorTextColor": "#fd5960",
"linkColor": "#2389d7",
"mentionBg": "#ffffff",
"mentionBj": "#ffffff",
"mentionColor": "#145dbf",
"mentionHighlightBg": "#ffe577",
"mentionHighlightLink": "#166de0",
"newMessageSeparator": "#ff8800",
"onlineIndicator": "#06d6a0",
"sidebarBg": "#145dbf",
"sidebarHeaderBg": "#1153ab",
"sidebarHeaderTextColor": "#ffffff",
"sidebarText": "#ffffff",
"sidebarTextActiveBorder": "#579eff",
"sidebarTextActiveColor": "#ffffff",
"sidebarTextHoverBg": "#4578bf",
"sidebarUnreadText": "#ffffff",
"type": "Mattermost",
}
}
/>
</View>
`;

4
app/components/reactions/reactions.js
View file

@ -133,7 +133,7 @@ export default class Reactions extends PureComponent {
};
render() {
const {position, reactions, canAddMoreReactions} = this.props;
const {position, reactions, canAddMoreReactions, canAddReaction} = this.props;
const styles = getStyleSheet(this.props.theme);
if (!reactions) {
@ -141,7 +141,7 @@ export default class Reactions extends PureComponent {
}
let addMoreReactions = null;
if (canAddMoreReactions) {
if (canAddReaction && canAddMoreReactions) {
addMoreReactions = (
<TouchableWithFeedback
key='addReaction'

47
app/components/reactions/reactions.test.js Normal file
View file

@ -0,0 +1,47 @@
// Copyright (c) 2015-present Mattermost, Inc. All Rights Reserved.
// See LICENSE.txt for license information.
import React from 'react';
import {shallow} from 'enzyme';
import Reactions from './reactions';
import Preferences from 'mattermost-redux/constants/preferences';
describe('Reactions', () => {
const baseProps = {
actions: {
addReaction: jest.fn(),
getReactionsForPost: jest.fn(),
removeReaction: jest.fn(),
},
canAddReaction: true,
canAddMoreReactions: true,
canRemoveReaction: true,
currentUserId: 'current-user-id',
position: 'right',
postId: 'post-id',
reactions: {
'current-user-id-frowning_face': {create_at: 1, emoji_name: 'frowning_face', post_id: 'post-id', user_id: 'current-user-id'},
'current-user-id-grinning': {create_at: 1, emoji_name: 'grinning', post_id: 'post-id', user_id: 'current-user-id'},
'current-user-id-sweat': {create_at: 1, emoji_name: 'sweat', post_id: 'post-id', user_id: 'current-user-id'},
},
theme: Preferences.THEMES.default,
};
test('should match snapshot', () => {
const wrapper = shallow(<Reactions {...baseProps}/>);
expect(wrapper.getElement()).toMatchSnapshot();
});
test('should match snapshot with canAddReaction = false', () => {
const wrapper = shallow(
<Reactions
{...baseProps}
canAddReaction={false}
/>,
);
expect(wrapper.getElement()).toMatchSnapshot();
});
});