Replace status bar item application update with different tray icon based on status of the update (#5769)

* Remove the auto-update status bar item for not being needed anymore

Signed-off-by: Janne Savolainen <janne.savolainen@live.fi>

* Make adding of new tray icons easier by complying to Open Closed Principle

Signed-off-by: Janne Savolainen <janne.savolainen@live.fi>

* Start showing different tray icon when checking for updates

Signed-off-by: Janne Savolainen <janne.savolainen@live.fi>

* Include placeholder icon for checking for updates

Signed-off-by: Janne Savolainen <janne.savolainen@live.fi>

* Simplify code

Signed-off-by: Janne Savolainen <janne.savolainen@live.fi>

* Add first keyframe for downloading spinner

Signed-off-by: Sebastian Malton <sebastian@malton.name>

Co-authored-by: Sebastian Malton <sebastian@malton.name>
This commit is contained in:
Janne SavolainenandSebastian Malton authored and GitHub committed 2022-07-05 15:44:03 -07:00
1 parent 26127fe906
commit 667053cdf5
52 files changed
+370 -1409

No files matched your search

@@ -0,0 +1,6 @@
<svg version="1.1" id="Layer_1"
xmlns="http://www.w3.org/2000/svg"
xmlns:xlink="http://www.w3.org/1999/xlink" viewBox="0 0 1000 1000">
<path id="arrow" class="st0" d="M760,291.25L520.160841,258.873994l63.74222-72.777055C530.714286,132.984694,460.153061,103.75,385,103.75s-145.714286,29.234694-198.903061,82.346939C132.984694,239.285714,103.75,309.846939,103.75,385s29.234694,145.714286,82.346939,198.903061C239.209184,637.015306,309.846939,666.25,385,666.25s145.714286-29.234694,198.903061-82.346939c4.438776-4.438776,8.72449-9.030612,12.780612-13.69898l70.561224,61.760204C598.443878,710.408163,497.5,760,385,760C177.908163,760,10,592.091837,10,385s167.908163-375,375-375c103.545918,0,197.295918,42.015306,265.178571,109.821429l72.331514-70.086922L760,291.25Z" transform="translate(115 115)"/>
<animateTransform attributeType="xml" attributeName="transform" type="rotate" from="0 0 0" to="360 0 0" dur="3s" additive="sum" repeatCount="indefinite" />
</svg>

After

Width:  |  Height:  |  Size: 966 B

@@ -1,107 +0,0 @@
/**
* Copyright (c) OpenLens Authors. All rights reserved.
* Licensed under MIT License. See LICENSE in root directory for more information.
*/
import { withInjectables } from "@ogre-tools/injectable-react";
import { observer } from "mobx-react";
import assert from "assert";
import React, { useState } from "react";
import { Spinner } from "../spinner";
import type { ProgressOfUpdateDownload } from "../../../common/application-update/progress-of-update-download/progress-of-update-download.injectable";
import progressOfUpdateDownloadInjectable from "../../../common/application-update/progress-of-update-download/progress-of-update-download.injectable";
import type { DiscoveredUpdateVersion } from "../../../common/application-update/discovered-update-version/discovered-update-version.injectable";
import discoveredUpdateVersionInjectable from "../../../common/application-update/discovered-update-version/discovered-update-version.injectable";
import type { UpdateIsBeingDownloaded } from "../../../common/application-update/update-is-being-downloaded/update-is-being-downloaded.injectable";
import updateIsBeingDownloadedInjectable from "../../../common/application-update/update-is-being-downloaded/update-is-being-downloaded.injectable";
import type { UpdatesAreBeingDiscovered } from "../../../common/application-update/updates-are-being-discovered/updates-are-being-discovered.injectable";
import updatesAreBeingDiscoveredInjectable from "../../../common/application-update/updates-are-being-discovered/updates-are-being-discovered.injectable";
import { reactiveNow } from "../../../common/utils/reactive-now/reactive-now";
interface Dependencies {
progressOfUpdateDownload: ProgressOfUpdateDownload;
discoveredVersionState: DiscoveredUpdateVersion;
downloadingUpdateState: UpdateIsBeingDownloaded;
checkingForUpdatesState: UpdatesAreBeingDiscovered;
}
interface EndNoteProps {
version?: string;
note: (version: string) => JSX.Element;
}
const EndNote = observer(({ version, note }: EndNoteProps) => {
const [start] = useState(Date.now());
if (start + 5000 <= reactiveNow()) {
return idle();
}
return note(version ?? "");
});
const checking = () => (
<>
<Spinner/>
<div data-testid="app-update-checking">Checking for updates...</div>
</>
);
const available = (version: string) => <div data-testid="app-update-available">{`${version ?? "Update"} is available`}</div>;
const notAvailable = () => <div data-testid="app-update-not-available">No new updates available</div>;
const downloading = (version: string) => {
return (
<>
<div data-testid="app-update-downloading">{`Downloading version ${version}...`}</div>
<Spinner/>
</>
);
};
const downloadFailed = (errMsg: string) => <div data-testid="app-update-download-failed">{errMsg}</div>;
const idle = () => <div data-testid="app-update-idle"></div>;
export const NonInjectedAutoUpdateComponent = observer(({
progressOfUpdateDownload,
discoveredVersionState,
downloadingUpdateState,
checkingForUpdatesState,
}: Dependencies) => {
const discoveredVersion = discoveredVersionState.value.get();
const { failed } = progressOfUpdateDownload.value.get();
if (downloadingUpdateState.value.get()) {
assert(discoveredVersion);
return downloading(discoveredVersion.version);
}
if (checkingForUpdatesState.value.get()) {
return checking();
}
if ( discoveredVersion) {
return <EndNote note={available} version={discoveredVersion.version} />;
}
if ( failed ) {
return <EndNote note={downloadFailed} version={failed} />;
}
return <EndNote note={notAvailable} />;
});
export const AutoUpdateComponent = withInjectables<Dependencies>(NonInjectedAutoUpdateComponent, {
getProps: (di, props) => ({
progressOfUpdateDownload: di.inject(progressOfUpdateDownloadInjectable),
discoveredVersionState: di.inject(discoveredUpdateVersionInjectable),
downloadingUpdateState: di.inject(updateIsBeingDownloadedInjectable),
checkingForUpdatesState: di.inject(updatesAreBeingDiscoveredInjectable),
...props,
}),
});
@@ -1,22 +0,0 @@
/**
* Copyright (c) OpenLens Authors. All rights reserved.
* Licensed under MIT License. See LICENSE in root directory for more information.
*/
import { getInjectable } from "@ogre-tools/injectable";
import { computed } from "mobx";
import { AutoUpdateComponent } from "./auto-update-component";
import { statusBarItemInjectionToken } from "./status-bar-item-injection-token";
const autoUpdateStatusBarItemInjectable = getInjectable({
id: "auto-update-status-bar-item",
instantiate: () => ({
component: AutoUpdateComponent,
position: "left" as const,
visible: computed(() => true),
}),
injectionToken: statusBarItemInjectionToken,
});
export default autoUpdateStatusBarItemInjectable;
@@ -43,7 +43,6 @@ import applicationWindowInjectable from "../../../main/start-main-application/le
import { getDiForUnitTesting as getRendererDi } from "../../getDiForUnitTesting";
import { getDiForUnitTesting as getMainDi } from "../../../main/getDiForUnitTesting";
import { overrideChannels } from "../../../test-utils/channel-fakes/override-channels";
import trayIconPathsInjectable from "../../../main/tray/tray-icon-path.injectable";
import assert from "assert";
import { openMenu } from "react-select-event";
import userEvent from "@testing-library/user-event";
@@ -194,11 +193,7 @@ export const getApplicationBuilder = () => {
const traySetMenuItemsMock = jest.fn<any, [MinimalTrayMenuItem[]]>();
mainDi.override(electronTrayInjectable, () => ({
start: () => {
const iconPaths = mainDi.inject(trayIconPathsInjectable);
trayMenuIconPath = iconPaths.normal;
},
start: () => {},
stop: () => {},
setMenuItems: traySetMenuItemsMock,
setIconPath: (path) => {