Clear all storage implemented

static/js/page_storage.mjs

@@ -2,7 +2,7 @@ import { CustomHTMLElement } from "./lib/custom_html_element.mjs"
 import { API } from 'api'
 
 export class N2PageStorage extends CustomHTMLElement {
-	static {
+	static {// {{{
 		this.tmpl = document.createElement('template')
 		this.tmpl.innerHTML = `
 			<style>
@@ -25,20 +25,24 @@ export class N2PageStorage extends CustomHTMLElement {
 					margin-top: 24px;
 					margin-bottom: 8px;
 				}
+
+				.el-btn-clear-all {
+					margin-top: 16px;
+				}
 			</style>
 
 			<h1>Local storage</h1>
 
-			<h2>Nodes</h2>
+			<h2>Notes</h2>
 			<div class="table">
-				<div>Local nodes</div>
+				<div>Local notes</div>
 				<div data-el="count-nodes"></div>
 
-				<div>Queued to sync</div>
-				<div data-el="count-queued-nodes"></div>
-
-				<div>History nodes</div>
+				<div>History notes</div>
 				<div data-el="count-history-nodes"></div>
+
+				<div>Notes to send</div>
+				<div data-el="count-queued-nodes"></div>
 			</div>
 
 			<h2>Files</h2>
@@ -52,17 +56,24 @@ export class N2PageStorage extends CustomHTMLElement {
 				<div>Files to send</div>
 				<div data-el="count-queued-files"></div>
 			</div>
+
+			<h2>Clear storage</h2>
+			<div>Remove all data from this device (not server) and logout the session.</div>
+			<div>This ensures that no notes or files is left on the browser.</div>
+			<button data-el="btn-clear-all">Clear and logout</button>
 		`
-	}
-	constructor() {
+	}// }}}
+	constructor() {// {{{
 		super(true)
 
+		.elBtnClearAll.addEventListener('click', ()=>this.clearAll())
+
 		window._mbus.subscribe('SHOW_PAGE', event => {
 			if (event.detail.data?.page == 'storage')
 				this.render()
 		})
-	}
-	async render() {
+	}// }}}
+	async render() {// {{{
 		API.query('GET', '/file/count')
 			.then(res => {
 				this.elCountFilesOnServer.innerText = res.Count
@@ -80,6 +91,12 @@ export class N2PageStorage extends CustomHTMLElement {
 		this.elCountQueuedFiles.innerText = await globalThis.nodeStore.filesMetadata.countToUpload()
 
 		this.elCountFilesOnDevice.innerText = await globalThis.nodeStore.filesMetadata.count()
-	}
+	}// }}}
+	clearAll() {// {{{
+		if (!confirm('Do you want to remove ALL data from this device and logout?'))
+			return
+
+		globalThis.nodeStore.deleteAll()
+	}// }}}
 }
 customElements.define('n2-pagestorage', N2PageStorage)