show storage usage in settings

This commit is contained in:
Bruno Windels 2020-10-20 17:50:43 +02:00
parent 545a2e481a
commit 7459985e00
6 changed files with 57 additions and 3 deletions

View File

@ -127,7 +127,8 @@ export class RootViewModel extends ViewModel {
this._setSection(() => { this._setSection(() => {
this._sessionViewModel = new SessionViewModel(this.childOptions({ this._sessionViewModel = new SessionViewModel(this.childOptions({
sessionContainer, sessionContainer,
updateService: this.getOption("updateService") updateService: this.getOption("updateService"),
estimateStorageUsage: this.getOption("estimateStorageUsage"),
})); }));
this._sessionViewModel.start(); this._sessionViewModel.start();
}); });

View File

@ -189,8 +189,10 @@ export class SessionViewModel extends ViewModel {
if (settingsOpen) { if (settingsOpen) {
this._settingsViewModel = this.track(new SettingsViewModel(this.childOptions({ this._settingsViewModel = this.track(new SettingsViewModel(this.childOptions({
updateService: this.getOption("updateService"), updateService: this.getOption("updateService"),
session: this._sessionContainer.session session: this._sessionContainer.session,
estimateStorageUsage: this.getOption("estimateStorageUsage")
}))); })));
this._settingsViewModel.load();
} }
this.emitChange("activeSection"); this.emitChange("activeSection");
} }

View File

@ -35,6 +35,13 @@ export class SettingsViewModel extends ViewModel {
this._session = session; this._session = session;
this._sessionBackupViewModel = this.track(new SessionBackupViewModel(this.childOptions({session}))); this._sessionBackupViewModel = this.track(new SessionBackupViewModel(this.childOptions({session})));
this._closeUrl = this.urlCreator.urlUntilSegment("session"); this._closeUrl = this.urlCreator.urlUntilSegment("session");
this._estimateStorageUsage = options.estimateStorageUsage;
this._estimate = null;
}
async load() {
this._estimate = await this._estimateStorageUsage();
this.emitChange("");
} }
get closeUrl() { get closeUrl() {
@ -71,4 +78,21 @@ export class SettingsViewModel extends ViewModel {
get sessionBackupViewModel() { get sessionBackupViewModel() {
return this._sessionBackupViewModel; return this._sessionBackupViewModel;
} }
get storageQuota() {
return this._formatBytes(this._estimate?.quota);
}
get storageUsage() {
return this._formatBytes(this._estimate?.usage);
}
_formatBytes(n) {
if (typeof n === "number") {
return Math.round(n / (1024 * 1024)).toFixed(1) + " MB";
} else {
return this.i18n`unknown`;
}
}
} }

View File

@ -29,6 +29,7 @@ import {ServiceWorkerHandler} from "./ui/web/dom/ServiceWorkerHandler.js";
import {History} from "./ui/web/dom/History.js"; import {History} from "./ui/web/dom/History.js";
import {OnlineStatus} from "./ui/web/dom/OnlineStatus.js"; import {OnlineStatus} from "./ui/web/dom/OnlineStatus.js";
import {CryptoDriver} from "./ui/web/dom/CryptoDriver.js"; import {CryptoDriver} from "./ui/web/dom/CryptoDriver.js";
import {estimateStorageUsage} from "./ui/web/dom/StorageEstimate.js";
import {WorkerPool} from "./utils/WorkerPool.js"; import {WorkerPool} from "./utils/WorkerPool.js";
import {OlmWorker} from "./matrix/e2ee/OlmWorker.js"; import {OlmWorker} from "./matrix/e2ee/OlmWorker.js";
@ -147,7 +148,8 @@ export async function main(container, paths, legacyExtras) {
// so we call it that in the view models // so we call it that in the view models
urlCreator: urlRouter, urlCreator: urlRouter,
navigation, navigation,
updateService: serviceWorkerHandler updateService: serviceWorkerHandler,
estimateStorageUsage
}); });
window.__hydrogenViewModel = vm; window.__hydrogenViewModel = vm;
await vm.load(); await vm.load();

View File

@ -0,0 +1,24 @@
/*
Copyright 2020 The Matrix.org Foundation C.I.C.
Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at
http://www.apache.org/licenses/LICENSE-2.0
Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.
*/
export async function estimateStorageUsage() {
if (navigator?.storage?.estimate) {
const {quota, usage} = await navigator.storage.estimate();
return {quota, usage};
} else {
return {quota: null, usage: null};
}
}

View File

@ -48,6 +48,7 @@ export class SettingsView extends TemplateView {
t.view(new SessionBackupSettingsView(vm.sessionBackupViewModel)), t.view(new SessionBackupSettingsView(vm.sessionBackupViewModel)),
t.h3("Application"), t.h3("Application"),
row(vm.i18n`Version`, version), row(vm.i18n`Version`, version),
row(vm.i18n`Storage usage`, vm => `${vm.storageUsage} / ${vm.storageQuota}`),
]) ])
]); ]);
} }