Improve flush (#7328)

src/server/web/views/flush.pug

@@ -4,35 +4,44 @@ html
 	#msg
 	script.
 		const msg = document.getElementById('msg');
+		const successText = `\nSuccess Flush! <a href="/">Back to Misskey</a>\n成功しました。<a href="/">Misskeyを開き直してください。</a>`;
 
-		try {
-			localStorage.clear();
-			message('localStorage cleared');
+		message('Start flushing.');
 
-			const delidb = indexedDB.deleteDatabase('MisskeyClient');
-			delidb.onsuccess = () => message('indexedDB cleared');
+		(async function() {
+			try {
+				localStorage.clear();
+				message('localStorage cleared.');
 
-			if (navigator.serviceWorker.controller) {
-				navigator.serviceWorker.controller.postMessage('clear');
-				navigator.serviceWorker.getRegistrations()
-					.then(registrations => {
-						return Promise.all(registrations.map(registration => registration.unregister()));
-					})
-					.then(() => {
-						message('Success Flush! Please reopen Misskey.\n成功しました。Misskeyを開き直してください。');
-					})
-					.catch(e => { throw Error(e) });
-			} else {
-				message('Success Flush! Please reopen Misskey.\n成功しました。Misskeyを開き直してください。');
+				const idbPromises = ['MisskeyClient', 'keyval-store'].map((name, i, arr) => new Promise((res, rej) => {
+					const delidb = indexedDB.deleteDatabase(name);
+					delidb.onsuccess = () => res(message(`indexedDB "${name}" cleared. (${i + 1}/${arr.length})`));
+					delidb.onerror = e => rej(e)
+				}));
+
+				await Promise.all(idbPromises);
+
+				if (navigator.serviceWorker.controller) {
+					navigator.serviceWorker.controller.postMessage('clear');
+					await navigator.serviceWorker.getRegistrations()
+						.then(registrations => {
+							return Promise.all(registrations.map(registration => registration.unregister()));
+						})
+						.catch(e => { throw Error(e) });
+				}
+
+				message(successText);
+			} catch (e) {
+				message(`\n${e}\n\nFlush Failed. <a href="/flush">Please retry.</a>\n失敗しました。<a href="/flush">もう一度試してみてください。</a>`);
+				message(`\nIf you retry more than 3 times, clear the browser cache or contact to instance admin.\n3回以上試しても失敗する場合、ブラウザのキャッシュを消去し、それでもだめならインスタンス管理者に連絡してみてください。\n`)
+
+				console.error(e);
+				setTimeout(() => {
+					location = '/';
+				}, 10000)
 			}
-		} catch (e) {
-			console.error(e);
-			message(`${e}¥n¥nFlush Failed. Please reopen Misskey.\n失敗しました。Misskeyを開き直してください。`);
-			setTimeout(() => {
-				location = '/';
-			}, 10000)
-		}
+		})();
 
 		function message(text) {
-			msg.insertAdjacentHTML('beforeend', `<p>[${(new Date()).toString()}] ${text.replace(/¥n/g,'<br>')}</p>`)
+			msg.insertAdjacentHTML('beforeend', `<p>[${(new Date()).toString()}] ${text.replace(/\n/g,'<br>')}</p>`)
 		}