diff --git a/lib/shared/thread-settings-notifications-utils.js b/lib/shared/thread-settings-notifications-utils.js --- a/lib/shared/thread-settings-notifications-utils.js +++ b/lib/shared/thread-settings-notifications-utils.js @@ -14,42 +14,42 @@ import { useDispatchActionPromise } from '../utils/redux-promise-utils.js'; import { useSelector } from '../utils/redux-utils.js'; -type NotificationSettings = 'focused' | 'badge-only' | 'background'; +type NotificationSettings = 'home' | 'notif-count-only' | 'muted'; const threadSettingsNotificationsCopy = { BANNER_NOTIFS: 'Banner notifs', NOTIF_COUNT: 'Notif count', - IN_FOCUSED_TAB: 'Lives in Focused tab', - IN_BACKGROUND_TAB: 'Lives in Background tab', - FOCUSED: 'Focused (enabled)', - BADGE_ONLY: 'Focused (badge only)', - BACKGROUND: 'Background', + IN_HOME_TAB: 'Lives in Home tab', + IN_MUTED_TAB: 'Lives in Muted tab', + HOME: 'Home', + NOTIF_COUNT_ONLY: 'Home (notif count only)', + MUTED: 'Muted', SIDEBAR_TITLE: 'Thread notifications', CHANNEL_TITLE: 'Channel notifications', IS_SIDEBAR: - 'It’s not possible to move this thread to Background. ' + + 'It’s not possible to move this thread to Muted. ' + 'That’s because Comm’s design always shows threads ' + 'underneath their parent in the Inbox, which means ' + - 'that if a thread’s parent is in Focused, the thread ' + + 'that if a thread’s parent is in Home, the thread ' + 'must also be there.', IS_SIDEBAR_CAN_PROMOTE: - 'If you want to move this thread to Background, ' + - 'you can either move the parent to Background, ' + + 'If you want to move this thread to Muted, ' + + 'you can either move the parent to Muted, ' + 'or you can promote the thread to a channel.', IS_SIDEBAR_CAN_NOT_PROMOTE: - 'If you want to move this thread to Background, ' + - 'you’ll have to move the parent to Background.', - PARENT_THREAD_IS_BACKGROUND: + 'If you want to move this thread to Muted, ' + + 'you’ll have to move the parent to Muted.', + PARENT_THREAD_IS_MUTED: 'It’s not possible to change the notif settings for a thread ' + - 'whose parent is in Background. That’s because Comm’s design ' + + 'whose parent is in Muted. That’s because Comm’s design ' + 'always shows threads underneath their parent in the Inbox, ' + - 'which means that if a thread’s parent is in Background, the ' + + 'which means that if a thread’s parent is in Muted, the ' + 'thread must also be there.', - PARENT_THREAD_IS_BACKGROUND_CAN_PROMOTE: + PARENT_THREAD_IS_MUTED_CAN_PROMOTE: 'If you want to change the notif settings for this thread, ' + 'you can either change the notif settings for the parent, ' + 'or you can promote the thread to a channel.', - PARENT_THREAD_IS_BACKGROUND_CAN_NOT_PROMOTE: + PARENT_THREAD_IS_MUTED_CAN_NOT_PROMOTE: 'If you want to change the notif settings for this thread, ' + 'you’ll have to change the notif settings for the parent.', }; @@ -63,40 +63,40 @@ onSuccessCallback: () => mixed, ): { +notificationSettings: NotificationSettings, - +onFocusedSelected: () => mixed, - +onBadgeOnlySelected: () => mixed, - +onBackgroundSelected: () => mixed, + +onHomeSelected: () => mixed, + +onNotifCountOnlySelected: () => mixed, + +onMutedSelected: () => mixed, +saveButtonDisabled: boolean, +onSave: () => mixed, +isSidebar: boolean, +canPromoteSidebar: boolean, - +parentThreadIsInBackground: boolean, + +parentThreadIsMuted: boolean, } { const subscription = threadInfo.currentUser.subscription; const initialThreadSetting = React.useMemo(() => { if (!subscription.home) { - return 'background'; + return 'muted'; } if (!subscription.pushNotifs) { - return 'badge-only'; + return 'notif-count-only'; } - return 'focused'; + return 'home'; }, [subscription.home, subscription.pushNotifs]); const [notificationSettings, setNotificationSettings] = React.useState(initialThreadSetting); - const onFocusedSelected = React.useCallback( - () => setNotificationSettings('focused'), + const onHomeSelected = React.useCallback( + () => setNotificationSettings('home'), [], ); - const onBadgeOnlySelected = React.useCallback( - () => setNotificationSettings('badge-only'), + const onNotifCountOnlySelected = React.useCallback( + () => setNotificationSettings('notif-count-only'), [], ); - const onBackgroundSelected = React.useCallback( - () => setNotificationSettings('background'), + const onMutedSelected = React.useCallback( + () => setNotificationSettings('muted'), [], ); @@ -150,19 +150,19 @@ const canPromoteSidebar = useCanPromoteSidebar(threadInfo, parentThreadInfo); - const parentThreadIsInBackground = + const parentThreadIsMuted = isSidebar && !parentThreadInfo?.currentUser.subscription.home; return { notificationSettings, - onFocusedSelected, - onBadgeOnlySelected, - onBackgroundSelected, + onHomeSelected, + onNotifCountOnlySelected, + onMutedSelected, saveButtonDisabled, onSave, isSidebar, canPromoteSidebar, - parentThreadIsInBackground, + parentThreadIsMuted, }; } diff --git a/native/chat/settings/thread-settings-notifications.react.js b/native/chat/settings/thread-settings-notifications.react.js --- a/native/chat/settings/thread-settings-notifications.react.js +++ b/native/chat/settings/thread-settings-notifications.react.js @@ -27,18 +27,14 @@ +selected: boolean, +bannerNotifsEnabled: boolean, +notifCountEnabled: boolean, - +livesInFocusedTab: boolean, + +livesInHomeTab: boolean, }; function NotificationDescription( props: NotificationDescriptionProps, ): React.Node { - const { - selected, - bannerNotifsEnabled, - notifCountEnabled, - livesInFocusedTab, - } = props; + const { selected, bannerNotifsEnabled, notifCountEnabled, livesInHomeTab } = + props; const styles = useStyles(unboundStyles); const colors = useColors(); @@ -122,9 +118,9 @@ color={colors.panelForegroundSecondaryLabel} /> - {livesInFocusedTab - ? threadSettingsNotificationsCopy.IN_FOCUSED_TAB - : threadSettingsNotificationsCopy.IN_BACKGROUND_TAB} + {livesInHomeTab + ? threadSettingsNotificationsCopy.IN_HOME_TAB + : threadSettingsNotificationsCopy.IN_MUTED_TAB} @@ -146,20 +142,20 @@ const { notificationSettings, - onFocusedSelected, - onBadgeOnlySelected, - onBackgroundSelected, + onHomeSelected, + onNotifCountOnlySelected, + onMutedSelected, saveButtonDisabled, onSave, isSidebar, canPromoteSidebar, - parentThreadIsInBackground, + parentThreadIsMuted, } = useThreadSettingsNotifications(threadInfo, goBack); React.useEffect(() => { setOptions({ headerRight: () => - parentThreadIsInBackground ? null : ( + parentThreadIsMuted ? null : ( ), }); - }, [saveButtonDisabled, onSave, setOptions, parentThreadIsInBackground]); + }, [saveButtonDisabled, onSave, setOptions, parentThreadIsMuted]); const styles = useStyles(unboundStyles); @@ -180,7 +176,7 @@ [styles.notificationOptionIconContainer], ); - const badgeOnlyIllustration = React.useMemo( + const notifCountOnlyIllustration = React.useMemo( () => ( @@ -201,22 +197,22 @@ const allNotificationsDescription = React.useMemo( () => ( ), [notificationSettings], ); - const badgeOnlyDescription = React.useMemo( + const notifCountOnlyDescription = React.useMemo( () => ( ), [notificationSettings], @@ -225,10 +221,10 @@ const mutedDescription = React.useMemo( () => ( ), [notificationSettings], @@ -259,16 +255,16 @@ ]); const threadSettingsNotifications = React.useMemo(() => { - if (parentThreadIsInBackground) { + if (parentThreadIsMuted) { return ( - - - {threadSettingsNotificationsCopy.PARENT_THREAD_IS_BACKGROUND} + + + {threadSettingsNotificationsCopy.PARENT_THREAD_IS_MUTED} - + {canPromoteSidebar - ? threadSettingsNotificationsCopy.PARENT_THREAD_IS_BACKGROUND_CAN_PROMOTE - : threadSettingsNotificationsCopy.PARENT_THREAD_IS_BACKGROUND_CAN_NOT_PROMOTE} + ? threadSettingsNotificationsCopy.PARENT_THREAD_IS_MUTED_CAN_PROMOTE + : threadSettingsNotificationsCopy.PARENT_THREAD_IS_MUTED_CAN_NOT_PROMOTE} ); @@ -278,27 +274,27 @@ ); }, [ + parentThreadIsMuted, + styles.container, + styles.enumSettingsOptionContainer, + styles.parentThreadIsMutedNoticeContainerStyle, + styles.parentThreadIsMutedNoticeText, + notificationSettings, + onHomeSelected, allNotificationsDescription, allNotificationsIllustration, - badgeOnlyDescription, - badgeOnlyIllustration, - canPromoteSidebar, - isSidebar, + onNotifCountOnlySelected, + notifCountOnlyDescription, + notifCountOnlyIllustration, + onMutedSelected, mutedDescription, mutedIllustration, + isSidebar, noticeText, - notificationSettings, - onBackgroundSelected, - onBadgeOnlySelected, - onFocusedSelected, - parentThreadIsInBackground, - styles.container, - styles.enumSettingsOptionContainer, - styles.parentThreadIsInBackgroundNoticeContainerStyle, - styles.parentThreadIsInBackgroundNoticeText, + canPromoteSidebar, ]); return threadSettingsNotifications; @@ -371,12 +367,12 @@ lineHeight: 18, marginVertical: 8, }, - parentThreadIsInBackgroundNoticeContainerStyle: { + parentThreadIsMutedNoticeContainerStyle: { backgroundColor: 'panelForeground', paddingHorizontal: 16, paddingVertical: 8, }, - parentThreadIsInBackgroundNoticeText: { + parentThreadIsMutedNoticeText: { color: 'panelForegroundSecondaryLabel', fontSize: 16, lineHeight: 20, diff --git a/native/chat/settings/thread-settings-push-notifs.react.js b/native/chat/settings/thread-settings-push-notifs.react.js --- a/native/chat/settings/thread-settings-push-notifs.react.js +++ b/native/chat/settings/thread-settings-push-notifs.react.js @@ -46,11 +46,11 @@ }; class ThreadSettingsPushNotifs extends React.PureComponent { render(): React.Node { - let componentLabel = threadSettingsNotificationsCopy.FOCUSED; + let componentLabel = threadSettingsNotificationsCopy.HOME; if (!this.props.threadInfo.currentUser.subscription.home) { - componentLabel = threadSettingsNotificationsCopy.BACKGROUND; + componentLabel = threadSettingsNotificationsCopy.MUTED; } else if (!this.props.threadInfo.currentUser.subscription.pushNotifs) { - componentLabel = threadSettingsNotificationsCopy.BADGE_ONLY; + componentLabel = threadSettingsNotificationsCopy.NOTIF_COUNT_ONLY; } let editSettingsButton, notifSettingsLinkingButton; diff --git a/web/modals/threads/notifications/notifications-modal.react.js b/web/modals/threads/notifications/notifications-modal.react.js --- a/web/modals/threads/notifications/notifications-modal.react.js +++ b/web/modals/threads/notifications/notifications-modal.react.js @@ -17,7 +17,7 @@ import { useSelector } from '../../../redux/redux-utils.js'; import Modal from '../../modal.react.js'; -const focusedStatements = [ +const homeStatements = [ { statement: threadSettingsNotificationsCopy.BANNER_NOTIFS, isStatementValid: true, @@ -29,13 +29,13 @@ styleStatementBasedOnValidity: true, }, { - statement: threadSettingsNotificationsCopy.IN_FOCUSED_TAB, + statement: threadSettingsNotificationsCopy.IN_HOME_TAB, isStatementValid: true, styleStatementBasedOnValidity: true, }, ]; -const badgeOnlyStatements = [ +const notifCountOnlyStatements = [ { statement: threadSettingsNotificationsCopy.BANNER_NOTIFS, isStatementValid: false, @@ -47,13 +47,13 @@ styleStatementBasedOnValidity: true, }, { - statement: threadSettingsNotificationsCopy.IN_FOCUSED_TAB, + statement: threadSettingsNotificationsCopy.IN_HOME_TAB, isStatementValid: true, styleStatementBasedOnValidity: true, }, ]; -const backgroundStatements = [ +const mutedStatements = [ { statement: threadSettingsNotificationsCopy.BANNER_NOTIFS, isStatementValid: false, @@ -65,7 +65,7 @@ styleStatementBasedOnValidity: true, }, { - statement: threadSettingsNotificationsCopy.IN_BACKGROUND_TAB, + statement: threadSettingsNotificationsCopy.IN_MUTED_TAB, isStatementValid: true, styleStatementBasedOnValidity: true, }, @@ -81,58 +81,58 @@ const { notificationSettings, - onFocusedSelected, - onBadgeOnlySelected, - onBackgroundSelected, + onHomeSelected, + onNotifCountOnlySelected, + onMutedSelected, saveButtonDisabled, onSave, isSidebar, canPromoteSidebar, - parentThreadIsInBackground, + parentThreadIsMuted, } = useThreadSettingsNotifications(threadInfo, onClose); - const isFocusedSelected = notificationSettings === 'focused'; - const focusedItem = React.useMemo(() => { + const isHomeSelected = notificationSettings === 'home'; + const homeItem = React.useMemo(() => { const icon = ; return ( ); - }, [isFocusedSelected, onFocusedSelected]); + }, [isHomeSelected, onHomeSelected]); - const isFocusedBadgeOnlySelected = notificationSettings === 'badge-only'; - const focusedBadgeOnlyItem = React.useMemo(() => { + const isNotifyCountOnlySelected = notificationSettings === 'notif-count-only'; + const notifCountOnlyItem = React.useMemo(() => { const icon = ; return ( ); - }, [isFocusedBadgeOnlySelected, onBadgeOnlySelected]); + }, [isNotifyCountOnlySelected, onNotifCountOnlySelected]); - const isBackgroundSelected = notificationSettings === 'background'; + const isMutedSelected = notificationSettings === 'muted'; const backgroundItem = React.useMemo(() => { const icon = ; return ( ); - }, [isBackgroundSelected, onBackgroundSelected, isSidebar]); + }, [isMutedSelected, onMutedSelected, isSidebar]); const modalName = isSidebar ? threadSettingsNotificationsCopy.SIDEBAR_TITLE @@ -158,16 +158,16 @@ }, [isSidebar, canPromoteSidebar]); const modalContent = React.useMemo(() => { - if (parentThreadIsInBackground) { + if (parentThreadIsMuted) { return ( <>

- {threadSettingsNotificationsCopy.PARENT_THREAD_IS_BACKGROUND} + {threadSettingsNotificationsCopy.PARENT_THREAD_IS_MUTED}

{canPromoteSidebar - ? threadSettingsNotificationsCopy.PARENT_THREAD_IS_BACKGROUND_CAN_PROMOTE - : threadSettingsNotificationsCopy.PARENT_THREAD_IS_BACKGROUND_CAN_NOT_PROMOTE} + ? threadSettingsNotificationsCopy.PARENT_THREAD_IS_MUTED_CAN_PROMOTE + : threadSettingsNotificationsCopy.PARENT_THREAD_IS_MUTED_CAN_NOT_PROMOTE}

); @@ -176,24 +176,24 @@ return ( <>
- {focusedItem} - {focusedBadgeOnlyItem} + {homeItem} + {notifCountOnlyItem} {backgroundItem}
{noticeText} ); }, [ + parentThreadIsMuted, + homeItem, + notifCountOnlyItem, backgroundItem, - focusedBadgeOnlyItem, - focusedItem, noticeText, - parentThreadIsInBackground, canPromoteSidebar, ]); const saveButton = React.useMemo(() => { - if (parentThreadIsInBackground) { + if (parentThreadIsMuted) { return undefined; } @@ -202,7 +202,7 @@ Save ); - }, [saveButtonDisabled, onSave, parentThreadIsInBackground]); + }, [parentThreadIsMuted, onSave, saveButtonDisabled]); return (