* Add Channel Settings > Notification Preferences.
Fixes #15185
* Make newly added strings mmjstool compatible.
mmjstool seems to be looking for specific patterns in AST like called with
`formatMessage` and `t()` [1]. Looks like `t()` is just for that purpose.
[1]: a83581379d/mmjstool/src/i18n_extract.js (L97):L100
* Pass only required props to NotificationPreference & ChannelNotificationPreference.
* Fix style issues/nits from code review.
* Use radio button for channel notifications on android, and checkmarks on iOS.
Also changes style according to figma spec.
* Fix missing prop error.
For some reason, `npm run fix` didn't catch this. But `npm run check` did during CircleCI.
* Fix missing i18n strings by passing strings through `t()`.
mmjstool really needs to be smarter to understand these types of cases.
* Address comments from UX code review.
* Remove remnant from merge conflict.
* Fix UI in iOS landscape mode.
* Use SafeArea view for ios landscape view
* Use paddingHorizontal for SafeArea view for iOS landscape mode
80 lines
2.4 KiB
JavaScript
80 lines
2.4 KiB
JavaScript
// Copyright (c) 2015-present Mattermost, Inc. All Rights Reserved.
|
|
// See LICENSE.txt for license information.
|
|
|
|
import React from 'react';
|
|
import {
|
|
ScrollView,
|
|
View,
|
|
} from 'react-native';
|
|
|
|
import FormattedText from 'app/components/formatted_text';
|
|
import RadioButtonGroup from 'app/components/radio_button';
|
|
import StatusBar from 'app/components/status_bar';
|
|
import {changeOpacity, makeStyleSheetFromTheme} from 'app/utils/theme';
|
|
import ChannelNotificationPreferenceBase from './channel_notification_preference_base';
|
|
|
|
export default class ChannelNotificationPreferenceAndroid extends ChannelNotificationPreferenceBase {
|
|
getRadioItems = () => {
|
|
const {intl} = this.context;
|
|
const items = this.getItems();
|
|
const radioItems = [];
|
|
items.forEach((element) => {
|
|
const e = {
|
|
label: intl.formatMessage({
|
|
id: element.id,
|
|
defaultMessage: element.defaultMessage,
|
|
}),
|
|
value: element.value,
|
|
checked: element.checked,
|
|
};
|
|
radioItems.push(e);
|
|
});
|
|
return radioItems;
|
|
}
|
|
|
|
render() {
|
|
const {theme} = this.props;
|
|
const style = getStyleSheet(theme);
|
|
|
|
const options = this.getRadioItems();
|
|
|
|
return (
|
|
<View style={style.container}>
|
|
<StatusBar/>
|
|
<FormattedText
|
|
id='channel_notifications.preference.header'
|
|
defaultMessage='Send Notifications'
|
|
style={style.header}
|
|
/>
|
|
<ScrollView
|
|
contentContainerStyle={style.wrapper}
|
|
alwaysBounceVertical={false}
|
|
>
|
|
<RadioButtonGroup
|
|
name='pushSettings'
|
|
onSelect={this.handlePress}
|
|
options={options}
|
|
/>
|
|
</ScrollView>
|
|
</View>
|
|
);
|
|
}
|
|
}
|
|
|
|
const getStyleSheet = makeStyleSheetFromTheme((theme) => {
|
|
return {
|
|
container: {
|
|
flex: 1,
|
|
backgroundColor: changeOpacity(theme.centerChannelBg, 0.03),
|
|
},
|
|
wrapper: {
|
|
marginLeft: 16,
|
|
},
|
|
header: {
|
|
color: changeOpacity(theme.centerChannelColor, 0.56),
|
|
fontSize: 13,
|
|
marginTop: 10,
|
|
padding: 16,
|
|
},
|
|
};
|
|
});
|