From 7bcc254fd432d13d654bc299a10ab75c51908bde Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E3=81=82=E3=82=8F=E3=82=8F=E3=82=8F=E3=81=A8=E3=83=BC?=
 =?UTF-8?q?=E3=81=AB=E3=82=85?=
 <17376330+u1-liquid@users.noreply.github.com>
Date: Sat, 28 Dec 2024 14:56:37 +0900
Subject: [PATCH] =?UTF-8?q?fix(frontend):=20=E6=94=AF=E6=8F=B4=E3=83=A1?=
 =?UTF-8?q?=E3=83=8B=E3=83=A5=E3=83=BC=E3=81=8C=E3=83=87=E3=83=83=E3=82=AD?=
 =?UTF-8?q?UI=E3=81=A7=E6=AD=A3=E5=B8=B8=E3=81=AB=E5=8B=95=E4=BD=9C?=
 =?UTF-8?q?=E3=81=97=E3=81=AA=E3=81=84=E5=95=8F=E9=A1=8C=E3=82=92=E4=BF=AE?=
 =?UTF-8?q?=E6=AD=A3=20(MisskeyIO#861)?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

+ kawaiiモードのメニュー追加

MSKY-1
---
 .../src/components/MkVisitorDashboard.vue         |  3 ++-
 packages/frontend/src/navbar.ts                   | 15 ++++++++++++++-
 packages/frontend/src/pages/about-misskey.vue     |  6 ++++--
 packages/frontend/src/pages/about.vue             |  5 +++--
 packages/frontend/src/ui/_common_/navbar.vue      |  3 ++-
 5 files changed, 25 insertions(+), 7 deletions(-)

diff --git a/packages/frontend/src/components/MkVisitorDashboard.vue b/packages/frontend/src/components/MkVisitorDashboard.vue
index 6a19f8abc..1bf53fc80 100644
--- a/packages/frontend/src/components/MkVisitorDashboard.vue
+++ b/packages/frontend/src/components/MkVisitorDashboard.vue
@@ -6,7 +6,7 @@ SPDX-License-Identifier: AGPL-3.0-only
 <template>
 <div v-if="instance" :class="$style.root">
 	<div :class="[$style.main, $style.panel]">
-		<img v-if="miLocalStorage.getItem('kawaii')" src="/client-assets/kawaii/misskey-io.png" alt="Logo by @sawaratsuki@misskey.io" :class="$style.mainIconAlt"/>
+		<img v-if="kawaiiMode" src="/client-assets/kawaii/misskey-io.png" alt="Logo by @sawaratsuki@misskey.io" :class="$style.mainIconAlt"/>
 		<img v-else :src="instance.iconUrl || '/favicon.ico'" alt="" :class="$style.mainIcon"/>
 		<button class="_button _acrylic" :class="$style.mainMenu" @click="showMenu"><i class="ti ti-dots"></i></button>
 		<div :class="$style.mainFg">
@@ -87,6 +87,7 @@ import MkNumber from '@/components/MkNumber.vue';
 import XActiveUsersChart from '@/components/MkVisitorDashboard.ActiveUsersChart.vue';
 import { openInstanceMenu } from '@/ui/_common_/common';
 
+const kawaiiMode = miLocalStorage.getItem('kawaii') === 'true';
 const stats = ref<Misskey.entities.StatsResponse | null>(null);
 
 misskeyApiGet('stats').then((res) => {
diff --git a/packages/frontend/src/navbar.ts b/packages/frontend/src/navbar.ts
index 4ff494a9d..1c30ea13e 100644
--- a/packages/frontend/src/navbar.ts
+++ b/packages/frontend/src/navbar.ts
@@ -15,6 +15,8 @@ import { ui, host } from '@/config.js';
 import { unisonReload } from '@/scripts/unison-reload.js';
 import { instance } from '@/instance.js';
 
+const kawaiiMode = miLocalStorage.getItem('kawaii') === 'true';
+
 export const navbarItemDef = reactive({
 	notifications: {
 		title: i18n.ts.notifications,
@@ -178,10 +180,21 @@ export const navbarItemDef = reactive({
 		show: computed(() => $i != null),
 		to: `/@${$i?.username}`,
 	},
+	kawaii: {
+		title: kawaiiMode ? 'no uwu plz' : 'uwu?',
+		icon: kawaiiMode ? 'ti ti-mood-smile' : 'ti ti-mood-wink',
+		action: (ev) => {
+			if (kawaiiMode) miLocalStorage.removeItem('kawaii');
+			else miLocalStorage.setItem('kawaii', 'true');
+			location.reload();
+		},
+	},
 	support: {
 		title: i18n.tsx.supportThisInstance({ name: instance.name ?? host }),
 		icon: 'ti ti-pig-money',
-		to: 'https://go.misskey.io/donate',
+		action: (ev) => {
+			window.open('https://go.misskey.io/donate', '_blank', 'noopener');
+		},
 	},
 	cacheClear: {
 		title: i18n.ts.clearCache,
diff --git a/packages/frontend/src/pages/about-misskey.vue b/packages/frontend/src/pages/about-misskey.vue
index 66b4079f9..e913814b0 100644
--- a/packages/frontend/src/pages/about-misskey.vue
+++ b/packages/frontend/src/pages/about-misskey.vue
@@ -11,9 +11,9 @@ SPDX-License-Identifier: AGPL-3.0-only
 			<div class="_gaps_m znqjceqz">
 				<div v-panel class="about">
 					<div ref="containerEl" class="container" :class="{ playing: easterEggEngine != null }">
-						<img v-if="miLocalStorage.getItem('kawaii')" src="/client-assets/kawaii/about-icon.png" alt="" class="iconAlt" draggable="false" @load="iconLoaded" @click="gravity"/>
+						<img v-if="kawaiiMode" src="/client-assets/kawaii/about-icon.png" alt="" class="iconAlt" draggable="false" @load="iconLoaded" @click="gravity"/>
 						<img v-else src="/client-assets/about-icon.png" alt="" class="icon" draggable="false" @load="iconLoaded" @click="gravity"/>
-						<Mfm v-if="miLocalStorage.getItem('kawaii')" text="Logo by @sawaratsuki@misskey.io" class="iconCredit"/>
+						<Mfm v-if="kawaiiMode" text="Logo by @sawaratsuki@misskey.io" class="iconCredit"/>
 						<div class="misskey">Misskey</div>
 						<div class="version">v{{ version }}</div>
 						<span v-for="emoji in easterEggEmojis" :key="emoji.id" class="emoji" :data-physics-x="emoji.left" :data-physics-y="emoji.top" :class="{ _physics_circle_: !emoji.emoji.startsWith(':') }">
@@ -145,6 +145,8 @@ import { definePageMetadata } from '@/scripts/page-metadata.js';
 import { claimAchievement, claimedAchievements } from '@/scripts/achievements.js';
 import { $i } from '@/account.js';
 
+const kawaiiMode = miLocalStorage.getItem('kawaii') === 'true';
+
 const patronsWithIcon = [{
 	name: 'カイヤン',
 	icon: 'https://assets.misskey-hub.net/patrons/a2820716883e408cb87773e377ce7c8d.jpg',
diff --git a/packages/frontend/src/pages/about.vue b/packages/frontend/src/pages/about.vue
index 95dec1e5e..32c826b5c 100644
--- a/packages/frontend/src/pages/about.vue
+++ b/packages/frontend/src/pages/about.vue
@@ -11,9 +11,9 @@ SPDX-License-Identifier: AGPL-3.0-only
 			<div class="_gaps_m">
 				<div :class="$style.banner" :style="{ backgroundImage: `url(${ instance.bannerUrl })` }">
 					<div style="overflow: clip;">
-						<img v-if="miLocalStorage.getItem('kawaii')" src="/client-assets/kawaii/misskey-io.png" alt="" :class="$style.bannerIconAlt"/>
+						<img v-if="kawaiiMode" src="/client-assets/kawaii/misskey-io.png" alt="" :class="$style.bannerIconAlt"/>
 						<img v-else :src="instance.iconUrl ?? instance.faviconUrl ?? '/favicon.ico'" alt="" :class="$style.bannerIcon"/>
-						<Mfm v-if="miLocalStorage.getItem('kawaii')" text="Logo by @sawaratsuki@misskey.io" :class="$style.iconCredit"/>
+						<Mfm v-if="kawaiiMode" text="Logo by @sawaratsuki@misskey.io" :class="$style.iconCredit"/>
 						<div :class="$style.bannerName">
 							<b>{{ instance.name ?? host }}</b>
 						</div>
@@ -178,6 +178,7 @@ const props = withDefaults(defineProps<{
 	initialTab: 'overview',
 });
 
+const kawaiiMode = miLocalStorage.getItem('kawaii') === 'true';
 const stats = ref<Misskey.entities.StatsResponse | null>(null);
 const tab = ref(props.initialTab);
 
diff --git a/packages/frontend/src/ui/_common_/navbar.vue b/packages/frontend/src/ui/_common_/navbar.vue
index 352199c10..4c3b80d7b 100644
--- a/packages/frontend/src/ui/_common_/navbar.vue
+++ b/packages/frontend/src/ui/_common_/navbar.vue
@@ -9,7 +9,7 @@ SPDX-License-Identifier: AGPL-3.0-only
 		<div :class="$style.top">
 			<div :class="$style.banner" :style="{ backgroundImage: `url(${ instance.bannerUrl })` }"></div>
 			<button v-tooltip.noDelay.right="instance.name ?? i18n.ts.instance" class="_button" :class="$style.instance" @click="openInstanceMenu">
-				<img v-if="miLocalStorage.getItem('kawaii')" src="/client-assets/kawaii/misskey-io.png" alt="" :class="$style.instanceIconAlt"/>
+				<img v-if="kawaiiMode" src="/client-assets/kawaii/misskey-io.png" alt="" :class="$style.instanceIconAlt"/>
 				<img v-else :src="instance.iconUrl || instance.faviconUrl || '/favicon.ico'" alt="" :class="$style.instanceIcon"/>
 			</button>
 		</div>
@@ -72,6 +72,7 @@ import { instance } from '@/instance.js';
 import { miLocalStorage } from '@/local-storage.js';
 
 const iconOnly = ref(false);
+const kawaiiMode = miLocalStorage.getItem('kawaii') === 'true';
 
 const menu = computed(() => defaultStore.state.menu);
 const otherMenuItemIndicated = computed(() => {