* MM-37934: adds CRT channel notification preferences Adds push notification preferences per channel for CRT replies. These are only enabled when push notifications for root messages are set to 'mention', in any other case we don't show the switch. * Adds another test case Co-authored-by: Mattermod <mattermod@users.noreply.github.com>
124 lines
5.3 KiB
JavaScript
124 lines
5.3 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 {SafeAreaView} from 'react-native-safe-area-context';
|
|
|
|
import FormattedText from '@components/formatted_text';
|
|
import StatusBar from '@components/status_bar';
|
|
import {ViewTypes} from '@constants';
|
|
import SectionItem from '@screens/settings/section_item';
|
|
import {changeOpacity, makeStyleSheetFromTheme} from '@utils/theme';
|
|
|
|
import ChannelNotificationPreferenceBase from './channel_notification_preference_base';
|
|
|
|
export default class ChannelNotificationPreferenceIos extends ChannelNotificationPreferenceBase {
|
|
render() {
|
|
const {theme, isCollapsedThreadsEnabled} = this.props;
|
|
const {notificationLevel, notificationThreadsLevel} = this.state;
|
|
const style = getStyleSheet(theme);
|
|
|
|
const items = this.getItems();
|
|
|
|
return (
|
|
<View
|
|
testID='channel_notification_preference.screen'
|
|
style={style.container}
|
|
>
|
|
<StatusBar/>
|
|
<SafeAreaView edges={['left', 'right']}>
|
|
<FormattedText
|
|
id='channel_notifications.preference.header'
|
|
defaultMessage='Send Notifications'
|
|
style={style.header}
|
|
/>
|
|
</SafeAreaView>
|
|
<ScrollView
|
|
contentContainerStyle={style.scrollView}
|
|
alwaysBounceVertical={false}
|
|
>
|
|
<View style={style.contentContainer}>
|
|
<SafeAreaView edges={['left', 'right']}>
|
|
{items.map((item) => (
|
|
<View key={item.id}>
|
|
<View style={style.divider}/>
|
|
<SectionItem
|
|
label={(
|
|
<FormattedText
|
|
id={item.id}
|
|
defaultMessage={item.defaultMessage}
|
|
values={item.labelValues}
|
|
/>
|
|
)}
|
|
action={this.handlePress}
|
|
actionType='select'
|
|
actionValue={item.value}
|
|
selected={item.checked}
|
|
theme={theme}
|
|
/>
|
|
</View>),
|
|
)}
|
|
{isCollapsedThreadsEnabled && notificationLevel === ViewTypes.NotificationLevels.MENTION && (
|
|
<View>
|
|
<FormattedText
|
|
id='mobile.notification_settings.push_threads.title'
|
|
defaultMessage={'Thread reply notifications'}
|
|
style={style.header}
|
|
/>
|
|
<View style={style.divider}/>
|
|
<SectionItem
|
|
label={(
|
|
<FormattedText
|
|
id='mobile.notification_settings.push_threads.description'
|
|
defaultMessage={'Notify me about all replies to threads I\'m following'}
|
|
/>
|
|
)}
|
|
description={<View/>}
|
|
action={this.handleThreadsPress}
|
|
actionType='toggle'
|
|
selected={notificationThreadsLevel === ViewTypes.NotificationLevels.ALL}
|
|
theme={theme}
|
|
/>
|
|
</View>
|
|
)}
|
|
</SafeAreaView>
|
|
<View style={style.divider}/>
|
|
</View>
|
|
</ScrollView>
|
|
</View>
|
|
);
|
|
}
|
|
}
|
|
|
|
const getStyleSheet = makeStyleSheetFromTheme((theme) => {
|
|
return {
|
|
container: {
|
|
flex: 1,
|
|
backgroundColor: changeOpacity(theme.centerChannelColor, 0.03),
|
|
},
|
|
header: {
|
|
backgroundColor: changeOpacity(theme.centerChannelColor, 0.03),
|
|
color: changeOpacity(theme.centerChannelColor, 0.56),
|
|
fontSize: 13,
|
|
textTransform: 'uppercase',
|
|
padding: 16,
|
|
paddingTop: 26,
|
|
},
|
|
divider: {
|
|
backgroundColor: changeOpacity(theme.centerChannelColor, 0.1),
|
|
height: 1,
|
|
width: '100%',
|
|
marginLeft: 16,
|
|
},
|
|
scrollView: {
|
|
backgroundColor: changeOpacity(theme.centerChannelColor, 0.03),
|
|
},
|
|
contentContainer: {
|
|
backgroundColor: changeOpacity(theme.centerChannelBg, 1),
|
|
},
|
|
};
|
|
});
|