COMPASS-586: Improve Linux appearance (logo in popups/about box, ...)

src/app/connect/index.js

@@ -16,6 +16,7 @@ var dialog = remote.dialog;
 var Clipboard = remote.clipboard;
 var BrowserWindow = remote.BrowserWindow;
 var metrics = require('mongodb-js-metrics')();
+var COMPASS_ICON = require('../../icon');
 
 var debug = require('debug')('mongodb-compass:connect:index');
 
@@ -331,6 +332,7 @@ var ConnectView = View.extend({
       // ask user if Compass should use it to fill out form
       dialog.showMessageBox(BrowserWindow.getFocusedWindow(), {
         type: 'info',
+        icon: COMPASS_ICON,
         message: 'MongoDB connection string detected',
         detail: 'Compass detected a MongoDB connection string in your '
           + 'clipboard. Do you want to use the connection string to '

src/icon.js

@@ -0,0 +1,19 @@
+var path = require('path');
+var COMPASS_ICON = path.join(__dirname, 'app', 'images', 'compass-dialog-icon.png');
+var nativeImage = require('electron').nativeImage;
+
+/**
+ * Convenience for getting the app icon to customize native UI components
+ * via electron.
+ *
+ * @example
+ * ```javascript
+ * var icon = require('./icon');
+ * var dialog = require('electron').dialog;
+ * dialog.showMessageBox({icon: icon, message: 'I have a nice Compass icon.'});
+ * ```
+ *
+ * @see https://jira.mongodb.org/browse/COMPASS-586
+ */
+module.exports = nativeImage.createFromPath(COMPASS_ICON);
+module.exports.path = COMPASS_ICON;

src/internal-packages/schema/lib/store/index.js

@@ -7,6 +7,8 @@ const schemaStream = require('mongodb-schema').stream;
 const toNS = require('mongodb-ns');
 const ReadPreference = require('mongodb').ReadPreference;
 
+const COMPASS_ICON = require('../../../../icon');
+
 /**
  * The default read preference.
  */
@@ -72,6 +74,7 @@ const SchemaStore = Reflux.createStore({
 
     dialog.showMessageBox(BrowserWindow.getFocusedWindow(), {
       type: 'info',
+      icon: COMPASS_ICON,
       message: 'Share Schema',
       detail: detail,
       buttons: ['OK']

src/main/window-manager.js

@@ -14,6 +14,7 @@ var debug = require('debug')('mongodb-compass:electron:window-manager');
 var dialog = electron.dialog;
 var path = require('path');
 var ipc = require('hadron-ipc');
+var COMPASS_ICON = require('../icon');
 
 /**
  * When running in electron, we're in `/src/main`.
@@ -118,13 +119,21 @@ var createWindow = module.exports.create = function(opts) {
     width: DEFAULT_WIDTH,
     height: DEFAULT_HEIGHT,
     minwidth: MIN_WIDTH,
-    url: DEFAULT_URL
+    url: DEFAULT_URL,
+    /**
+     * On Windows and macOS, this will be set automatically to the optimal
+     * app icon.  Only on Linux do we need to set this explictly.
+     *
+     * @see https://jira.mongodb.org/browse/COMPASS-586
+     */
+    icon: process.platform === 'linux' ? COMPASS_ICON : undefined
   });
 
   debug('creating new window: ' + opts.url);
   var _window = new BrowserWindow({
     width: opts.width,
     height: opts.height,
+    icon: opts.icon,
     'min-width': opts.minwidth,
     'web-preferences': {
       'subpixel-font-scaling': true,
@@ -164,9 +173,9 @@ function showConnectWindow() {
 function showAboutDialog() {
   dialog.showMessageBox({
     type: 'info',
-    title: 'About MongoDB Compass',
-    icon: path.join(RESOURCES, 'images', 'compass-dialog-icon.png'),
-    message: 'MongoDB Compass',
+    title: 'About ' + app.getName(),
+    icon: COMPASS_ICON,
+    message: app.getName(),
     detail: 'Version ' + app.getVersion(),
     buttons: ['OK']
   });

test/unit/icon.test.js

@@ -0,0 +1,8 @@
+var assert = require('assert');
+var icon = require('../../src/icon');
+
+describe('icon', function() {
+  it('should be a non-empty nativeImage', function() {
+    assert.equal(icon.isEmpty(), false);
+  });
+});