From 74ecc4ec42ed836cbcec9a6c8888689a07f394f6 Mon Sep 17 00:00:00 2001
From: kakkokari-gtyih <67428053+kakkokari-gtyih@users.noreply.github.com>
Date: Thu, 22 Aug 2024 13:35:19 +0900
Subject: [PATCH] =?UTF-8?q?fix(frontend):=20=E4=BA=8C=E6=AE=B5=E9=9A=8E?=
 =?UTF-8?q?=E8=AA=8D=E8=A8=BC=E3=81=AE=E8=A8=AD=E5=AE=9A=E3=83=80=E3=82=A4?=
 =?UTF-8?q?=E3=82=A2=E3=83=AD=E3=82=B0=E3=81=AFbotWarn=E3=82=88=E3=82=8A?=
 =?UTF-8?q?=E3=82=82=E4=B8=8A=E3=81=AB=E8=A1=A8=E7=A4=BA=E3=81=99=E3=82=8B?=
 =?UTF-8?q?=E3=82=88=E3=81=86=E3=81=AB?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 packages/frontend/src/components/MkModal.vue          | 2 +-
 packages/frontend/src/components/MkModalWindow.vue    | 5 ++++-
 packages/frontend/src/os.ts                           | 8 +++++++-
 packages/frontend/src/pages/settings/2fa.qrdialog.vue | 1 +
 packages/frontend/src/ui/_common_/common.vue          | 6 ++++--
 5 files changed, 17 insertions(+), 5 deletions(-)

diff --git a/packages/frontend/src/components/MkModal.vue b/packages/frontend/src/components/MkModal.vue
index f8032f9b43..ea5b804265 100644
--- a/packages/frontend/src/components/MkModal.vue
+++ b/packages/frontend/src/components/MkModal.vue
@@ -68,7 +68,7 @@ const props = withDefaults(defineProps<{
 	anchor?: { x: string; y: string; };
 	src?: HTMLElement | null;
 	preferType?: ModalTypes | 'auto';
-	zPriority?: 'low' | 'middle' | 'high';
+	zPriority?: os.ZPriority;
 	noOverlap?: boolean;
 	transparentBg?: boolean;
 	hasInteractionWithOtherFocusTrappedEls?: boolean;
diff --git a/packages/frontend/src/components/MkModalWindow.vue b/packages/frontend/src/components/MkModalWindow.vue
index c3c7812036..0c4bac615d 100644
--- a/packages/frontend/src/components/MkModalWindow.vue
+++ b/packages/frontend/src/components/MkModalWindow.vue
@@ -4,7 +4,7 @@ SPDX-License-Identifier: AGPL-3.0-only
 -->
 
 <template>
-<MkModal ref="modal" :preferType="'dialog'" @click="onBgClick" @closed="emit('closed')" @esc="emit('esc')">
+<MkModal ref="modal" :preferType="'dialog'" :zPriority="zPriority" @click="onBgClick" @closed="emit('closed')" @esc="emit('esc')">
 	<div ref="rootEl" :class="$style.root" :style="{ width: `${width}px`, height: `min(${height}px, 100%)` }">
 		<div ref="headerEl" :class="$style.header">
 			<button v-if="withOkButton && withCloseButton" :class="$style.headerButton" class="_button" @click="emit('close')"><i class="ti ti-x"></i></button>
@@ -23,6 +23,7 @@ SPDX-License-Identifier: AGPL-3.0-only
 
 <script lang="ts" setup>
 import { onMounted, onUnmounted, shallowRef, ref } from 'vue';
+import type { ZPriority } from '@/os.js';
 import MkModal from './MkModal.vue';
 
 const props = withDefaults(defineProps<{
@@ -31,12 +32,14 @@ const props = withDefaults(defineProps<{
 	okButtonDisabled: boolean;
 	width: number;
 	height: number;
+	zPriority: ZPriority;
 }>(), {
 	withOkButton: false,
 	withCloseButton: true,
 	okButtonDisabled: false,
 	width: 400,
 	height: 500,
+	zPriority: 'low',
 });
 
 const emit = defineEmits<{
diff --git a/packages/frontend/src/os.ts b/packages/frontend/src/os.ts
index f42e2ed3c5..09f25fd232 100644
--- a/packages/frontend/src/os.ts
+++ b/packages/frontend/src/os.ts
@@ -144,8 +144,14 @@ const zIndexes = {
 	low: 1000000,
 	middle: 2000000,
 	high: 3000000,
+
+	/** botアカウントインジケータよりも上に表示させる必要があるもの専用 */
+	veryHigh: 4000000,
 };
-export function claimZIndex(priority: keyof typeof zIndexes = 'low'): number {
+
+export type ZPriority = keyof typeof zIndexes;
+
+export function claimZIndex(priority: ZPriority = 'low'): number {
 	zIndexes[priority] += 100;
 	return zIndexes[priority];
 }
diff --git a/packages/frontend/src/pages/settings/2fa.qrdialog.vue b/packages/frontend/src/pages/settings/2fa.qrdialog.vue
index 2244047b31..27ad2e9066 100644
--- a/packages/frontend/src/pages/settings/2fa.qrdialog.vue
+++ b/packages/frontend/src/pages/settings/2fa.qrdialog.vue
@@ -8,6 +8,7 @@ SPDX-License-Identifier: AGPL-3.0-only
 	ref="dialog"
 	:width="500"
 	:height="550"
+	:zPriority="'veryHigh'"
 	@close="cancel"
 	@closed="emit('closed')"
 >
diff --git a/packages/frontend/src/ui/_common_/common.vue b/packages/frontend/src/ui/_common_/common.vue
index d7df2d10f9..8bb29a87cf 100644
--- a/packages/frontend/src/ui/_common_/common.vue
+++ b/packages/frontend/src/ui/_common_/common.vue
@@ -41,7 +41,7 @@ SPDX-License-Identifier: AGPL-3.0-only
 
 <div v-if="dev" id="devTicker"><span>DEV BUILD</span></div>
 
-<div v-if="$i && $i.isBot" id="botWarn"><span>{{ i18n.ts.loggedInAsBot }}</span></div>
+<div v-if="$i && $i.isBot" id="botWarn" :style="{ zIndex: botWarnZIndex }"><span>{{ i18n.ts.loggedInAsBot }}</span></div>
 </template>
 
 <script lang="ts" setup>
@@ -53,6 +53,7 @@ import { popups } from '@/os.js';
 import { pendingApiRequestsCount } from '@/scripts/misskey-api.js';
 import { uploads } from '@/scripts/upload.js';
 import * as sound from '@/scripts/sound.js';
+import * as os from '@/os.js';
 import { $i } from '@/account.js';
 import { useStream } from '@/stream.js';
 import { i18n } from '@/i18n.js';
@@ -64,6 +65,8 @@ const XUpload = defineAsyncComponent(() => import('./upload.vue'));
 
 const dev = _DEV_;
 
+const botWarnZIndex = ref(os.claimZIndex('veryHigh'));
+
 const notifications = ref<Misskey.entities.Notification[]>([]);
 
 function onNotification(notification: Misskey.entities.Notification, isClient = false) {
@@ -251,7 +254,6 @@ if ($i) {
 	width: 100%;
 	height: max-content;
 	text-align: center;
-	z-index: 2147483647;
 	color: #ff0;
 	background: rgba(0, 0, 0, 0.5);
 	padding: 4px 7px;