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 @@ -1,7 +1,10 @@ // @flow +import { Entypo } from '@expo/vector-icons'; import * as React from 'react'; -import { View, Switch } from 'react-native'; +import { View, Switch, TouchableOpacity } from 'react-native'; +import Alert from 'react-native/Libraries/Alert/Alert'; +import Linking from 'react-native/Libraries/Linking/Linking'; import { updateSubscriptionActionTypes, @@ -19,6 +22,7 @@ } from 'lib/utils/action-utils'; import { SingleLine } from '../../components/single-line.react'; +import { useSelector } from '../../redux/redux-utils'; import { useStyles } from '../../themes/colors'; type BaseProps = { @@ -31,6 +35,7 @@ // Redux dispatch functions +dispatchActionPromise: DispatchActionPromise, // async functions that hit server APIs + +deviceToken: ?string, +updateSubscription: ( subscriptionUpdate: SubscriptionUpdateRequest, ) => Promise, @@ -48,15 +53,30 @@ render() { const componentLabel = 'Push notifs'; + const renderNotificationsSettingsLinkingIcon = () => { + if (!this.hasPushPermissions()) { + return ( + + + + + + ); + } + }; return ( {componentLabel} + {renderNotificationsSettingsLinkingIcon()} @@ -75,6 +95,28 @@ }), ); }; + + onNotificationsSettingsLinkingIconPress = () => { + Alert.alert( + 'Need notif permissions', + 'Comm needs notification permissions to keep you in the loop! ' + + 'Please enable in Settings App -> Notifications -> Comm.', + [ + { + text: 'Go to application settings', + onPress: () => Linking.openSettings(), + }, + { + text: 'Cancel', + style: 'cancel', + }, + ], + ); + }; + + hasPushPermissions(): boolean { + return this.props.deviceToken !== null; + } } const unboundStyles = { @@ -97,6 +139,9 @@ paddingHorizontal: 24, paddingVertical: 3, }, + infoIcon: { + paddingRight: 20, + }, }; const ConnectedThreadSettingsPushNotifs: React.ComponentType = React.memo( @@ -104,12 +149,14 @@ const styles = useStyles(unboundStyles); const dispatchActionPromise = useDispatchActionPromise(); const callUpdateSubscription = useServerCall(updateSubscription); + const deviceToken = useSelector(state => state.deviceToken); return ( ); },