Implement auto dark mode

src/main.js

@@ -4,6 +4,7 @@ const {
   ipcMain,
   Tray,
   nativeImage,
+  nativeTheme,
   Notification,
   electron
 } = require('electron')
@@ -40,17 +41,32 @@ app.on('window-all-closed', () => {
   app.quit()
 })
 
-const createTray = () => {
-  const icon = nativeImage.createFromPath(path.join(__dirname, 'battery.png')).resize({
+const createIcon = (image) => {
+  return nativeImage.createFromPath(path.join(__dirname, image)).resize({
     width: 24,
     height: 24
   })
+}
+
+const createTray = () => {
+  let icon
+  if (nativeTheme.shouldUseDarkColors) {
+    icon = createIcon('battery_dark.png')
+  } else {
+    icon = createIcon('battery_light.png')
+  }
   tray = new Tray(icon)
   tray.on('right-click', toggleWindow)
   tray.on('double-click', toggleWindow)
   tray.on('click', toggleWindow)
 }
 
+nativeTheme.on('updated', function() {
+  tray.destroy()
+  createTray()
+  window.reload()
+})
+
 const getWindowPosition = () => {
   const windowBounds = window.getBounds()
   const trayBounds = tray.getBounds()
@@ -72,7 +88,10 @@ const createWindow = () => {
     frame: false,
     fullscreenable: false,
     resizable: false,
-    transparent: true
+    transparent: true,
+    webPreferences: {
+      nodeIntegration: true
+    }
   })
   window.loadURL(`file://${path.join(__dirname, 'index.html')}`)
 
@@ -82,9 +101,9 @@ const createWindow = () => {
 
   window.webContents.on('did-finish-load', sendCurrentValues)
 
-  // window.openDevTools({
-  //   mode: 'detach'
-  // })
+  window.openDevTools({
+    mode: 'detach'
+  })
 }
 
 const toggleWindow = () => {
@@ -150,4 +169,4 @@ setInterval(() => {
 
     window.webContents.send('battery', level)
   }).catch(() => console.log('Could not get Battery level'))
-}, 3000)
+}, 3000)