Make push notifications optional

6 files changed, 29 insertions, 9 deletions

diff --git a/app/javascript/flavours/glitch/actions/notifications.js b/app/javascript/flavours/glitch/actions/notifications.js
index eb7087027..583cc87a5 100644
--- a/app/javascript/flavours/glitch/actions/notifications.js
+++ b/app/javascript/flavours/glitch/actions/notifications.js
@@ -13,7 +13,7 @@ import { defineMessages } from 'react-intl';
 import { List as ImmutableList } from 'immutable';
 import { unescapeHTML } from 'flavours/glitch/util/html';
 import { getFiltersRegex } from 'flavours/glitch/selectors';
-import { usePendingItems as preferPendingItems } from 'flavours/glitch/util/initial_state';
+import { usePendingItems as preferPendingItems, webPushEnabled } from 'flavours/glitch/util/initial_state';
 import compareId from 'flavours/glitch/util/compare_id';
 import { searchTextFromRawStatus } from 'flavours/glitch/actions/importer/normalizer';
 import { requestNotificationPermission } from 'flavours/glitch/util/notifications';
@@ -336,6 +336,11 @@ export function markNotificationsAsRead() {
 // Browser support
 export function setupBrowserNotifications() {
   return dispatch => {
+    if (!webPushEnabled) {
+      dispatch(setBrowserSupport(false));
+      return;
+    }
+
     dispatch(setBrowserSupport('Notification' in window));
     if ('Notification' in window) {
       dispatch(setBrowserPermission(Notification.permission));
diff --git a/app/javascript/flavours/glitch/actions/push_notifications/registerer.js b/app/javascript/flavours/glitch/actions/push_notifications/registerer.js
index 8fdb239f7..1f9ebe569 100644
--- a/app/javascript/flavours/glitch/actions/push_notifications/registerer.js
+++ b/app/javascript/flavours/glitch/actions/push_notifications/registerer.js
@@ -1,7 +1,9 @@
 import api from 'flavours/glitch/util/api';
+import { webPushEnabled } from 'flavours/glitch/util/initial_state';
 import { pushNotificationsSetting } from 'flavours/glitch/util/settings';
 import { setBrowserSupport, setSubscription, clearSubscription } from './setter';
 
+
 // Taken from https://www.npmjs.com/package/web-push
 const urlBase64ToUint8Array = (base64String) => {
   const padding = '='.repeat((4 - base64String.length % 4) % 4);
@@ -49,7 +51,7 @@ const sendSubscriptionToBackend = (getState, subscription, me) => {
 };
 
 // Last one checks for payload support: https://web-push-book.gauntface.com/chapter-06/01-non-standards-browsers/#no-payload
-const supportsPushNotifications = ('serviceWorker' in navigator && 'PushManager' in window && 'getKey' in PushSubscription.prototype);
+const supportsPushNotifications = (webPushEnabled && 'serviceWorker' in navigator && 'PushManager' in window && 'getKey' in PushSubscription.prototype);
 
 export function register () {
   return (dispatch, getState) => {
diff --git a/app/javascript/flavours/glitch/features/notifications/components/notifications_permission_banner.js b/app/javascript/flavours/glitch/features/notifications/components/notifications_permission_banner.js
index 8e77f5a03..0ba929711 100644
--- a/app/javascript/flavours/glitch/features/notifications/components/notifications_permission_banner.js
+++ b/app/javascript/flavours/glitch/features/notifications/components/notifications_permission_banner.js
@@ -17,12 +17,17 @@ class NotificationsPermissionBanner extends React.PureComponent {
     this.props.dispatch(requestBrowserPermission());
   }
 
+  handleClickDisable = () => {
+    window.location = '/settings/preferences/notifications';
+  }
+
   render () {
     return (
       <div className='notifications-permission-banner'>
         <h2><FormattedMessage id='notifications_permission_banner.title' defaultMessage='Never miss a thing' /></h2>
         <p><FormattedMessage id='notifications_permission_banner.how_to_control' defaultMessage="To receive notifications when Mastodon isn't open, enable desktop notifications. You can control precisely which types of interactions generate desktop notifications through the {icon} button above once they're enabled." values={{ icon: <Icon id='sliders' /> }} /></p>
-        <Button onClick={this.handleClick}><FormattedMessage id='notifications_permission_banner.enable' defaultMessage='Enable desktop notifications' /></Button>
+        <Button onClick={this.handleClick}><FormattedMessage id='notifications_permission_banner.enable' defaultMessage='Request' /></Button>
+        <Button onClick={this.handleClickDisable}><FormattedMessage id='notifications_permission_banner.disable' defaultMessage='Disable' /></Button>
       </div>
     );
   }
diff --git a/app/javascript/flavours/glitch/styles/components/columns.scss b/app/javascript/flavours/glitch/styles/components/columns.scss
index be32ae52e..1109f17ea 100644
--- a/app/javascript/flavours/glitch/styles/components/columns.scss
+++ b/app/javascript/flavours/glitch/styles/components/columns.scss
@@ -696,15 +696,12 @@
 }
 
 .notifications-permission-banner {
-  padding: 30px;
+  padding: 14px;
   border-bottom: 1px solid lighten($ui-base-color, 8%);
-  display: flex;
-  flex-direction: column;
-  align-items: center;
-  justify-content: center;
+  text-align: center;
 
   h2 {
-    font-size: 16px;
+    font-size: 14px;
     font-weight: 500;
     margin-bottom: 15px;
     text-align: center;
@@ -715,4 +712,9 @@
     margin-bottom: 15px;
     text-align: center;
   }
+
+  .button {
+    margin-left: 7px;
+    margin-right: 7px;
+  }
 }
diff --git a/app/javascript/flavours/glitch/util/initial_state.js b/app/javascript/flavours/glitch/util/initial_state.js
index 911468e6f..05868970c 100644
--- a/app/javascript/flavours/glitch/util/initial_state.js
+++ b/app/javascript/flavours/glitch/util/initial_state.js
@@ -11,6 +11,8 @@ const initialState = element && function () {
 
 const getMeta = (prop) => initialState && initialState.meta && initialState.meta[prop];
 
+export const webPushEnabled = getMeta('web_push') === true;
+
 export const reduceMotion = getMeta('reduce_motion');
 export const autoPlayGif = getMeta('auto_play_gif');
 export const displaySensitiveMedia = getMeta('display_sensitive_media');
diff --git a/app/javascript/mastodon/locales/en-MP.json b/app/javascript/mastodon/locales/en-MP.json
index 3f2ffb62b..3e021a5c1 100644
--- a/app/javascript/mastodon/locales/en-MP.json
+++ b/app/javascript/mastodon/locales/en-MP.json
@@ -102,6 +102,10 @@
   "notifications.clear": "Clear notifications",
   "notifications.column_settings.favourite": "Admirations:",
   "notifications.filter.favourites": "Admirations",
+  "notifications_permission_banner.title": "You have desktop notifications enabled.",
+  "notifications_permission_banner.enable": "Request",
+  "notifications_permission_banner.disable": "Disable",
+  "notifications_permission_banner.how_to_control": "Permission is needed from your Web browser to use this feature.",
   "poll.total_people": "{count, plural, one {# creature} other {# creatures}}",
   "privacy.change": "Adjust roar privacy",
   "privacy.direct.long": "Visible for mentioned creatures only",