Add displayAllOnNotificationBadge setting (fixes #3)

src/components/AppLayout/AppLayout.tsx

@@ -20,7 +20,7 @@ import Mastodon from 'megalodon';
 import { Notification } from '../../types/Notification';
 import {sendNotificationRequest} from '../../utilities/notifications';
 import {withSnackbar} from 'notistack';
-import { getConfig } from '../../utilities/settings';
+import { getConfig, getUserDefaultBool } from '../../utilities/settings';
 
 interface IAppLayoutState {
     acctMenuOpen: boolean;
@@ -83,6 +83,13 @@ export class AppLayout extends Component<any, IAppLayoutState> {
       streamNotifications() {
         this.streamListener = this.client.stream('/streaming/user');
 
+        if (getUserDefaultBool('displayAllOnNotificationBadge')) {
+          this.client.get('/notifications').then((resp: any) => {
+            let notifArray = resp.data;
+            this.setState({ notificationCount: notifArray.length });
+          })
+        }
+
         this.streamListener.on('notification', (notif: Notification) => {
           const notificationCount = this.state.notificationCount + 1;
           this.setState({ notificationCount });

src/pages/Settings.tsx

@@ -28,6 +28,7 @@ import {themes} from '../types/HyperspaceTheme';
 interface ISettingsState {
     darkModeEnabled: boolean;
     pushNotificationsEnabled: boolean;
+    badgeDisplaysAllNotifs: boolean;
     selectThemeName: string;
     themeDialogOpen: boolean;
     resetHyperspaceDialog: boolean;
@@ -42,6 +43,7 @@ class SettingsPage extends Component<any, ISettingsState> {
         this.state = {
             darkModeEnabled: getUserDefaultBool('darkModeEnabled'),
             pushNotificationsEnabled: canSendNotifications(),
+            badgeDisplaysAllNotifs: getUserDefaultBool('displayAllOnNotificationBadge'),
             selectThemeName: getUserDefaultTheme().key,
             themeDialogOpen: false,
             resetHyperspaceDialog: false,
@@ -50,6 +52,7 @@ class SettingsPage extends Component<any, ISettingsState> {
 
         this.toggleDarkMode = this.toggleDarkMode.bind(this);
         this.togglePushNotifications = this.togglePushNotifications.bind(this);
+        this.toggleBadgeCount = this.toggleBadgeCount.bind(this);
         this.toggleThemeDialog = this.toggleThemeDialog.bind(this);
         this.changeThemeName = this.changeThemeName.bind(this);
         this.changeTheme = this.changeTheme.bind(this);
@@ -66,6 +69,11 @@ class SettingsPage extends Component<any, ISettingsState> {
         setUserDefaultBool('enablePushNotifications', !this.state.pushNotificationsEnabled);
     }
 
+    toggleBadgeCount() {
+        this.setState({ badgeDisplaysAllNotifs: !this.state.badgeDisplaysAllNotifs });
+        setUserDefaultBool('displayAllOnNotificationBadge', !this.state.badgeDisplaysAllNotifs);
+    }
+
     toggleThemeDialog() {
         this.setState({ themeDialogOpen: !this.state.themeDialogOpen });
     }
@@ -217,7 +225,7 @@ class SettingsPage extends Component<any, ISettingsState> {
                                     getUserDefaultBool('userDeniedNotification')?
                                         "Check your browser's notification permissions.":
                                             browserSupportsNotificationRequests()?
-                                                "":
+                                                "Send a push notification when not focused.":
                                                 "Notifications aren't supported."
                                 }
                             />
@@ -229,6 +237,23 @@ class SettingsPage extends Component<any, ISettingsState> {
                                 />
                             </ListItemSecondaryAction>
                         </ListItem>
+                        {
+                            browserSupportsNotificationRequests()?
+                            <ListItem>
+                                <ListItemText 
+                                    primary="Notification badge counts all notifications"
+                                    secondary={
+                                        "Counts all notifications, read or unread."
+                                    }
+                                />
+                                <ListItemSecondaryAction>
+                                    <Switch 
+                                        checked={this.state.badgeDisplaysAllNotifs} 
+                                        onChange={this.toggleBadgeCount}
+                                    />
+                                </ListItemSecondaryAction>
+                            </ListItem>: null
+                        }
                     </List>
                 </Paper>
                 <br/>

src/utilities/settings.tsx

@@ -8,6 +8,7 @@ type SettingsTemplate = {
     darkModeEnabled: boolean;
     enablePushNotifications: boolean;
     clearNotificationsOnRead: boolean;
+    displayAllOnNotificationBadge: boolean;
 }
 
 /**
@@ -64,7 +65,8 @@ export function createUserDefaults() {
     let defaults: SettingsTemplate = {
         darkModeEnabled: false,
         enablePushNotifications: true,
-        clearNotificationsOnRead: false
+        clearNotificationsOnRead: false,
+        displayAllOnNotificationBadge: false
     }
 
     let settings = ["darkModeEnabled"];