2d3d43c000
* added chevron to menu item component * starting with the skeleton * starting with the skeleton * starting with the skeleton * starting with the skeleton * remove extra line * tested on tablets * some corrections * corrections as per review * starting with notification skeleton * attached notification settings to navigation * added auto responder * update translation * update snapshot * updated snapshot * correction after review * removed unnecessary screen * refactored * updated the testIDs * Update Package.resolved * refactor * removed Mattermost as default server name * fix ts * refactored settings constant * display settings skeleton - pending: query for allowed themes * added 'allowedThemes' query * added section item * mention screen skeleton in place * added section and sectionItem component * added reply section to the mention screen * update i18n * rename screens properly * update i18n * Refactored to MentionSettings component * Refactored to ReplySettings component * style clean up * textTransform uppercase * rename Section/SectionItem to Block/BlockItem * added mobile push notif screen - push status section * adding text to those two components * correction following review * added mobile push notification section * added mobile push notification thread section * style fix * code fix * code fix * MM-39711 - Gekidou Notification - Auto Responder main screen (#6313) * added skeleton for auto responder * code clean up * correction from peer review * correction from PR review * clean up * PR review correction * correction * clean up * clean up * code clean up * code clean up
78 lines
2.4 KiB
TypeScript
78 lines
2.4 KiB
TypeScript
// Copyright (c) 2015-present Mattermost, Inc. All Rights Reserved.
|
|
// See LICENSE.txt for license information.
|
|
|
|
import React from 'react';
|
|
import {View} from 'react-native';
|
|
|
|
import Block from '@components/block';
|
|
import BlockItem from '@components/block_item';
|
|
import FormattedText from '@components/formatted_text';
|
|
import {useTheme} from '@context/theme';
|
|
import {t} from '@i18n';
|
|
import {changeOpacity, makeStyleSheetFromTheme} from '@utils/theme';
|
|
import {typography} from '@utils/typography';
|
|
|
|
const getStyleSheet = makeStyleSheetFromTheme((theme) => {
|
|
return {
|
|
upperCase: {
|
|
textTransform: 'uppercase',
|
|
},
|
|
separator: {
|
|
backgroundColor: changeOpacity(theme.centerChannelColor, 0.1),
|
|
flex: 1,
|
|
height: 1,
|
|
marginLeft: 15,
|
|
},
|
|
area: {
|
|
paddingHorizontal: 16,
|
|
},
|
|
label: {
|
|
color: theme.centerChannelColor,
|
|
...typography('Body', 100, 'Regular'),
|
|
},
|
|
};
|
|
});
|
|
|
|
const headerText = {
|
|
id: t('notification_settings.push_threads'),
|
|
defaultMessage: 'Thread reply notifications',
|
|
};
|
|
const footerText = {
|
|
id: t('notification_settings.push_threads.info'),
|
|
defaultMessage: 'When enabled, any reply to a thread you\'re following will send a mobile push notification',
|
|
};
|
|
|
|
type MobilePushThreadProps = {
|
|
onMobilePushThreadChanged: (status: string) => void;
|
|
pushThread: PushStatus;
|
|
}
|
|
|
|
const MobilePushThread = ({pushThread, onMobilePushThreadChanged}: MobilePushThreadProps) => {
|
|
const theme = useTheme();
|
|
const styles = getStyleSheet(theme);
|
|
|
|
return (
|
|
<Block
|
|
headerText={headerText}
|
|
footerText={footerText}
|
|
headerStyles={styles.upperCase}
|
|
containerStyles={styles.area}
|
|
>
|
|
<BlockItem
|
|
label={(
|
|
<FormattedText
|
|
id='notification_settings.push_threads.description'
|
|
defaultMessage={'Notify me about all replies to threads I\'m following'}
|
|
style={styles.label}
|
|
/>
|
|
)}
|
|
action={onMobilePushThreadChanged}
|
|
actionType='toggle'
|
|
selected={pushThread === 'all'}
|
|
/>
|
|
<View style={styles.separator}/>
|
|
</Block>
|
|
);
|
|
};
|
|
|
|
export default MobilePushThread;
|