fix: review fixes (#17208)

* fix: OAuthのContent-Typeを正しく判定するように

* fix(frontend): fix outdated comments

* fix: storagePersistenceのtop-level awaitを解消

* fix

* fix(frontend): add comment

Co-Authored-By: anatawa12 <anatawa12@icloud.com>

* fix

* fix: rename `users/get-following-users-by-birthday`

* fix: fix types

* Update MkForm.vue

* refactor utility/storage.ts

---------

Co-authored-by: anatawa12 <anatawa12@icloud.com>
Co-authored-by: syuilo <4439005+syuilo@users.noreply.github.com>

packages/frontend/src/components/MkDraggable.vue

@@ -109,6 +109,7 @@ function onDragstart(ev: DragEvent, item: T) {
 
 	// Chromeのバグで、Dragstartハンドラ内ですぐにDOMを変更する(=リアクティブなプロパティを変更する)とDragが終了してしまう
 	// SEE: https://stackoverflow.com/questions/19639969/html5-dragend-event-firing-immediately
+	// SEE: https://issues.chromium.org/issues/41150279
 	window.setTimeout(() => {
 		dragging.value = true;
 	}, 10);

packages/frontend/src/components/MkForm.vue

@@ -4,7 +4,7 @@ SPDX-License-Identifier: AGPL-3.0-only
 -->
 
 <template>
-<div v-if="Object.keys(form).filter(item => !form[item].hidden).length > 0" class="_gaps_m">
+<div v-if="Object.values(form).filter(item => typeof item.hidden !== 'boolean' || item.hidden === true).length > 0" class="_gaps_m">
 	<template v-for="v, k in form">
 		<template v-if="typeof v.hidden == 'function' ? v.hidden(values) : v.hidden"></template>
 		<MkInput v-else-if="v.type === 'number'" v-model="values[k]" type="number" :step="v.step || 1" :manualSave="v.manualSave" @savingStateChange="(changed, invalid) => onSavingStateChange(k, changed, invalid)">

packages/frontend/src/pages/admin/RolesEditorFormula.vue

@@ -27,7 +27,7 @@ SPDX-License-Identifier: AGPL-3.0-only
 		>
 			<template #default="{ item, dragStart }">
 				<div :class="$style.item">
-					<!-- divが無いとエラーになる https://github.com/SortableJS/vue.draggable.next/issues/189 -->
+					<!-- divが無いとエラーになる -->
 					<RolesEditorFormula
 						:modelValue="item"
 						:dragStartCallback="dragStart"

packages/frontend/src/pages/page-editor/page-editor.blocks.vue

@@ -14,7 +14,7 @@ SPDX-License-Identifier: AGPL-3.0-only
 >
 	<template #default="{ item }">
 		<div>
-			<!-- divが無いとエラーになる https://github.com/SortableJS/vue.draggable.next/issues/189 -->
+			<!-- divが無いとエラーになる -->
 			<component :is="getComponent(item.type) as any" :modelValue="item" @update:modelValue="updateItem" @remove="() => removeItem(item)"/>
 		</div>
 	</template>

packages/frontend/src/pages/settings/index.vue

@@ -51,10 +51,12 @@ import { enableAutoBackup, getPreferencesProfileMenu } from '@/preferences/utili
 import { store } from '@/store.js';
 import { signout } from '@/signout.js';
 import { genSearchIndexes } from '@/utility/inapp-search.js';
-import { enableStoragePersistence, storagePersisted, storagePersistenceSupported, skipStoragePersistence } from '@/utility/storage.js';
+import { enableStoragePersistence, getStoragePersistenceStatusRef, storagePersistenceSupported, skipStoragePersistence } from '@/utility/storage.js';
 
 const searchIndex = await import('search-index:settings').then(({ searchIndexes }) => genSearchIndexes(searchIndexes));
 
+const storagePersisted = await getStoragePersistenceStatusRef();
+
 const indexInfo = {
 	title: i18n.ts.settings,
 	icon: 'ti ti-settings',

packages/frontend/src/pages/settings/other.vue

@@ -165,7 +165,7 @@ import MkKeyValue from '@/components/MkKeyValue.vue';
 import MkButton from '@/components/MkButton.vue';
 import FormSlot from '@/components/form/slot.vue';
 import * as os from '@/os.js';
-import { enableStoragePersistence, storagePersisted, storagePersistenceSupported } from '@/utility/storage.js';
+import { enableStoragePersistence, getStoragePersistenceStatusRef, storagePersistenceSupported } from '@/utility/storage.js';
 import { ensureSignin } from '@/i.js';
 import { i18n } from '@/i18n.js';
 import { definePage } from '@/page.js';
@@ -180,6 +180,8 @@ import { cloudBackup } from '@/preferences/utility.js';
 
 const $i = ensureSignin();
 
+const storagePersisted = await getStoragePersistenceStatusRef();
+
 const reportError = prefer.model('reportError');
 const enableCondensedLine = prefer.model('enableCondensedLine');
 const skipNoteRender = prefer.model('skipNoteRender');

packages/frontend/src/utility/storage.ts

@@ -3,13 +3,21 @@
  * SPDX-License-Identifier: AGPL-3.0-only
  */
 
-import { ref } from 'vue';
+import { readonly, ref } from 'vue';
 import * as os from '@/os.js';
 import { store } from '@/store.js';
 import { i18n } from '@/i18n.js';
 
 export const storagePersistenceSupported = window.isSecureContext && 'storage' in navigator;
-export const storagePersisted = ref(storagePersistenceSupported ? await navigator.storage.persisted() : false);
+const storagePersisted = ref(false);
+
+export async function getStoragePersistenceStatusRef() {
+	if (storagePersistenceSupported) {
+		storagePersisted.value = await navigator.storage.persisted().catch(() => false);
+	}
+
+	return readonly(storagePersisted);
+}
 
 export async function enableStoragePersistence() {
 	if (!storagePersistenceSupported) return;

packages/frontend/src/widgets/WidgetBirthdayFollowings.user.vue

@@ -30,7 +30,7 @@ import { useLowresTime } from '@/composables/use-lowres-time.js';
 import { userPage, acct } from '@/filters/user.js';
 
 const props = defineProps<{
-	item: Misskey.entities.UsersGetFollowingBirthdayUsersResponse[number];
+	item: Misskey.entities.UsersGetFollowingUsersByBirthdayResponse[number];
 }>();
 
 const now = useLowresTime();

packages/frontend/src/widgets/WidgetBirthdayFollowings.vue

@@ -106,7 +106,7 @@ const end = computed(() => {
 	}
 });
 
-const birthdayUsersPaginator = markRaw(new Paginator('users/get-following-birthday-users', {
+const birthdayUsersPaginator = markRaw(new Paginator('users/get-following-users-by-birthday', {
 	limit: 18,
 	offsetMode: true,
 	computedParams: computed(() => {