Clear all storage implemented

static/js/node_store.mjs

@@ -328,6 +328,52 @@ export class NodeStore {
 		this.nodes[ORPHANED_NODE] = new Node({ UUID: ORPHANED_NODE, Name: 'Orphaned nodes', Special: true }, -1)
 	}// }}}
 
+	deleteAll() {// {{{
+		this.db.close()
+
+		const req = indexedDB.deleteDatabase('notes')
+
+		req.onsuccess = async () => {
+			try {
+				console.log('Database deleted successfully')
+
+				// Deleting the storage will log out the user.
+				await this.deleteStorage()
+				await this.deleteCaches()
+				await this.deleteServiceWorkers()
+
+				alert('Database deleted, will now log out.')
+				location.href = '/login'
+			} catch (e) {
+				console.error(e)
+				alert(e.message)
+			}
+		}
+
+		req.onerror = (event) => {
+			console.error('Error deleting database:', event.target.errorCode)
+		}
+
+		req.onblocked = () => {
+			console.warn('Deletion blocked. Close all other tabs/connections to this DB.')
+		}
+	}// }}}
+	async deleteStorage() {// {{{
+		// Clearing local- and session-storage in case
+		// something of value to evil people gets stored there.
+		localStorage.clear()
+		sessionStorage.clear()
+		console.log('Local- and session-storage cleared.')
+	}// }}}
+	async deleteCaches() {// {{{
+		const keys = await caches.keys()
+		return Promise.all(keys.map(key => caches.delete(key)))
+	}// }}}
+	async deleteServiceWorkers() {// {{{
+		const registrations = await navigator.serviceWorker.getRegistrations()
+		await Promise.all(registrations.map(r => r.unregister()))
+	}// }}}
+
 	node(uuid, dataIfUndefined, newLevel) {//{{{
 		let n = this.nodes[uuid]
 		if (n === undefined && dataIfUndefined !== undefined)

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>History notes</div>
-				<div data-el="count-queued-nodes"></div>
-
-				<div>History nodes</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)

views/layouts/main.gotmpl

@@ -20,7 +20,8 @@
 		<script>
 			globalThis._VERSION = "{{ .VERSION }}"
 
-			if (navigator.serviceWorker)
+			const token = localStorage.getItem('token')
+			if (token && navigator.serviceWorker)
 				navigator.serviceWorker.register('/service_worker.js', { type: 'module' })
 		</script>
 		<script type="module" defer>