From 458b799da1face06ee288d301974b2ba451fa408 Mon Sep 17 00:00:00 2001 From: Eryk Rakowski Date: Sat, 29 Feb 2020 12:44:14 +0100 Subject: [PATCH] feat: notify user about updates (#410) * fix: dialogs animations * feat: notify user about updates --- src/main/dialogs/extension-popup.ts | 2 +- src/main/services/auto-updater.ts | 19 +++++++++++++++---- .../views/app/components/Toolbar/index.tsx | 9 ++++++++- src/renderer/views/app/store/index.ts | 11 +++-------- .../views/menu/components/QuickMenu/index.tsx | 13 +++++++++++++ src/renderer/views/menu/store/index.ts | 10 +++++++++- .../views/search/components/App/style.ts | 4 ++-- .../views/tabgroup/components/App/style.ts | 1 + static/pages/extension-popup.html | 5 ++--- webpack.config.js | 14 ++++++++------ 10 files changed, 62 insertions(+), 26 deletions(-) diff --git a/src/main/dialogs/extension-popup.ts b/src/main/dialogs/extension-popup.ts index 2da92b912..b3c76ba04 100644 --- a/src/main/dialogs/extension-popup.ts +++ b/src/main/dialogs/extension-popup.ts @@ -19,7 +19,7 @@ export class ExtensionPopup extends Dialog { bounds: { width: 512, height: 512, - y: 34, + y: 30, }, devtools: false, webPreferences: { diff --git a/src/main/services/auto-updater.ts b/src/main/services/auto-updater.ts index 00633f4a9..bf6e74007 100644 --- a/src/main/services/auto-updater.ts +++ b/src/main/services/auto-updater.ts @@ -3,17 +3,28 @@ import { ipcMain } from 'electron'; import { WindowsManager } from '../windows-manager'; export const runAutoUpdaterService = (windowsManager: WindowsManager) => { - ipcMain.on('update-install', () => { - autoUpdater.quitAndInstall(); + let updateAvailable = false; + + ipcMain.on('install-update', () => { + if (process.env.NODE_ENV !== 'development') { + autoUpdater.quitAndInstall(true, true); + } + }); + + ipcMain.handle('is-update-available', () => { + return updateAvailable; }); ipcMain.on('update-check', () => { autoUpdater.checkForUpdates(); }); - autoUpdater.on('update-downloaded', ({ version }) => { + autoUpdater.on('update-downloaded', () => { + updateAvailable = true; + for (const window of windowsManager.list) { - window.webContents.send('update-available', version); + window.webContents.send('update-available'); + window.dialogs.menuDialog.webContents.send('update-available'); } }); }; diff --git a/src/renderer/views/app/components/Toolbar/index.tsx b/src/renderer/views/app/components/Toolbar/index.tsx index 1e6abfebf..5f8cbcbb5 100644 --- a/src/renderer/views/app/components/Toolbar/index.tsx +++ b/src/renderer/views/app/components/Toolbar/index.tsx @@ -146,7 +146,14 @@ const RightButtons = observer(() => { )} {store.isIncognito && } - + ); }); diff --git a/src/renderer/views/app/store/index.ts b/src/renderer/views/app/store/index.ts index 8043ec395..8c8f5bf05 100644 --- a/src/renderer/views/app/store/index.ts +++ b/src/renderer/views/app/store/index.ts @@ -6,7 +6,6 @@ import { AddTabStore } from './add-tab'; import { ipcRenderer } from 'electron'; import { ExtensionsStore } from './extensions'; import { SettingsStore } from './settings'; -import { extensionsRenderer } from 'electron-extensions/renderer'; import { getCurrentWindow } from '../utils/windows'; import { StartupTabsStore } from './startup-tabs'; import { getTheme } from '~/utils/themes'; @@ -39,10 +38,7 @@ export class Store { public isHTMLFullscreen = false; @observable - public updateInfo = { - available: false, - version: '', - }; + public updateAvailable = false; @observable public navigationState = { @@ -104,9 +100,8 @@ export class Store { this.isHTMLFullscreen = fullscreen; }); - ipcRenderer.on('update-available', (e, version: string) => { - this.updateInfo.version = version; - this.updateInfo.available = true; + ipcRenderer.on('update-available', () => { + this.updateAvailable = true; }); ipcRenderer.on('download-started', (e, item) => { diff --git a/src/renderer/views/menu/components/QuickMenu/index.tsx b/src/renderer/views/menu/components/QuickMenu/index.tsx index 1240d9a6a..5d281b672 100644 --- a/src/renderer/views/menu/components/QuickMenu/index.tsx +++ b/src/renderer/views/menu/components/QuickMenu/index.tsx @@ -62,6 +62,10 @@ const goToWebUIPage = (name: string) => () => { store.hide(); }; +const onUpdateClick = () => { + ipcRenderer.send('install-update'); +}; + export const QuickMenu = observer(() => { return (
{ > + {store.updateAvailable && ( + <> + + + Update {remote.app.name} + + + + )} Night mode diff --git a/src/renderer/views/menu/store/index.ts b/src/renderer/views/menu/store/index.ts index 5ea143861..22418d138 100644 --- a/src/renderer/views/menu/store/index.ts +++ b/src/renderer/views/menu/store/index.ts @@ -6,11 +6,19 @@ export class Store extends DialogStore { @observable public alwaysOnTop = false; + @observable + public updateAvailable = false; + public constructor() { super(); - ipcRenderer.on('visible', (e, flag) => { + ipcRenderer.on('visible', async (e, flag) => { this.visible = flag; this.alwaysOnTop = remote.getCurrentWindow().isAlwaysOnTop(); + this.updateAvailable = await ipcRenderer.invoke('is-update-available'); + }); + + ipcRenderer.on('update-available', () => { + this.updateAvailable = true; }); } diff --git a/src/renderer/views/search/components/App/style.ts b/src/renderer/views/search/components/App/style.ts index 8cdc4d9b8..0974fd79a 100644 --- a/src/renderer/views/search/components/App/style.ts +++ b/src/renderer/views/search/components/App/style.ts @@ -5,8 +5,8 @@ import { ITheme } from '~/interfaces'; import { DialogStyle } from '~/renderer/mixins/dialogs'; export const StyledApp = styled(DialogStyle)` - ${({ visible, theme }: { visible: boolean; theme?: ITheme }) => css` - transform: translateY(${visible ? 0 : -5}px); + margin-top: 10px; + ${({ theme }: { theme?: ITheme }) => css` box-shadow: 0 0 0 2px ${theme['searchBox.input.lightForeground'] ? BLUE_500 : BLUE_300}, ${shadows(4)}; diff --git a/src/renderer/views/tabgroup/components/App/style.ts b/src/renderer/views/tabgroup/components/App/style.ts index fb832afb0..189323916 100644 --- a/src/renderer/views/tabgroup/components/App/style.ts +++ b/src/renderer/views/tabgroup/components/App/style.ts @@ -3,6 +3,7 @@ import { ITheme } from '~/interfaces'; import { DialogStyle } from '~/renderer/mixins/dialogs'; export const StyledApp = styled(DialogStyle)` + margin-top: 10px; padding: 16px; `; diff --git a/static/pages/extension-popup.html b/static/pages/extension-popup.html index da02da7ac..5201124a2 100644 --- a/static/pages/extension-popup.html +++ b/static/pages/extension-popup.html @@ -20,12 +20,11 @@ .app { margin: 8px; - margin-top: 3px; + margin-top: 10px; box-shadow: 0 3px 6px rgba(0, 0, 0, 0.16), 0 3px 6px rgba(0, 0, 0, 0.23); overflow: hidden; position: relative; - transition: 0.35s opacity, - 0.35s transform cubic-bezier(0.1, 0.9, 0.2, 1); + transition: 0.3s opacity, 0.3s transform; background-color: white; width: fit-content; transform: translateY(-10px); diff --git a/webpack.config.js b/webpack.config.js index 52d884e87..77e4b615a 100644 --- a/webpack.config.js +++ b/webpack.config.js @@ -57,13 +57,15 @@ if (process.env.START === '1') { apply: compiler => { compiler.hooks.afterEmit.tap('AfterEmitPlugin', () => { if (electronProcess) { - if (process.platform === 'win32') { - execSync(`taskkill /pid ${electronProcess.pid} /f /t`); - } else { - electronProcess.kill(); - } + try { + if (process.platform === 'win32') { + execSync(`taskkill /pid ${electronProcess.pid} /f /t`); + } else { + electronProcess.kill(); + } - electronProcess = null; + electronProcess = null; + } catch (e) {} } electronProcess = spawn('npm', ['start'], {