feat: enable notification badge

[nsakaimbo]

Description

This PR restores the unseen notification badge. Notification badge is enabled in Preferences. Based on existing code, this feature used to work in the past but seems to have silently broken at some point along the way.

• Mac: badge with numeric counter (with optional "bounce" preference)
• Linux: badge with numeric counter
• Windows: badge with "dot" indicating unread

How it Works

• Desktop Redux middleware intercepts the existing NOTIFICATIONS_UNSEEN_COUNT_SET event to send the unseen count to the main process.
• The isVisible flag is overriden in Calypso's apps/notifications component in order to ensure that pinghub websocket polling continues even when the application's main window may be closed/hidden. In addition, this ensures that the notifications component continues to relay notification events when the application window is hidden or otherwise out of sight.

Areas for Improvement

Will be looking at augmenting native notifications with actual notification messages as part of a separate effort/downstream PR. (Need to do more research/experimentation to see how to integrate/sync with Calypso's existing infrastructure.)

[matticbot]

Test live: https://calypso.live/?branch=desktop-notifications

[matticbot]

Here is how your PR affects size of JS and CSS bundles shipped to the user's browser:

App Entrypoints (~49 bytes added 📈 [gzipped])

name        parsed_size           gzip_size
entry-main       +287 B  (+0.0%)      +49 B  (+0.0%)

Common code that is always downloaded and parsed every time the app is loaded, no matter which route is used.

Async-loaded Components (~19 bytes added 📈 [gzipped])

name                                     parsed_size           gzip_size
async-load-apps-notifications-index-jsx        +40 B  (+0.0%)      +19 B  (+0.1%)

React components that are loaded lazily, when a certain part of UI is displayed for the first time.

Legend

What is parsed and gzip size?

Parsed Size: Uncompressed size of the JS and CSS files. This much code needs to be parsed and stored in memory.
Gzip Size: Compressed size of the JS and CSS files. This much data needs to be downloaded over network.

Generated by performance advisor bot at iscalypsofastyet.com.

[belcherj]

Looks great!