From f7e0c8a4a932090ad23d7d54721effef56d1827a Mon Sep 17 00:00:00 2001
From: ThatOneCalculator <kainoa@t1c.dev>
Date: Sat, 23 Jul 2022 19:45:27 -0700
Subject: [PATCH] MkLoading instead of "Loading..."

---
 CALCKEY.md                                    |  3 ++-
 .../src/components/global/router-view.vue     | 20 ++++++++++++++++++-
 2 files changed, 21 insertions(+), 2 deletions(-)

diff --git a/CALCKEY.md b/CALCKEY.md
index b2acaa914..d1c30d30c 100644
--- a/CALCKEY.md
+++ b/CALCKEY.md
@@ -28,9 +28,10 @@
 - Mark as read from notifications widget
 - Better welcome screen (not logged in)
 - Ability to turn off "Connection lost" message
+- Spinner instead of "Loading..."
 - Annoying Orange search
 - MOTD
-- Reply limit bug fixed
+- Reply limit bug fixed (somewhat)
 - Custom assets
 - [OAuth bearer token authentication](https://github.com/misskey-dev/misskey/pull/9021)
 - [Styled Repair Tools](https://github.com/misskey-dev/misskey/pull/8956)
diff --git a/packages/client/src/components/global/router-view.vue b/packages/client/src/components/global/router-view.vue
index 1d841e050..d11656bc0 100644
--- a/packages/client/src/components/global/router-view.vue
+++ b/packages/client/src/components/global/router-view.vue
@@ -4,7 +4,9 @@
 		<component :is="currentPageComponent" :key="key" v-bind="Object.fromEntries(currentPageProps)"/>
 
 		<template #fallback>
-			Loading...
+			<div class="fetching">
+				<MkLoading/>
+			</div>
 		</template>
 	</Suspense>
 </KeepAlive>
@@ -59,3 +61,19 @@ onBeforeUnmount(() => {
 	router.removeListener('change', onChange);
 });
 </script>
+
+<style lang="scss" scoped>
+	.fetching {
+		position: absolute;
+		top: 0;
+		left: 0;
+		width: 100%;
+		height: 100%;
+		-webkit-backdrop-filter: var(--blur, blur(12px));
+		backdrop-filter: var(--blur, blur(12px));
+		display: flex;
+		justify-content: center;
+		align-items: center;
+		cursor: wait;
+	}
+</style>