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

Automated cherry pick of #3087 (#3106)

Browse source 
* Add flex 1

* Add snapshot test

* Fix placeholder text color
This commit is contained in:
Mattermost Build 2019-08-12 16:13:29 +02:00 committed by Elias Nahum
parent e7042e4907
commit 3ed078f4ce
4 changed files with 287 additions and 1 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

5
app/components/text_input_with_localized_placeholder.js
View file

@ -14,6 +14,10 @@ export default class TextInputWithLocalizedPlaceholder extends PureComponent {
placeholder: PropTypes.object.isRequired,
};
static defaultProps = {
placeholderTextColor: changeOpacity('#000', 0.5),
};
static contextTypes = {
intl: intlShape.isRequired,
};
@ -39,7 +43,6 @@ export default class TextInputWithLocalizedPlaceholder extends PureComponent {
ref='input'
{...otherProps}
placeholder={placeholderString}
placeholderTextColor={changeOpacity('#000', 0.5)}
disableFullscreenUI={true}
/>
);

252
app/screens/settings/notification_settings_mentions_keywords/__snapshots__/notification_settings_mentions_keywords.test.js.snap Normal file
View file

@ -0,0 +1,252 @@
// Jest Snapshot v1, https://goo.gl/fbAQLP
exports[`NotificationSettingsMentionsKeywords should match snapshot 1`] = `
NotificationSettingsMentionsKeywords {
"context": Object {},
"handleSubmit": [Function],
"keywordsRef": [Function],
"navigationEventListener": Object {
"remove": [Function],
},
"onKeywordsChangeText": [Function],
"props": Object {
"actions": Object {
"popTopScreen": [MockFunction],
},
"componentId": "component-id",
"intl": Object {
"defaultFormats": Object {},
"defaultLocale": "en",
"formatDate": [Function],
"formatHTMLMessage": [Function],
"formatMessage": [Function],
"formatNumber": [Function],
"formatPlural": [Function],
"formatRelative": [Function],
"formatTime": [Function],
"formats": Object {},
"formatters": Object {
"getDateTimeFormat": [Function],
"getMessageFormat": [Function],
"getNumberFormat": [Function],
"getPluralFormat": [Function],
"getRelativeFormat": [Function],
},
"locale": "en",
"messages": Object {},
"now": [Function],
"onError": [Function],
"textComponent": "span",
"timeZone": null,
},
"keywords": "",
"onBack": [MockFunction],
"theme": Object {
"awayIndicator": "#ffbc42",
"buttonBg": "#166de0",
"buttonColor": "#ffffff",
"centerChannelBg": "#ffffff",
"centerChannelColor": "#3d3c40",
"codeTheme": "github",
"dndIndicator": "#f74343",
"errorTextColor": "#fd5960",
"linkColor": "#2389d7",
"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",
},
},
"refs": Object {},
"setState": [Function],
"state": Object {
"keywords": "",
},
"updater": Updater {
"_callbacks": Array [],
"_renderer": ReactShallowRenderer {
"_context": Object {},
"_didScheduleRenderPhaseUpdate": false,
"_dispatcher": Object {
"readContext": [Function],
"useCallback": [Function],
"useContext": [Function],
"useDebugValue": [Function],
"useEffect": [Function],
"useImperativeHandle": [Function],
"useLayoutEffect": [Function],
"useMemo": [Function],
"useReducer": [Function],
"useRef": [Function],
"useState": [Function],
},
"_element": <NotificationSettingsMentionsKeywords
actions={
Object {
"popTopScreen": [MockFunction],
}
}
componentId="component-id"
intl={
Object {
"defaultFormats": Object {},
"defaultLocale": "en",
"formatDate": [Function],
"formatHTMLMessage": [Function],
"formatMessage": [Function],
"formatNumber": [Function],
"formatPlural": [Function],
"formatRelative": [Function],
"formatTime": [Function],
"formats": Object {},
"formatters": Object {
"getDateTimeFormat": [Function],
"getMessageFormat": [Function],
"getNumberFormat": [Function],
"getPluralFormat": [Function],
"getRelativeFormat": [Function],
},
"locale": "en",
"messages": Object {},
"now": [Function],
"onError": [Function],
"textComponent": "span",
"timeZone": null,
}
}
keywords=""
onBack={[MockFunction]}
theme={
Object {
"awayIndicator": "#ffbc42",
"buttonBg": "#166de0",
"buttonColor": "#ffffff",
"centerChannelBg": "#ffffff",
"centerChannelColor": "#3d3c40",
"codeTheme": "github",
"dndIndicator": "#f74343",
"errorTextColor": "#fd5960",
"linkColor": "#2389d7",
"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",
}
}
/>,
"_firstWorkInProgressHook": null,
"_forcedUpdate": false,
"_instance": [Circular],
"_isReRender": false,
"_newState": null,
"_numberOfReRenders": 0,
"_renderPhaseUpdates": null,
"_rendered": <View
style={
Object {
"backgroundColor": "#ffffff",
"flex": 1,
}
}
>
<Connect(StatusBar) />
<ScrollViewMock
alwaysBounceVertical={false}
contentContainerStyle={
Object {
"backgroundColor": "rgba(61,60,64,0.06)",
"flex": 1,
"paddingTop": 35,
}
}
>
<View
style={
Object {
"backgroundColor": "#ffffff",
"borderBottomColor": "rgba(61,60,64,0.1)",
"borderBottomWidth": 1,
"borderTopColor": "rgba(61,60,64,0.1)",
"borderTopWidth": 1,
}
}
>
<TextInputWithLocalizedPlaceholder
autoCapitalize="none"
autoCorrect={false}
autoFocus={true}
blurOnSubmit={true}
multiline={true}
numberOfLines={1}
onChangeText={[Function]}
onSubmitEditing={[Function]}
placeholder={
Object {
"defaultMessage": "Other words that trigger a mention",
"id": "mobile.notification_settings_mentions.keywordsDescription",
}
}
placeholderTextColor="rgba(61,60,64,0.4)"
returnKeyType="done"
style={
Object {
"color": "#3d3c40",
"fontSize": 15,
"height": 150,
"paddingHorizontal": 15,
"paddingVertical": 10,
}
}
value=""
/>
</View>
<View
style={
Object {
"marginTop": 10,
"paddingHorizontal": 15,
}
}
>
<FormattedText
defaultMessage="Keywords are non-case sensitive and should be separated by a comma."
id="mobile.notification_settings_mentions.keywordsHelp"
style={
Object {
"color": "rgba(61,60,64,0.4)",
"fontSize": 13,
}
}
/>
</View>
</ScrollViewMock>
</View>,
"_rendering": false,
"_updater": [Circular],
"_workInProgressHook": null,
},
},
}
`;

1
app/screens/settings/notification_settings_mentions_keywords/notification_settings_mentions_keywords.js
View file

@ -107,6 +107,7 @@ const getStyleSheet = makeStyleSheetFromTheme((theme) => {
},
wrapper: {
backgroundColor: changeOpacity(theme.centerChannelColor, 0.06),
flex: 1,
paddingTop: 35,
},
inputContainer: {

30
app/screens/settings/notification_settings_mentions_keywords/notification_settings_mentions_keywords.test.js Normal file
View file

@ -0,0 +1,30 @@
// Copyright (c) 2015-present Mattermost, Inc. All Rights Reserved.
// See LICENSE.txt for license information.
import React from 'react';
import Preferences from 'mattermost-redux/constants/preferences';
import {shallowWithIntl} from 'test/intl-test-helper';
import NotificationSettingsMentionsKeywords from './notification_settings_mentions_keywords';
describe('NotificationSettingsMentionsKeywords', () => {
const baseProps = {
actions: {
popTopScreen: jest.fn(),
},
componentId: 'component-id',
keywords: '',
onBack: jest.fn(),
theme: Preferences.THEMES.default,
};
test('should match snapshot', () => {
const wrapper = shallowWithIntl(
<NotificationSettingsMentionsKeywords {...baseProps}/>
);
expect(wrapper.instance()).toMatchSnapshot();
});
});