myxelium/Bridge-Multi
1
0
Fork 0
mirror of https://github.com/Myxelium/Bridge-Multi.git synced 2026-04-11 14:19:38 +00:00
Code Issues Packages Projects Releases Wiki Activity

Improve update UI

Browse Source
This commit is contained in:
Geomitron
2024-07-10 23:15:38 -05:00
parent ba357d5fea
commit 0c8b20c3e9
9 changed files with 53 additions and 39 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
src-angular/app/components/settings/settings.component.html
View File

@@ -139,10 +139,10 @@
<div class="absolute bottom-8 right-8 flex gap-6">
<div class="join">
<button *ngIf="updateAvailable" class="join-item btn btn-primary" (click)="downloadUpdate()">
<button *ngIf="updateAvailable === 'yes'" class="join-item btn btn-primary" (click)="downloadUpdate()">
<i class="bi text-xl" [ngClass]="updateDownloaded ? 'bi-arrow-repeat' : 'bi-cloud-arrow-down'"></i>{{ downloadUpdateText }}
</button>
<button *ngIf="updateAvailable === null" class="join-item btn btn-warning" [class.disabled]="updateRetrying" (click)="retryUpdate()">
<button *ngIf="updateAvailable === 'error'" class="join-item btn btn-warning" [class.disabled]="updateRetrying" (click)="retryUpdate()">
<i class="bi bi-arrow-repeat text-xl" [class.loading]="updateRetrying"></i>{{ retryUpdateText }}
</button>
<button class="join-item btn btn-outline btn-disabled">{{ currentVersion }}</button>

42
src-angular/app/components/settings/settings.component.ts
View File

@@ -15,9 +15,9 @@ export class SettingsComponent implements OnInit {
public isSng: FormControl<boolean>
public isCompactTable: FormControl<boolean>
updateAvailable: boolean | null = false
updateAvailable: 'yes' | 'no' | 'error' = 'no'
loginClicked = false
downloadUpdateText = 'Update available'
downloadUpdateText = 'Download Update'
retryUpdateText = 'Failed to check for update'
updateDownloading = false
updateDownloaded = false
@@ -36,18 +36,18 @@ export class SettingsComponent implements OnInit {
async ngOnInit() {
window.electron.on.updateAvailable(result => {
this.updateAvailable = result !== null
this.updateAvailable = result !== null ? 'yes' : 'no'
this.updateRetrying = false
if (result !== null) {
this.downloadUpdateText = `Update available (${result.version})`
this.downloadUpdateText = `Download Update (${result.version})`
}
this.ref.detectChanges()
})
window.electron.on.updateError(err => {
console.log(err)
this.updateAvailable = null
this.updateAvailable = 'error'
this.updateRetrying = false
this.retryUpdateText = `Failed to check for update: ${err}`
this.retryUpdateText = 'Failed to check for update'
this.ref.detectChanges()
})
window.electron.invoke.getCurrentVersion().then(version => {
@@ -94,22 +94,26 @@ export class SettingsComponent implements OnInit {
return _.capitalize(text)
}
downloadUpdate() {
async downloadUpdate() {
if (this.updateDownloaded) {
window.electron.emit.quitAndInstall()
} else if (!this.updateDownloading) {
this.updateDownloading = true
window.electron.emit.downloadUpdate()
this.downloadUpdateText = 'Downloading... (0%)'
window.electron.on.updateProgress(result => {
this.downloadUpdateText = `Downloading... (${result.percent.toFixed(0)}%)`
this.ref.detectChanges()
})
window.electron.on.updateDownloaded(() => {
this.downloadUpdateText = 'Quit and install update'
this.updateDownloaded = true
this.ref.detectChanges()
})
if (await window.electron.invoke.getPlatform() === 'darwin') { // Thanks Apple...
this.openUrl('https://github.com/Geomitron/Bridge/releases/latest')
} else {
this.updateDownloading = true
window.electron.emit.downloadUpdate()
this.downloadUpdateText = 'Downloading... (0%)'
window.electron.on.updateProgress(result => {
this.downloadUpdateText = `Downloading... (${result.percent.toFixed(0)}%)`
this.ref.detectChanges()
})
window.electron.on.updateDownloaded(() => {
this.downloadUpdateText = 'Quit and install update'
this.updateDownloaded = true
this.ref.detectChanges()
})
}
}
}

10
src-angular/app/components/toolbar/toolbar.component.html
View File

@@ -1,11 +1,11 @@
<div class="navbar p-0 min-h-0 bg-base-100" style="-webkit-app-region: drag">
<div style="-webkit-app-region: no-drag">
<button class="btn btn-square btn-ghost rounded-none px-11" routerLinkActive="btn-active" routerLink="/browse">Browse</button>
<!-- TODO <a class="btn btn-square btn-ghost rounded-none" routerLinkActive="btn-active" routerLink="/library">Library</a> -->
<button class="btn btn-square btn-ghost rounded-none px-11 flex flex-nowrap" routerLinkActive="btn-active" routerLink="/settings">
<div *ngIf="updateAvailable" class="badge badge-accent badge-xs"></div>
<i *ngIf="updateAvailable === null" class="bi bi-exclamation-triangle-fill text-warning"></i>
<button class="btn btn-ghost rounded-none" routerLinkActive="btn-active" routerLink="/browse">Browse</button>
<!-- TODO <a class="btn btn-ghost rounded-none" routerLinkActive="btn-active" routerLink="/library">Library</a> -->
<button class="btn btn-ghost rounded-none flex flex-nowrap" routerLinkActive="btn-active" routerLink="/settings">
<i *ngIf="updateAvailable === 'error'" class="bi bi-exclamation-triangle-fill text-warning"></i>
Settings
<div *ngIf="updateAvailable === 'yes'" class="badge badge-accent badge-sm">Update Available</div>
</button>
</div>
<div class="flex-1"></div>

6
src-angular/app/components/toolbar/toolbar.component.ts
View File

@@ -7,7 +7,7 @@ import { ChangeDetectorRef, Component, OnInit } from '@angular/core'
export class ToolbarComponent implements OnInit {
isMaximized: boolean
updateAvailable: boolean | null = false
updateAvailable: 'yes' | 'no' | 'error' = 'no'
constructor(private ref: ChangeDetectorRef) { }
@@ -23,11 +23,11 @@ export class ToolbarComponent implements OnInit {
})
window.electron.on.updateAvailable(result => {
this.updateAvailable = result !== null
this.updateAvailable = result !== null ? 'yes' : 'no'
this.ref.detectChanges()
})
window.electron.on.updateError(() => {
this.updateAvailable = null
this.updateAvailable = 'error'
this.ref.detectChanges()
})
this.updateAvailable = await window.electron.invoke.getUpdateAvailable()