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

RN-36 Update status bar color (#606)

Browse source
This commit is contained in:
enahum 2017-06-08 15:10:59 -04:00 committed by Harrison Healey
parent 68b8bcdc42
commit f1c9f1051c
28 changed files with 133 additions and 42 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

34
NOTICE.txt
View file

@ -1022,3 +1022,37 @@ OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
SOFTWARE.
---
## TinyColor
This product contains 'tinycolor', a small, fast library for color manipulation and conversion in JavaScript. It allows many forms of input, while providing color conversions and other color utility functions
* HOMEPAGE
* https://github.com/bgrins/TinyColor
* LICENSE
MIT License
Copyright (c), Brian Grinstead, http://briangrinstead.com
Permission is hereby granted, free of charge, to any person obtaining
a copy of this software and associated documentation files (the
"Software"), to deal in the Software without restriction, including
without limitation the rights to use, copy, modify, merge, publish,
distribute, sublicense, and/or sell copies of the Software, and to
permit persons to whom the Software is furnished to do so, subject to
the following conditions:
The above copyright notice and this permission notice shall be
included in all copies or substantial portions of the Software.
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND,
EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF
MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND
NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE
LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION
OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION
WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.
---

2
app/components/autocomplete/at_mention/at_mention.js
View file

@ -124,7 +124,7 @@ export default class AtMention extends Component {
defaultMessage: 'Notifies everyone in the channel'
}, {
completeHandle: 'here',
id: 'suggestions.mention.here',
id: 'suggestion.mention.here',
defaultMessage: 'Notifies everyone in the channel and online'
}];
};

2
app/components/autocomplete/channel_mention/channel_mention.js
View file

@ -194,7 +194,7 @@ export default class ChannelMention extends Component {
return (
<View style={style.loading}>
<FormattedText
id='analytics.chart.loading": "Loading...'
id='analytics.chart.loading'
defaultMessage='Loading...'
style={style.sectionText}
/>

17
app/components/status_bar/index.js Normal file
View file

@ -0,0 +1,17 @@
// Copyright (c) 2017-present Mattermost, Inc. All Rights Reserved.
// See License.txt for license information.
import {connect} from 'react-redux';
import {getTheme} from 'app/selectors/preferences';
import StatusBar from './status_bar';
function mapStateToProps(state, ownProps) {
return {
...ownProps,
theme: getTheme(state)
};
}
export default connect(mapStateToProps)(StatusBar);

24
app/components/status_bar/status_bar.js Normal file
View file

@ -0,0 +1,24 @@
// Copyright (c) 2016-present Mattermost, Inc. All Rights Reserved.
// See License.txt for license information.
import React, {PureComponent} from 'react';
import PropTypes from 'prop-types';
import {StatusBar as NativeStatusBar} from 'react-native';
import tinyColor from 'tinycolor2';
export default class StatusBar extends PureComponent {
static propTypes = {
theme: PropTypes.object.isRequired
};
render() {
const {theme} = this.props;
const headerColor = tinyColor(theme.sidebarHeaderBg);
let barStyle = 'light-content';
if (headerColor.isLight()) {
barStyle = 'dark-content';
}
return <NativeStatusBar barStyle={barStyle}/>;
}
}

2
app/screens/about/about.js
View file

@ -14,6 +14,7 @@ import {
import DeviceInfo from 'react-native-device-info';
import FormattedText from 'app/components/formatted_text';
import StatusBar from 'app/components/status_bar';
import {changeOpacity, makeStyleSheetFromTheme} from 'app/utils/theme';
import MattermostIcon from 'app/components/mattermost_icon';
@ -157,6 +158,7 @@ export default class About extends PureComponent {
return (
<View style={style.wrapper}>
<StatusBar/>
<ScrollView
style={style.scrollView}
contentContainerStyle={style.scrollViewContent}

6
app/screens/account_notifications/account_notifications.js
View file

@ -8,7 +8,6 @@ import {
Keyboard,
Platform,
ScrollView,
StatusBar,
StyleSheet,
View
} from 'react-native';
@ -17,6 +16,7 @@ import {Preferences, RequestStatus} from 'mattermost-redux/constants';
import {getPreferencesByCategory} from 'mattermost-redux/utils/preference_utils';
import Loading from 'app/components/loading';
import StatusBar from 'app/components/status_bar';
import TextInputWithLocalizedPlaceholder from 'app/components/text_input_with_localized_placeholder';
import {changeOpacity, makeStyleSheetFromTheme} from 'app/utils/theme';
@ -543,7 +543,7 @@ class AccountNotifications extends PureComponent {
if (this.state.saving) {
return (
<View style={style.wrapper}>
<StatusBar barStyle='light-content'/>
<StatusBar/>
<Loading/>
</View>
);
@ -551,7 +551,7 @@ class AccountNotifications extends PureComponent {
return (
<View style={style.wrapper}>
<StatusBar barStyle='light-content'/>
<StatusBar/>
<ScrollView
style={style.scrollView}
contentContainerStyle={style.scrollViewContent}

4
app/screens/account_settings/account_settings.js
View file

@ -6,13 +6,13 @@ import PropTypes from 'prop-types';
import {injectIntl, intlShape} from 'react-intl';
import {
StyleSheet,
StatusBar,
TouchableOpacity,
View
} from 'react-native';
import Icon from 'react-native-vector-icons/FontAwesome';
import FormattedText from 'app/components/formatted_text';
import StatusBar from 'app/components/status_bar';
import {preventDoubleTap} from 'app/utils/tap';
import {changeOpacity, makeStyleSheetFromTheme} from 'app/utils/theme';
@ -96,7 +96,7 @@ class AccountSettings extends PureComponent {
return (
<View style={style.wrapper}>
<StatusBar barStyle='light-content'/>
<StatusBar/>
<View style={style.container}>
<View style={style.itemsContainer}>
{this.renderItems()}

4
app/screens/channel/channel.js
View file

@ -8,7 +8,6 @@ import {
Dimensions,
NetInfo,
Platform,
StatusBar,
StyleSheet,
View
} from 'react-native';
@ -21,6 +20,7 @@ import KeyboardLayout from 'app/components/layout/keyboard_layout';
import Loading from 'app/components/loading';
import OfflineIndicator from 'app/components/offline_indicator';
import PostTextbox from 'app/components/post_textbox';
import StatusBar from 'app/components/status_bar';
import {preventDoubleTap} from 'app/utils/tap';
import {makeStyleSheetFromTheme} from 'app/utils/theme';
@ -187,7 +187,7 @@ class Channel extends PureComponent {
blurPostTextBox={this.blurPostTextBox}
navigator={navigator}
>
<StatusBar barStyle='light-content'/>
<StatusBar/>
<KeyboardLayout
behavior='padding'
style={{flex: 1, backgroundColor: theme.centerChannelBg}}

6
app/screens/channel_add_members/channel_add_members.js
View file

@ -9,7 +9,6 @@ import {
Keyboard,
Platform,
InteractionManager,
StatusBar,
StyleSheet,
View
} from 'react-native';
@ -17,6 +16,7 @@ import {
import Loading from 'app/components/loading';
import MemberList from 'app/components/custom_list';
import SearchBar from 'app/components/search_bar';
import StatusBar from 'app/components/status_bar';
import {createMembersSections, loadingText, markSelectedProfiles, renderMemberRow} from 'app/utils/member_list';
import {changeOpacity, makeStyleSheetFromTheme} from 'app/utils/theme';
@ -251,7 +251,7 @@ class ChannelAddMembers extends PureComponent {
if (adding) {
return (
<View style={style.container}>
<StatusBar barStyle='light-content'/>
<StatusBar/>
<Loading/>
</View>
);
@ -259,7 +259,7 @@ class ChannelAddMembers extends PureComponent {
return (
<View style={style.container}>
<StatusBar barStyle='light-content'/>
<StatusBar/>
<View
style={{marginVertical: 5}}
>

4
app/screens/channel_info/channel_info.js
View file

@ -7,11 +7,11 @@ import {injectIntl, intlShape} from 'react-intl';
import {
Alert,
ScrollView,
StatusBar,
StyleSheet,
View
} from 'react-native';
import StatusBar from 'app/components/status_bar';
import {preventDoubleTap} from 'app/utils/tap';
import {changeOpacity, makeStyleSheetFromTheme} from 'app/utils/theme';
@ -221,7 +221,7 @@ class ChannelInfo extends PureComponent {
return (
<View style={style.container}>
<StatusBar barStyle='light-content'/>
<StatusBar/>
<ScrollView
style={style.scrollView}
>

6
app/screens/channel_members/channel_members.js
View file

@ -8,7 +8,6 @@ import {
Keyboard,
Platform,
InteractionManager,
StatusBar,
StyleSheet,
View
} from 'react-native';
@ -17,6 +16,7 @@ import {injectIntl, intlShape} from 'react-intl';
import Loading from 'app/components/loading';
import MemberList from 'app/components/custom_list';
import SearchBar from 'app/components/search_bar';
import StatusBar from 'app/components/status_bar';
import {createMembersSections, loadingText, markSelectedProfiles} from 'app/utils/member_list';
import MemberListRow from 'app/components/custom_list/member_list_row';
import {changeOpacity, makeStyleSheetFromTheme} from 'app/utils/theme';
@ -306,7 +306,7 @@ class ChannelMembers extends PureComponent {
if (removing) {
return (
<View style={style.container}>
<StatusBar barStyle='light-content'/>
<StatusBar/>
<Loading/>
</View>
);
@ -314,7 +314,7 @@ class ChannelMembers extends PureComponent {
return (
<View style={style.container}>
<StatusBar barStyle='light-content'/>
<StatusBar/>
<View
style={{marginVertical: 5}}
>

6
app/screens/create_channel/create_channel.js
View file

@ -8,7 +8,6 @@ import {
Keyboard,
InteractionManager,
Platform,
StatusBar,
StyleSheet,
TouchableWithoutFeedback,
View,
@ -22,6 +21,7 @@ import EventEmitter from 'mattermost-redux/utils/event_emitter';
import ErrorText from 'app/components/error_text';
import FormattedText from 'app/components/formatted_text';
import Loading from 'app/components/loading';
import StatusBar from 'app/components/status_bar';
import TextInputWithLocalizedPlaceholder from 'app/components/text_input_with_localized_placeholder';
import {changeOpacity, makeStyleSheetFromTheme} from 'app/utils/theme';
@ -219,7 +219,7 @@ class CreateChannel extends PureComponent {
if (creating) {
return (
<View style={{flex: 1}}>
<StatusBar barStyle='light-content'/>
<StatusBar/>
<Loading/>
</View>
);
@ -238,7 +238,7 @@ class CreateChannel extends PureComponent {
return (
<View style={{flex: 1}}>
<StatusBar barStyle='light-content'/>
<StatusBar/>
<KeyboardAwareScrollView
ref={this.scrollRef}
style={style.container}

6
app/screens/edit_post/edit_post.js
View file

@ -6,7 +6,6 @@ import {injectIntl, intlShape} from 'react-intl';
import {
Dimensions,
Platform,
StatusBar,
StyleSheet,
View
} from 'react-native';
@ -14,6 +13,7 @@ import {
import ErrorText from 'app/components/error_text';
import KeyboardLayout from 'app/components/layout/keyboard_layout';
import Loading from 'app/components/loading';
import StatusBar from 'app/components/status_bar';
import TextInputWithLocalizedPlaceholder from 'app/components/text_input_with_localized_placeholder';
import {changeOpacity, makeStyleSheetFromTheme} from 'app/utils/theme';
@ -160,7 +160,7 @@ class EditPost extends PureComponent {
if (editing) {
return (
<View style={style.container}>
<StatusBar barStyle='light-content'/>
<StatusBar/>
<Loading/>
</View>
);
@ -183,7 +183,7 @@ class EditPost extends PureComponent {
style={style.container}
keyboardVerticalOffset={0}
>
<StatusBar barStyle='light-content'/>
<StatusBar/>
<View style={style.scrollView}>
{displayError}
<View style={[style.inputContainer, {height: Platform.OS === 'android' ? (height / 2) - 20 : (height / 2)}]}>

5
app/screens/load_team/load_team.js
View file

@ -3,11 +3,12 @@
import React, {PureComponent} from 'react';
import PropTypes from 'prop-types';
import {StatusBar, View} from 'react-native';
import {View} from 'react-native';
import {RequestStatus} from 'mattermost-redux/constants';
import ChannelLoader from 'app/components/channel_loader';
import StatusBar from 'app/components/status_bar';
export default class LoadTeam extends PureComponent {
static propTypes = {
@ -81,7 +82,7 @@ export default class LoadTeam extends PureComponent {
render() {
return (
<View style={{flex: 1}}>
<StatusBar barStyle='light-content'/>
<StatusBar/>
<ChannelLoader theme={this.props.theme}/>
</View>
);

4
app/screens/login/login.js
View file

@ -11,7 +11,6 @@ import {
Keyboard,
KeyboardAvoidingView,
Platform,
StatusBar,
Text,
TextInput,
TouchableWithoutFeedback,
@ -21,6 +20,7 @@ import Button from 'react-native-button';
import ErrorText from 'app/components/error_text';
import FormattedText from 'app/components/formatted_text';
import StatusBar from 'app/components/status_bar';
import PushNotifications from 'app/push_notifications';
import {GlobalStyles} from 'app/styles';
@ -316,7 +316,7 @@ class Login extends PureComponent {
style={{flex: 1}}
keyboardVerticalOffset={Platform.OS === 'ios' ? 65 : 0}
>
<StatusBar barStyle='light-content'/>
<StatusBar/>
<TouchableWithoutFeedback onPress={this.blur}>
<View style={[GlobalStyles.container, GlobalStyles.signupContainer]}>
<Image

4
app/screens/login_options/login_options.js
View file

@ -6,7 +6,6 @@ import PropTypes from 'prop-types';
import {injectIntl, intlShape} from 'react-intl';
import {
Image,
StatusBar,
Text,
View
} from 'react-native';
@ -15,6 +14,7 @@ import semver from 'semver';
import {ViewTypes} from 'app/constants';
import FormattedText from 'app/components/formatted_text';
import StatusBar from 'app/components/status_bar';
import {GlobalStyles} from 'app/styles';
import {preventDoubleTap} from 'app/utils/tap';
@ -137,7 +137,7 @@ class LoginOptions extends PureComponent {
render() {
return (
<View style={[GlobalStyles.container, GlobalStyles.signupContainer]}>
<StatusBar barStyle='light-content'/>
<StatusBar/>
<Image
source={logo}
/>

2
app/screens/mfa/mfa.js
View file

@ -16,6 +16,7 @@ import Button from 'react-native-button';
import ErrorText from 'app/components/error_text';
import FormattedText from 'app/components/formatted_text';
import StatusBar from 'app/components/status_bar';
import TextInputWithLocalizedPlaceholder from 'app/components/text_input_with_localized_placeholder';
import {GlobalStyles} from 'app/styles';
@ -132,6 +133,7 @@ export default class Mfa extends PureComponent {
style={{flex: 1}}
keyboardVerticalOffset={5}
>
<StatusBar/>
<TouchableWithoutFeedback onPress={this.blur}>
<View style={[GlobalStyles.container, GlobalStyles.signupContainer]}>
<Image

4
app/screens/more_channels/more_channels.js
View file

@ -8,7 +8,6 @@ import {
Keyboard,
Platform,
InteractionManager,
StatusBar,
StyleSheet,
View
} from 'react-native';
@ -20,6 +19,7 @@ import ChannelList from 'app/components/custom_list';
import ChannelListRow from 'app/components/custom_list/channel_list_row';
import Loading from 'app/components/loading';
import SearchBar from 'app/components/search_bar';
import StatusBar from 'app/components/status_bar';
import {makeStyleSheetFromTheme, changeOpacity} from 'app/utils/theme';
class MoreChannels extends PureComponent {
@ -310,7 +310,7 @@ class MoreChannels extends PureComponent {
return (
<View style={style.container}>
<StatusBar barStyle='light-content'/>
<StatusBar/>
{content}
</View>
);

6
app/screens/more_dms/more_dms.js
View file

@ -8,7 +8,6 @@ import {
Keyboard,
Platform,
InteractionManager,
StatusBar,
StyleSheet,
View
} from 'react-native';
@ -20,6 +19,7 @@ import {filterProfilesMatchingTerm} from 'mattermost-redux/utils/user_utils';
import Loading from 'app/components/loading';
import MemberList from 'app/components/custom_list';
import SearchBar from 'app/components/search_bar';
import StatusBar from 'app/components/status_bar';
import {createMembersSections, loadingText, renderMemberRow} from 'app/utils/member_list';
import {makeStyleSheetFromTheme, changeOpacity} from 'app/utils/theme';
@ -178,14 +178,14 @@ class MoreDirectMessages extends PureComponent {
if (adding) {
content = (
<View style={style.container}>
<StatusBar barStyle='light-content'/>
<StatusBar/>
<Loading/>
</View>
);
} else {
content = (
<View style={style.container}>
<StatusBar barStyle='light-content'/>
<StatusBar/>
<View
style={{marginVertical: 5}}
>

5
app/screens/select_server/select_server.js
View file

@ -10,7 +10,6 @@ import {
Keyboard,
KeyboardAvoidingView,
Platform,
StatusBar,
TouchableWithoutFeedback,
View
} from 'react-native';
@ -22,7 +21,7 @@ import {Client, Client4} from 'mattermost-redux/client';
import ErrorText from 'app/components/error_text';
import FormattedText from 'app/components/formatted_text';
import StatusBar from 'app/components/status_bar';
import TextInputWithLocalizedPlaceholder from 'app/components/text_input_with_localized_placeholder';
import {GlobalStyles} from 'app/styles';
import {isValidUrl, stripTrailingSlashes} from 'app/utils/url';
@ -187,7 +186,7 @@ class SelectServer extends PureComponent {
style={{flex: 1}}
keyboardVerticalOffset={0}
>
<StatusBar barStyle='dark-content'/>
<StatusBar/>
<TouchableWithoutFeedback onPress={this.blur}>
<View style={[GlobalStyles.container, GlobalStyles.signupContainer]}>
<Image

2
app/screens/select_team/select_team.js
View file

@ -16,6 +16,7 @@ import EventEmitter from 'mattermost-redux/utils/event_emitter';
import FormattedText from 'app/components/formatted_text';
import Loading from 'app/components/loading';
import StatusBar from 'app/components/status_bar';
import {preventDoubleTap} from 'app/utils/tap';
import {changeOpacity, makeStyleSheetFromTheme} from 'app/utils/theme';
@ -124,6 +125,7 @@ export default class SelectTeam extends PureComponent {
return (
<View style={styles.container}>
<StatusBar/>
<View style={styles.headingContainer}>
<View style={styles.headingWrapper}>
<FormattedText

2
app/screens/settings/settings.js
View file

@ -13,6 +13,7 @@ import {
} from 'react-native';
import DeviceInfo from 'react-native-device-info';
import StatusBar from 'app/components/status_bar';
import {preventDoubleTap} from 'app/utils/tap';
import {changeOpacity, makeStyleSheetFromTheme} from 'app/utils/theme';
@ -152,6 +153,7 @@ class Settings extends PureComponent {
return (
<View style={style.container}>
<StatusBar/>
<View style={style.wrapper}>
<SettingsItem
defaultMessage='Account Settings'

6
app/screens/sso/sso.js
View file

@ -6,7 +6,6 @@ import PropTypes from 'prop-types';
import {injectIntl, intlShape} from 'react-intl';
import {
InteractionManager,
StatusBar,
View,
WebView
} from 'react-native';
@ -16,6 +15,7 @@ import {Client4} from 'mattermost-redux/client';
import {ViewTypes} from 'app/constants';
import Loading from 'app/components/loading';
import StatusBar from 'app/components/status_bar';
import PushNotifications from 'app/push_notifications';
class SSO extends PureComponent {
@ -111,7 +111,7 @@ class SSO extends PureComponent {
if (!this.state || !this.state.renderWebview) {
return (
<View style={{flex: 1}}>
<StatusBar barStyle='light-content'/>
<StatusBar/>
<Loading/>
</View>
);
@ -119,7 +119,7 @@ class SSO extends PureComponent {
return (
<View style={{flex: 1}}>
<StatusBar barStyle='light-content'/>
<StatusBar/>
<WebView
source={{uri: this.loginUrl}}
javaScriptEnabledAndroid={true}

5
app/screens/thread/thread.js
View file

@ -3,11 +3,12 @@
import React, {PureComponent} from 'react';
import PropTypes from 'prop-types';
import {StatusBar, StyleSheet} from 'react-native';
import {StyleSheet} from 'react-native';
import KeyboardLayout from 'app/components/layout/keyboard_layout';
import PostList from 'app/components/post_list';
import PostTextbox from 'app/components/post_textbox';
import StatusBar from 'app/components/status_bar';
import {makeStyleSheetFromTheme} from 'app/utils/theme';
export default class Thread extends PureComponent {
@ -52,7 +53,7 @@ export default class Thread extends PureComponent {
style={style.container}
keyboardVerticalOffset={65}
>
<StatusBar barStyle='light-content'/>
<StatusBar/>
<PostList
indicateNewMessages={true}
posts={posts}

2
app/screens/user_profile/user_profile.js
View file

@ -11,6 +11,7 @@ import {
} from 'react-native';
import ProfilePicture from 'app/components/profile_picture';
import StatusBar from 'app/components/status_bar';
import {changeOpacity, makeStyleSheetFromTheme} from 'app/utils/theme';
import {getFullName} from 'mattermost-redux/utils/user_utils';
@ -71,6 +72,7 @@ export default class UserProfile extends PureComponent {
return (
<View style={style.container}>
<StatusBar/>
<ScrollView
style={style.scrollView}
contentContainerStyle={style.scrollViewContent}

1
package.json
View file

@ -42,6 +42,7 @@
"redux-thunk": "2.2.0",
"reselect": "3.0.1",
"semver": "5.3.0",
"tinycolor2": "1.4.1",
"url-parse": "1.1.9"
},
"devDependencies": {

4
yarn.lock
View file

@ -5664,6 +5664,10 @@ time-stamp@^1.0.0:
version "1.0.1"
resolved "https://registry.yarnpkg.com/time-stamp/-/time-stamp-1.0.1.tgz#9f4bd23559c9365966f3302dbba2b07c6b99b151"
tinycolor2@1.4.1:
version "1.4.1"
resolved "https://registry.yarnpkg.com/tinycolor2/-/tinycolor2-1.4.1.tgz#f4fad333447bc0b07d4dc8e9209d8f39a8ac77e8"
tmp@^0.0.29:
version "0.0.29"
resolved "https://registry.yarnpkg.com/tmp/-/tmp-0.0.29.tgz#f25125ff0dd9da3ccb0c2dd371ee1288bb9128c0"