Merge pull request #91 from hyperspacedev/electron-badge

Add badge to desktop apps

package-lock.json

@@ -3220,6 +3220,14 @@
       "integrity": "sha512-Un7MIEDdUC5gNpcGDV97op1Ywk748MpHcFTHoYs6qnj1Z3j7I53VG3nwZhKzoBZmbdRNnb6WRdFlwl7tSDuZGw==",
       "dev": true
     },
+    "bindings": {
+      "version": "1.5.0",
+      "resolved": "https://registry.npmjs.org/bindings/-/bindings-1.5.0.tgz",
+      "integrity": "sha512-p2q/t/mhvuOj/UeLlV6566GD/guowlr0hHxClI0W9m7MWYkL1F0hLo+0Aexs9HSPCtR1SXQ0TD3MMKrXZajbiQ==",
+      "requires": {
+        "file-uri-to-path": "1.0.0"
+      }
+    },
     "bluebird": {
       "version": "3.5.4",
       "resolved": "https://registry.npmjs.org/bluebird/-/bluebird-3.5.4.tgz",
@@ -7262,10 +7270,13 @@
       }
     },
     "eslint-utils": {
-      "version": "1.3.1",
-      "resolved": "https://registry.npmjs.org/eslint-utils/-/eslint-utils-1.3.1.tgz",
-      "integrity": "sha512-Z7YjnIldX+2XMcjr7ZkgEsOj/bREONV60qYeB/bjMAqqqZ4zxKyWX+BOUkdmRmA9riiIPVvo5x86m5elviOk0Q==",
-      "dev": true
+      "version": "1.4.2",
+      "resolved": "https://registry.npmjs.org/eslint-utils/-/eslint-utils-1.4.2.tgz",
+      "integrity": "sha512-eAZS2sEUMlIeCjBeubdj45dmBHQwPHWyBcT1VSYB7o9x9WRRqKxyUoiXlRjyAwzN7YEzHJlYg0NmzDRWx6GP4Q==",
+      "dev": true,
+      "requires": {
+        "eslint-visitor-keys": "^1.0.0"
+      }
     },
     "eslint-visitor-keys": {
       "version": "1.0.0",
@@ -7325,6 +7336,11 @@
       "integrity": "sha1-Qa4u62XvpiJorr/qg6x9eSmbCIc=",
       "dev": true
     },
+    "event-target-shim": {
+      "version": "1.1.1",
+      "resolved": "https://registry.npmjs.org/event-target-shim/-/event-target-shim-1.1.1.tgz",
+      "integrity": "sha1-qG5e5r2qFgVEddp5fM3fDFVphJE="
+    },
     "eventemitter3": {
       "version": "3.1.0",
       "resolved": "https://registry.npmjs.org/eventemitter3/-/eventemitter3-3.1.0.tgz",
@@ -8022,6 +8038,11 @@
         "schema-utils": "^1.0.0"
       }
     },
+    "file-uri-to-path": {
+      "version": "1.0.0",
+      "resolved": "https://registry.npmjs.org/file-uri-to-path/-/file-uri-to-path-1.0.0.tgz",
+      "integrity": "sha512-0Zt+s3L7Vf1biwWZ29aARiVYLx7iMGnEUl9x33fbB/j3jR81u/O2LbqK+Bm1CDSNDKVtJ/YjwY7TUd5SkeLQLw=="
+    },
     "filename-regex": {
       "version": "2.0.1",
       "resolved": "https://registry.npmjs.org/filename-regex/-/filename-regex-2.0.1.tgz",
@@ -9448,9 +9469,9 @@
       "dev": true
     },
     "handlebars": {
-      "version": "4.1.2",
-      "resolved": "https://registry.npmjs.org/handlebars/-/handlebars-4.1.2.tgz",
-      "integrity": "sha512-nvfrjqvt9xQ8Z/w0ijewdD/vvWDTOweBUm96NTr66Wfvo1mJenBLwcYmPs3TIBP5ruzYGD7Hx/DaM9RmhroGPw==",
+      "version": "4.4.0",
+      "resolved": "https://registry.npmjs.org/handlebars/-/handlebars-4.4.0.tgz",
+      "integrity": "sha512-xkRtOt3/3DzTKMOt3xahj2M/EqNhY988T+imYSlMgs5fVhLN2fmKVVj0LtEGmb+3UUYV5Qmm1052Mm3dIQxOvw==",
       "dev": true,
       "requires": {
         "neo-async": "^2.6.0",
@@ -12840,6 +12861,16 @@
         }
       }
     },
+    "node-mac-notifier": {
+      "version": "1.2.0",
+      "resolved": "https://registry.npmjs.org/node-mac-notifier/-/node-mac-notifier-1.2.0.tgz",
+      "integrity": "sha512-+9FZ01BbPMv3pQVRWgPlaIKbhQl35Pn3WmRg96zIrCJHb4XvClnAqc0+aPfHrWs8o1PYMAQFeYK5tF69ljkKQw==",
+      "requires": {
+        "bindings": "^1.2.1",
+        "event-target-shim": "^1.1.1",
+        "uuid": "^3.3.2"
+      }
+    },
     "node-notifier": {
       "version": "5.4.0",
       "resolved": "https://registry.npmjs.org/node-notifier/-/node-notifier-5.4.0.tgz",
@@ -20242,8 +20273,7 @@
     "uuid": {
       "version": "3.3.2",
       "resolved": "https://registry.npmjs.org/uuid/-/uuid-3.3.2.tgz",
-      "integrity": "sha512-yXJmeNaw3DnnKAOKJE51sL/ZaYfWJRl1pK9dr19YFCu0ObS231AB1/LbqTKRAQ5kw8A90rA6fr4riOUpTZvQZA==",
-      "dev": true
+      "integrity": "sha512-yXJmeNaw3DnnKAOKJE51sL/ZaYfWJRl1pK9dr19YFCu0ObS231AB1/LbqTKRAQ5kw8A90rA6fr4riOUpTZvQZA=="
     },
     "validate-npm-package-license": {
       "version": "3.0.4",

src/components/AppLayout/AppLayout.tsx

@@ -53,7 +53,11 @@ import { Notification } from "../../types/Notification";
 import { sendNotificationRequest } from "../../utilities/notifications";
 import { withSnackbar } from "notistack";
 import { getConfig, getUserDefaultBool } from "../../utilities/settings";
-import { isDesktopApp, isDarwinApp } from "../../utilities/desktop";
+import {
+    isDesktopApp,
+    isDarwinApp,
+    getElectronApp
+} from "../../utilities/desktop";
 import { Config } from "../../types/Config";
 import {
     getAccountRegistry,
@@ -145,6 +149,11 @@ export class AppLayout extends Component<any, IAppLayoutState> {
         this.streamListener.on("notification", (notif: Notification) => {
             const notificationCount = this.state.notificationCount + 1;
             this.setState({ notificationCount });
+
+            if (isDesktopApp()) {
+                getElectronApp().setBadgeCount(notificationCount);
+            }
+
             if (!document.hasFocus()) {
                 let primaryMessage = "";
                 let secondaryMessage = "";
@@ -226,7 +235,7 @@ export class AppLayout extends Component<any, IAppLayoutState> {
         window.location.href = isDesktopApp()
             ? "hyperspace://hyperspace/app/index.html#/search?query=" + what
             : "/#/search?query=" + what;
-        window.location.reload;
+        window.location.reload();
     }
 
     logOutAndRestart() {
@@ -256,6 +265,10 @@ export class AppLayout extends Component<any, IAppLayoutState> {
         if (!getUserDefaultBool("displayAllOnNotificationBadge")) {
             this.setState({ notificationCount: 0 });
         }
+
+        if (isDesktopApp() && getElectronApp().getBadgeCount() > 0) {
+            getElectronApp().setBadgeCount(0);
+        }
     }
 
     titlebar() {

src/pages/Notifications.tsx

@@ -110,7 +110,7 @@ class NotificationsPage extends Component<any, INotificationsPageState> {
 
     removeNotification(id: string) {
         this.client
-            .post("/notifications/dismiss", { id: id })
+            .post(`/notifications/${id}/dismiss`)
             .then((resp: any) => {
                 let notifications = this.state.notifications;
                 if (notifications !== undefined && notifications.length > 0) {

src/utilities/desktop.tsx

@@ -29,3 +29,12 @@ export function isDarkMode() {
     const { remote } = eWin.require("electron");
     return remote.systemPreferences.isDarkMode();
 }
+
+/**
+ * Get the app component from the desktop app
+ */
+export function getElectronApp() {
+    const eWin = window as ElectronWindow;
+    const { remote } = eWin.require("electron");
+    return remote.app;
+}

src/utilities/notifications.tsx

@@ -45,9 +45,7 @@ export function canSendNotifications() {
  */
 export function sendNotificationRequest(title: string, body: string) {
     if (canSendNotifications()) {
-        let notif = new Notification(title, {
-            body: body
-        });
+        let notif = new Notification(title, { body });
 
         notif.onclick = () => {
             window.focus();