From 5623960efaec32882d2ef1b309f7dd01e1cf5bc9 Mon Sep 17 00:00:00 2001
From: mattyatea <mattyacocacora0@gmail.com>
Date: Thu, 14 Dec 2023 21:06:50 +0900
Subject: [PATCH] bug fix

---
 locales/index.d.ts                            |  20 +--
 packages/frontend/src/account.ts              |   2 +-
 packages/frontend/src/components/MkButton.vue | 143 +++++++++++++++++-
 .../src/components/MkEmojiEditDialog.vue      |  10 +-
 .../src/components/MkEmojiPicker.section.vue  |   1 +
 .../frontend/src/components/MkEmojiPicker.vue |   2 +-
 .../frontend/src/components/MkNoteSimple.vue  |   1 -
 .../src/components/MkNotifyButton.vue         |   8 +-
 .../frontend/src/components/MkPostForm.vue    |   8 +-
 .../src/components/global/MkEmojiKitchen.vue  |   4 +-
 packages/frontend/src/pages/about.emojis.vue  |   6 +-
 packages/frontend/src/pages/about.vue         |   2 +-
 packages/frontend/src/pages/admin/index.vue   |   2 +-
 .../src/pages/admin/other-settings.vue        |  18 +--
 packages/frontend/src/pages/timeline.vue      |   4 +-
 .../src/ui/_common_/stream-indicator.vue      |   1 -
 16 files changed, 183 insertions(+), 49 deletions(-)

diff --git a/locales/index.d.ts b/locales/index.d.ts
index bb797ed710..8b8f1feb96 100644
--- a/locales/index.d.ts
+++ b/locales/index.d.ts
@@ -2563,6 +2563,16 @@ export interface Locale {
             };
         };
     };
+    "_schedulePost": {
+        "list": string;
+        "postDate": string;
+        "postTime": string;
+        "localTime": string;
+        "addSchedule": string;
+        "willBePostedAtX": string;
+        "deleteAreYouSure": string;
+        "deleteAndEditConfirm": string;
+    };
     "_dataSaver": {
         "_media": {
             "title": string;
@@ -2581,16 +2591,6 @@ export interface Locale {
             "description": string;
         };
     };
-    "_schedulePost": {
-        "list": string;
-        "postDate": string;
-        "postTime": string;
-        "localTime": string;
-        "addSchedule": string;
-        "willBePostedAtX": string;
-        "deleteAreYouSure": string;
-        "deleteAndEditConfirm": string;
-    };
 }
 declare const locales: {
     [lang: string]: Locale;
diff --git a/packages/frontend/src/account.ts b/packages/frontend/src/account.ts
index 0e4e4b50ff..a6af298024 100644
--- a/packages/frontend/src/account.ts
+++ b/packages/frontend/src/account.ts
@@ -284,7 +284,7 @@ export async function openAccountMenu(opts: {
 			text: i18n.ts.profile,
 			to: `/@${ $i.username }`,
 			avatar: $i,
-		}, null, ...(opts.includeCurrentAccount ? [createItem($i)] : []), ...accountItemPromises, {
+		}, { type: 'divider' }, ...(opts.includeCurrentAccount ? [createItem($i)] : []), ...accountItemPromises, {
 			type: 'parent' as const,
 			icon: 'ti ti-plus',
 			text: i18n.ts.addAccount,
diff --git a/packages/frontend/src/components/MkButton.vue b/packages/frontend/src/components/MkButton.vue
index 9197b4f38d..b5a14a2a39 100644
--- a/packages/frontend/src/components/MkButton.vue
+++ b/packages/frontend/src/components/MkButton.vue
@@ -65,7 +65,8 @@ SPDX-License-Identifier: AGPL-3.0-only
 </template>
 
 <script lang="ts" setup>
-import { nextTick, onMounted, shallowRef } from 'vue';
+import { nextTick, onMounted, shallowRef, computed, ref, watch } from 'vue';
+import {defaultStore} from "@/store.js";
 
 const props = defineProps<{
   type?: 'button' | 'submit' | 'reset';
@@ -92,8 +93,8 @@ const darkMode = computed(defaultStore.makeGetterSetter('darkMode'));
 const gamingMode = computed(defaultStore.makeGetterSetter('gamingMode'));
 // gamingをrefで初期化する
 let gaming = ref(''); // 0-off , 1-dark , 2-light
-
 // gaming.valueに新しい値を代入する
+
 if (darkMode.value && gamingMode.value && props.primary || darkMode.value && gamingMode.value && props.gradate ) {
   gaming.value = 'dark';
 } else if (!darkMode.value && gamingMode.value && props.primary || darkMode.value && gamingMode.value && props.gradate ) {
@@ -113,7 +114,7 @@ watch(darkMode, () => {
 })
 
 watch(gamingMode, () => {
-  if (darkMode.value && gamingMode.value && props.primary|| darkMode.value && gamingMode.value && props.gradate ) {
+  if (darkMode.value && gamingMode.value && props.primary || darkMode.value && gamingMode.value && props.gradate ) {
     gaming.value = 'dark';
   } else if (!darkMode.value && gamingMode.value && props.primary || darkMode.value && gamingMode.value && props.gradate ) {
     gaming.value = 'light';
@@ -121,7 +122,6 @@ watch(gamingMode, () => {
     gaming.value = '';
   }
 })
-
 const emit = defineEmits<{
   (ev: 'click', payload: MouseEvent): void;
 }>();
@@ -228,7 +228,59 @@ function onMousedown(evt: MouseEvent): void {
 		font-weight: bold;
 		color: var(--fgOnAccent) !important;
 		background: var(--accent);
+      &.gamingLight {
+        background: linear-gradient(270deg, #c06161, #c0a567, #b6ba69, #81bc72, #63c3be, #8bacd6, #9f8bd6, #d18bd6, #d883b4);
+        background-size: 1800% 1800%;
+        color: white !important;
+        -webkit-animation: AnimationLight var(--gamingspeed) cubic-bezier(0, 0.2, 0.90, 1)  infinite;
+        -moz-animation: AnimationLight var(--gamingspeed) cubic-bezier(0, 0.2, 0.90, 1)  infinite;
+        animation: AnimationLight var(--gamingspeed) cubic-bezier(0, 0.2, 0.90, 1)  infinite;
 
+        &:not(:disabled):hover {
+          background: linear-gradient(270deg, #c06161, #c0a567, #b6ba69, #81bc72, #63c3be, #8bacd6, #9f8bd6, #d18bd6, #d883b4);
+          background-size: 1800% 1800%;
+          color: white !important;
+          -webkit-animation: AnimationLight var(--gamingspeed) cubic-bezier(0, 0.2, 0.90, 1)  infinite;
+          -moz-animation: AnimationLight var(--gamingspeed) cubic-bezier(0, 0.2, 0.90, 1)  infinite;
+          animation: AnimationLight var(--gamingspeed) cubic-bezier(0, 0.2, 0.90, 1)  infinite;
+        }
+
+        &:not(:disabled):active {
+          background: linear-gradient(270deg, #c06161, #c0a567, #b6ba69, #81bc72, #63c3be, #8bacd6, #9f8bd6, #d18bd6, #d883b4);
+          background-size: 1800% 1800% !important;
+          color: white !important;
+          -webkit-animation: AnimationLight var(--gamingspeed) cubic-bezier(0, 0.2, 0.90, 1)  infinite;
+          -moz-animation: AnimationLight var(--gamingspeed) cubic-bezier(0, 0.2, 0.90, 1)  infinite ;
+          animation: AnimationLight var(--gamingspeed) cubic-bezier(0, 0.2, 0.90, 1)  infinite ;
+        }
+      }
+
+      &.gamingDark {
+        background: linear-gradient(270deg, #e7a2a2, #e3cfa2, #ebefa1, #b3e7a6, #a6ebe7, #aec5e3, #cabded, #e0b9e3, #f4bddd);
+        background-size: 1800% 1800%;
+        color: black;
+        -webkit-animation: AnimationDark var(--gamingspeed) cubic-bezier(0, 0.45, 0.30, 1) infinite;
+        -moz-animation: AnimationDark var(--gamingspeed) cubic-bezier(0, 0.45, 0.30, 1) infinite;
+        animation: AnimationDark var(--gamingspeed) cubic-bezier(0, 0.45, 0.30, 1) infinite;
+
+        &:not(:disabled):hover {
+          background: linear-gradient(270deg, #e7a2a2, #e3cfa2, #ebefa1, #b3e7a6, #a6ebe7, #aec5e3, #cabded, #e0b9e3, #f4bddd);
+          background-size: 1800% 1800% ;
+          color: black;
+          -webkit-animation: AnimationDark var(--gamingspeed) cubic-bezier(0, 0.45, 0.30, 1) infinite ;
+          -moz-animation: AnimationDark var(--gamingspeed) cubic-bezier(0, 0.45, 0.30, 1) infinite;
+          animation: AnimationDark var(--gamingspeed) cubic-bezier(0, 0.45, 0.30, 1) infinite ;
+        }
+
+        &:not(:disabled):active {
+          background: linear-gradient(270deg, #e7a2a2, #e3cfa2, #ebefa1, #b3e7a6, #a6ebe7, #aec5e3, #cabded, #e0b9e3, #f4bddd);
+          background-size: 1800% 1800% !important;
+          color: black;
+          -webkit-animation: AnimationDark var(--gamingspeed) cubic-bezier(0, 0.45, 0.30, 1) infinite ;
+          -moz-animation: AnimationDark var(--gamingspeed) cubic-bezier(0, 0.45, 0.30, 1) infinite;
+          animation: AnimationDark var(--gamingspeed) cubic-bezier(0, 0.45, 0.30, 1) infinite;
+        }
+      }
 		&:not(:disabled):hover {
 			background: var(--X8);
 		}
@@ -285,6 +337,59 @@ function onMousedown(evt: MouseEvent): void {
 		&:not(:disabled):active {
 			background: linear-gradient(90deg, var(--X8), var(--X8));
 		}
+      &.gamingLight {
+        background: linear-gradient(270deg, #c06161, #c0a567, #b6ba69, #81bc72, #63c3be, #8bacd6, #9f8bd6, #d18bd6, #d883b4);
+        background-size: 1800% 1800%;
+        color: white !important;
+        -webkit-animation: AnimationLight var(--gamingspeed) cubic-bezier(0, 0.2, 0.90, 1)  infinite;
+        -moz-animation: AnimationLight var(--gamingspeed) cubic-bezier(0, 0.2, 0.90, 1)  infinite;
+        animation: AnimationLight var(--gamingspeed) cubic-bezier(0, 0.2, 0.90, 1)  infinite;
+
+        &:not(:disabled):hover {
+          background: linear-gradient(270deg, #c06161, #c0a567, #b6ba69, #81bc72, #63c3be, #8bacd6, #9f8bd6, #d18bd6, #d883b4);
+          background-size: 1800% 1800%;
+          color: white !important;
+          -webkit-animation: AnimationLight var(--gamingspeed) cubic-bezier(0, 0.2, 0.90, 1)  infinite;
+          -moz-animation: AnimationLight var(--gamingspeed) cubic-bezier(0, 0.2, 0.90, 1)  infinite;
+          animation: AnimationLight var(--gamingspeed) cubic-bezier(0, 0.2, 0.90, 1)  infinite;
+        }
+
+        &:not(:disabled):active {
+          background: linear-gradient(270deg, #c06161, #c0a567, #b6ba69, #81bc72, #63c3be, #8bacd6, #9f8bd6, #d18bd6, #d883b4);
+          background-size: 1800% 1800% !important;
+          color: white !important;
+          -webkit-animation: AnimationLight var(--gamingspeed) cubic-bezier(0, 0.2, 0.90, 1)  infinite;
+          -moz-animation: AnimationLight var(--gamingspeed) cubic-bezier(0, 0.2, 0.90, 1)  infinite ;
+          animation: AnimationLight var(--gamingspeed) cubic-bezier(0, 0.2, 0.90, 1)  infinite ;
+        }
+      }
+
+      &.gamingDark {
+        background: linear-gradient(270deg, #e7a2a2, #e3cfa2, #ebefa1, #b3e7a6, #a6ebe7, #aec5e3, #cabded, #e0b9e3, #f4bddd);
+        background-size: 1800% 1800%;
+        color: black;
+        -webkit-animation: AnimationDark var(--gamingspeed) cubic-bezier(0, 0.45, 0.30, 1) infinite;
+        -moz-animation: AnimationDark var(--gamingspeed) cubic-bezier(0, 0.45, 0.30, 1) infinite;
+        animation: AnimationDark var(--gamingspeed) cubic-bezier(0, 0.45, 0.30, 1) infinite;
+
+        &:not(:disabled):hover {
+          background: linear-gradient(270deg, #e7a2a2, #e3cfa2, #ebefa1, #b3e7a6, #a6ebe7, #aec5e3, #cabded, #e0b9e3, #f4bddd);
+          background-size: 1800% 1800% ;
+          color: black;
+          -webkit-animation: AnimationDark var(--gamingspeed) cubic-bezier(0, 0.45, 0.30, 1) infinite ;
+          -moz-animation: AnimationDark var(--gamingspeed) cubic-bezier(0, 0.45, 0.30, 1) infinite;
+          animation: AnimationDark var(--gamingspeed) cubic-bezier(0, 0.45, 0.30, 1) infinite ;
+        }
+
+        &:not(:disabled):active {
+          background: linear-gradient(270deg, #e7a2a2, #e3cfa2, #ebefa1, #b3e7a6, #a6ebe7, #aec5e3, #cabded, #e0b9e3, #f4bddd);
+          background-size: 1800% 1800% !important;
+          color: black;
+          -webkit-animation: AnimationDark var(--gamingspeed) cubic-bezier(0, 0.45, 0.30, 1) infinite ;
+          -moz-animation: AnimationDark var(--gamingspeed) cubic-bezier(0, 0.45, 0.30, 1) infinite;
+          animation: AnimationDark var(--gamingspeed) cubic-bezier(0, 0.45, 0.30, 1) infinite;
+        }
+      }
 	}
 
 	&.danger {
@@ -352,4 +457,34 @@ function onMousedown(evt: MouseEvent): void {
 	z-index: 1;
 	pointer-events: none;
 }
+@-webkit-keyframes AnimationLight {
+  0%{background-position:0% 50%}
+  50%{background-position:100% 50%}
+  100%{background-position:0% 50%}
+}
+@-moz-keyframes AnimationLight {
+  0%{background-position:0% 50%}
+  50%{background-position:100% 50%}
+  100%{background-position:0% 50%}
+}
+@keyframes AnimationLight {
+  0%{background-position:0% 50%}
+  50%{background-position:100% 50%}
+  100%{background-position:0% 50%}
+}
+@-webkit-keyframes AnimationDark {
+  0%{background-position:0% 50%}
+  50%{background-position:100% 50%}
+  100%{background-position:0% 50%}
+}
+@-moz-keyframes AnimationDark {
+  0%{background-position:0% 50%}
+  50%{background-position:100% 50%}
+  100%{background-position:0% 50%}
+}
+@keyframes AnimationDark {
+  0%{background-position:0% 50%}
+  50%{background-position:100% 50%}
+  100%{background-position:0% 50%}
+}
 </style>
diff --git a/packages/frontend/src/components/MkEmojiEditDialog.vue b/packages/frontend/src/components/MkEmojiEditDialog.vue
index 1a0f670dc7..4413ef3650 100644
--- a/packages/frontend/src/components/MkEmojiEditDialog.vue
+++ b/packages/frontend/src/components/MkEmojiEditDialog.vue
@@ -148,11 +148,11 @@ function ok() {
 async function add() {
 	const ret = await os.api('admin/emoji/add-draft', {
 		name: name,
-		category: category,
+		category: category.value,
 		aliases: aliases.value.split(' '),
 		license: license.value === '' ? null : license.value,
 		fileId: chooseFile.value.id,
-		isNotifyIsHome: isNotifyIsHome,
+		isNotifyIsHome: isNotifyIsHome.value,
 	});
 
 	emit('done', {
@@ -199,7 +199,7 @@ async function update() {
         aliases: aliases.value.split(' ').filter(x => x !== ''),
         license: license.value === '' ? null : license.value,
 		fileId: chooseFile.value?.id,
-		draft: draft,
+		draft: draft.value,
 	});
 
 	emit('done', {
@@ -222,10 +222,10 @@ async function done() {
 		aliases: aliases.value.split(' ').filter(x => x !== ''),
 		license: license.value === '' ? null : license.value,
 		isSensitive: isSensitive.value,
-        draft: draft,
+        draft: draft.value,
 		localOnly: localOnly.value,
 		roleIdsThatCanBeUsedThisEmojiAsReaction: rolesThatCanBeUsedThisEmojiAsReaction.value.map(x => x.id),
-        isNotifyIsHome,
+        isNotifyIsHome: isNotifyIsHome.value,
     };
 
 	if (file.value) {
diff --git a/packages/frontend/src/components/MkEmojiPicker.section.vue b/packages/frontend/src/components/MkEmojiPicker.section.vue
index 1295f5782c..1459f24a13 100644
--- a/packages/frontend/src/components/MkEmojiPicker.section.vue
+++ b/packages/frontend/src/components/MkEmojiPicker.section.vue
@@ -51,6 +51,7 @@ SPDX-License-Identifier: AGPL-3.0-only
 			@pointerenter="computeButtonTitle"
 			@click="emit('chosen', emoji, $event)"
 		>
+            jhkjh
 			<MkCustomEmoji v-if="emoji[0] === ':'" class="emoji" :name="emoji" :normal="true"/>
 			<MkEmoji v-else class="emoji" :emoji="emoji" :normal="true"/>
 		</button>
diff --git a/packages/frontend/src/components/MkEmojiPicker.vue b/packages/frontend/src/components/MkEmojiPicker.vue
index d0791e5554..7723b530fb 100644
--- a/packages/frontend/src/components/MkEmojiPicker.vue
+++ b/packages/frontend/src/components/MkEmojiPicker.vue
@@ -327,7 +327,7 @@ watch(q, () => {
 	searchResultUnicode.value = Array.from(searchUnicode());
 });
 
-function filterAvailable(emoji: Misskey.entities.EmojiSimple): boolean {
+function filterAvailable(emoji: Misskey.entities.EmojiSimple): null | boolean {
 	return (emoji.roleIdsThatCanBeUsedThisEmojiAsReaction == null || emoji.roleIdsThatCanBeUsedThisEmojiAsReaction.length === 0) || ($i && $i.roles.some(r => emoji.roleIdsThatCanBeUsedThisEmojiAsReaction.includes(r.id)));
 }
 
diff --git a/packages/frontend/src/components/MkNoteSimple.vue b/packages/frontend/src/components/MkNoteSimple.vue
index c17bd05e35..c26fcea911 100644
--- a/packages/frontend/src/components/MkNoteSimple.vue
+++ b/packages/frontend/src/components/MkNoteSimple.vue
@@ -28,7 +28,6 @@ SPDX-License-Identifier: AGPL-3.0-only
 <script lang="ts" setup>
 import { ref } from 'vue';
 import * as Misskey from 'misskey-js';
-import { ref } from 'vue';
 import { i18n } from '../i18n.js';
 import MkNoteHeader from '@/components/MkNoteHeader.vue';
 import MkSubNoteContent from '@/components/MkSubNoteContent.vue';
diff --git a/packages/frontend/src/components/MkNotifyButton.vue b/packages/frontend/src/components/MkNotifyButton.vue
index b25d79ee6b..fd9767846e 100644
--- a/packages/frontend/src/components/MkNotifyButton.vue
+++ b/packages/frontend/src/components/MkNotifyButton.vue
@@ -62,8 +62,8 @@ const props = withDefaults(defineProps<{
   large: false,
 });
 
-let isFollowing = $ref(props.user.isFollowing);
-let notify = $ref(props.user.notify);
+let isFollowing = ref(props.user.isFollowing);
+let notify = ref(props.user.notify);
 const connection = useStream().useChannel('main');
 
 if (props.user.isFollowing == null) {
@@ -80,12 +80,12 @@ if (props.user.notify == null) {
 
 function onFollowChange(user: Misskey.entities.UserDetailed) {
   if (user.id === props.user.id) {
-    isFollowing = user.isFollowing;
+    isFollowing.value = user.isFollowing;
   }
 }
 function onNotifyChange(user: Misskey.entities.UserDetailed) {
   if (user.id === props.user.id) {
-    notify = user.notify;
+    notify.value = user.notify;
     console.log(props.user.notify)
   }
 }
diff --git a/packages/frontend/src/components/MkPostForm.vue b/packages/frontend/src/components/MkPostForm.vue
index 7cf1e34445..5acb424dc1 100644
--- a/packages/frontend/src/components/MkPostForm.vue
+++ b/packages/frontend/src/components/MkPostForm.vue
@@ -99,7 +99,7 @@ SPDX-License-Identifier: AGPL-3.0-only
 </template>
 
 <script lang="ts" setup>
-import { inject, watch, nextTick, onMounted, defineAsyncComponent , computed, ref , provide, shallowRef, ref, computed } from 'vue';
+import { inject, watch, nextTick, onMounted, defineAsyncComponent , provide, shallowRef, ref, computed } from 'vue';
 import * as mfm from 'mfm-js';
 import * as Misskey from 'misskey-js';
 import insertTextAtCursor from 'insert-text-at-cursor';
@@ -891,10 +891,10 @@ async function insertEmoji(ev: MouseEvent) {
 	);
 }
 function insertMfm(){
-  insertTextAtCursor(textareaEl, '$');
+  insertTextAtCursor(textareaEl.value, '$');
 }
 function insertRuby() {
-    insertTextAtCursor(textareaEl, '$[ruby 本文 上につくやつ]');
+    insertTextAtCursor(textareaEl.value, '$[ruby 本文 上につくやつ]');
 }
 function showActions(ev) {
   os.popupMenu(postFormActions.map(action => ({
@@ -953,7 +953,7 @@ function openOtherSettingsMenu(ev: MouseEvent) {
 		icon: 'ti ti-calendar-time',
 		indicate: (schedule != null),
 		action: toggleSchedule,
-	} : undefined, ...(($i.policies?.canScheduleNote) ? [null, {
+	} : undefined, ...(($i.policies?.canScheduleNote) ? [{ type: 'divider' }, {
 		type: 'button',
 		text: i18n.ts._schedulePost.list,
 		icon: 'ti ti-calendar-event',
diff --git a/packages/frontend/src/components/global/MkEmojiKitchen.vue b/packages/frontend/src/components/global/MkEmojiKitchen.vue
index 1ce71b36b2..a507a5a509 100644
--- a/packages/frontend/src/components/global/MkEmojiKitchen.vue
+++ b/packages/frontend/src/components/global/MkEmojiKitchen.vue
@@ -4,7 +4,7 @@
 </template>
 
 <script lang="ts" setup>
-import { computed } from 'vue';
+import {computed, ref} from 'vue';
 
 const props = defineProps<{
 	name: string;
@@ -17,7 +17,7 @@ const rawUrl = computed(() => props.url);
 const url = computed(() => rawUrl.value);
 
 const alt = computed(() => props.name);
-let errored = $ref(url.value == null);
+let errored = ref(url.value == null);
 </script>
 
 <style lang="scss" module>
diff --git a/packages/frontend/src/pages/about.emojis.vue b/packages/frontend/src/pages/about.emojis.vue
index a79be897cf..e22c4423cb 100644
--- a/packages/frontend/src/pages/about.emojis.vue
+++ b/packages/frontend/src/pages/about.emojis.vue
@@ -67,14 +67,14 @@ import XEmoji from './emojis.emoji.vue';
 import MkButton from '@/components/MkButton.vue';
 import MkInput from '@/components/MkInput.vue';
 import MkFoldableSection from '@/components/MkFoldableSection.vue';
-import { customEmojis, customEmojiCategories } from '@/custom-emojis.js';
+import {customEmojis, customEmojiCategories, getCustomEmojiTags} from '@/custom-emojis.js';
 import { i18n } from '@/i18n.js';
 import * as os from '@/os';
 import { $i } from '@/account.js';
 import { definePageMetadata } from '@/scripts/page-metadata';
 
-let tab = $ref('emojis');
-const headerActions = $computed(() => []);
+let tab = ref('emojis');
+const headerActions = computed(() => []);
 
 const customEmojiTags = getCustomEmojiTags();
 const q = ref('');
diff --git a/packages/frontend/src/pages/about.vue b/packages/frontend/src/pages/about.vue
index ab4ce20cbc..985a75377e 100644
--- a/packages/frontend/src/pages/about.vue
+++ b/packages/frontend/src/pages/about.vue
@@ -102,7 +102,7 @@ SPDX-License-Identifier: AGPL-3.0-only
 </template>
 
 <script lang="ts" setup>
-import {computed, ref, watch, ref } from 'vue';
+import {computed, ref, watch } from 'vue';
 import XEmojis from './about.emojis.vue';
 import XFederation from './about.federation.vue';
 import { version, host } from '@/config.js';
diff --git a/packages/frontend/src/pages/admin/index.vue b/packages/frontend/src/pages/admin/index.vue
index b4b422e798..d25561af79 100644
--- a/packages/frontend/src/pages/admin/index.vue
+++ b/packages/frontend/src/pages/admin/index.vue
@@ -28,7 +28,7 @@ SPDX-License-Identifier: AGPL-3.0-only
 </template>
 
 <script lang="ts" setup>
-import {computed, onActivated, onMounted, onUnmounted, provide, ref, watch, ref, computed } from 'vue';
+import {computed, onActivated, onMounted, onUnmounted, provide, ref, watch } from 'vue';
 import { i18n } from '@/i18n.js';
 import MkSuperMenu from '@/components/MkSuperMenu.vue';
 import MkInfo from '@/components/MkInfo.vue';
diff --git a/packages/frontend/src/pages/admin/other-settings.vue b/packages/frontend/src/pages/admin/other-settings.vue
index 8afb4b5e7b..b94d2b3737 100644
--- a/packages/frontend/src/pages/admin/other-settings.vue
+++ b/packages/frontend/src/pages/admin/other-settings.vue
@@ -69,18 +69,18 @@ const enableServerMachineStats = ref<boolean>(false);
 const enableIdenticonGeneration = ref<boolean>(false);
 const enableChartsForRemoteUser = ref<boolean>(false);
 const enableChartsForFederatedInstances = ref<boolean>(false);
-let DiscordWebhookUrl: string | null = $ref(null);
-let EmojiBotToken: string | null = $ref(null);
-let ApiBase:string | null = $ref(null)
+let DiscordWebhookUrl = ref(null);
+let EmojiBotToken= ref(null);
+let ApiBase= ref(null)
 async function init() {
 	const meta = await os.api('admin/meta');
 	enableServerMachineStats.value = meta.enableServerMachineStats;
 	enableIdenticonGeneration.value = meta.enableIdenticonGeneration;
 	enableChartsForRemoteUser.value = meta.enableChartsForRemoteUser;
 	enableChartsForFederatedInstances.value = meta.enableChartsForFederatedInstances;
-    DiscordWebhookUrl = meta.DiscordWebhookUrl;
-    EmojiBotToken = meta.EmojiBotToken;
-    ApiBase = meta.ApiBase;
+    DiscordWebhookUrl.value = meta.DiscordWebhookUrl;
+    EmojiBotToken.value = meta.EmojiBotToken;
+    ApiBase.value = meta.ApiBase;
 }
 
 function save() {
@@ -89,9 +89,9 @@ function save() {
 		enableIdenticonGeneration: enableIdenticonGeneration.value,
 		enableChartsForRemoteUser: enableChartsForRemoteUser.value,
 		enableChartsForFederatedInstances: enableChartsForFederatedInstances.value,
-        DiscordWebhookUrl,
-        EmojiBotToken,
-        ApiBase
+        DiscordWebhookUrl:DiscordWebhookUrl.value,
+        EmojiBotToken:EmojiBotToken.value,
+        ApiBase:ApiBase.value
 	}).then(() => {
 		fetchInstance();
 	});
diff --git a/packages/frontend/src/pages/timeline.vue b/packages/frontend/src/pages/timeline.vue
index 3d62972ce0..555df52029 100644
--- a/packages/frontend/src/pages/timeline.vue
+++ b/packages/frontend/src/pages/timeline.vue
@@ -67,7 +67,7 @@ const src = computed({ get: () => ($i ? defaultStore.reactiveState.tl.value.src
 const withRenotes = ref(true);
 const withReplies = ref($i ? defaultStore.state.tlWithReplies : false);
 const onlyFiles = ref(false);
-const isShowMediaTimeline = $ref(defaultStore.state.showMediaTimeline)
+const isShowMediaTimeline = ref(defaultStore.state.showMediaTimeline)
 
 watch(src, () => queue.value = 0);
 
@@ -226,7 +226,7 @@ const headerTabs = computed(() => [...(defaultStore.reactiveState.pinnedUserList
     title: i18n.ts._timelines.local,
     icon: 'ti ti-planet',
     iconOnly: true,
-}, ...(isShowMediaTimeline ? [{
+}, ...(isShowMediaTimeline.value ? [{
     key: 'media',
     title: i18n.ts._timelines.media,
     icon: 'ti ti-photo',
diff --git a/packages/frontend/src/ui/_common_/stream-indicator.vue b/packages/frontend/src/ui/_common_/stream-indicator.vue
index ed3ff257ee..7eb70d7e1d 100644
--- a/packages/frontend/src/ui/_common_/stream-indicator.vue
+++ b/packages/frontend/src/ui/_common_/stream-indicator.vue
@@ -27,7 +27,6 @@ const hasDisconnected = ref(false);
 let timeoutId = ref<number>();
 
 function onDisconnected() {
-	if (isReloading) return;
 	window.clearTimeout(timeoutId.value);
 	timeoutId.value = window.setTimeout(() => {
 		hasDisconnected.value = true;