4 files changed, 47 insertions, 1 deletions
diff --git a/packages/frontend/src/pages/settings/index.vue b/packages/frontend/src/pages/settings/index.vue
index 250c1735be..39c32d347f 100644
--- a/packages/frontend/src/pages/settings/index.vue
+++ b/packages/frontend/src/pages/settings/index.vue
@@ -11,6 +11,11 @@ SPDX-License-Identifier: AGPL-3.0-only
 				<div v-if="!narrow || currentPage?.route.name == null" class="nav">
 					<div class="_gaps_s">
 						<MkInfo v-if="emailNotConfigured" warn class="info">{{ i18n.ts.emailNotConfiguredWarning }} <MkA to="/settings/email" class="_link">{{ i18n.ts.configure }}</MkA></MkInfo>
+						<MkInfo v-if="!storagePersisted && store.r.showStoragePersistenceSuggestion.value" class="info">
+							<div>{{ i18n.ts._settings.settingsPersistence_description1 }}</div>
+							<div>{{ i18n.ts._settings.settingsPersistence_description2 }}</div>
+							<div><button class="_textButton" @click="enableStoragePersistence">{{ i18n.ts.enable }}</button> | <button class="_textButton" @click="skipStoragePersistence">{{ i18n.ts.skip }}</button></div>
+						</MkInfo>
 						<MkInfo v-if="!store.r.enablePreferencesAutoCloudBackup.value && store.r.showPreferencesAutoCloudBackupSuggestion.value" class="info">
 							<div>{{ i18n.ts._preferencesBackup.autoPreferencesBackupIsNotEnabledForThisDevice }}</div>
 							<div><button class="_textButton" @click="enableAutoBackup">{{ i18n.ts.enable }}</button> | <button class="_textButton" @click="skipAutoBackup">{{ i18n.ts.skip }}</button></div>
@@ -46,6 +51,7 @@ 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, skipStoragePersistence } from '@/utility/storage.js';
 
 const searchIndex = await import('search-index:settings').then(({ searchIndexes }) => genSearchIndexes(searchIndexes));
 
diff --git a/packages/frontend/src/pages/settings/other.vue b/packages/frontend/src/pages/settings/other.vue
index e6ee3bfb1c..d4097bde94 100644
--- a/packages/frontend/src/pages/settings/other.vue
+++ b/packages/frontend/src/pages/settings/other.vue
@@ -142,6 +142,8 @@ SPDX-License-Identifier: AGPL-3.0-only
 			<hr>
 		</template>
 
+		<MkButton v-if="!storagePersisted" @click="enableStoragePersistence">{{ i18n.ts._settings.settingsPersistence_title }}</MkButton>
+
 		<MkButton @click="forceCloudBackup">{{ i18n.ts._preferencesBackup.forceBackup }}</MkButton>
 
 		<FormSlot>
@@ -163,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 { misskeyApi } from '@/utility/misskey-api.js';
+import { enableStoragePersistence, storagePersisted, skipStoragePersistence } from '@/utility/storage.js';
 import { ensureSignin } from '@/i.js';
 import { i18n } from '@/i18n.js';
 import { definePage } from '@/page.js';
diff --git a/packages/frontend/src/store.ts b/packages/frontend/src/store.ts
index 073fbba0fb..fb9349c42f 100644
--- a/packages/frontend/src/store.ts
+++ b/packages/frontend/src/store.ts
@@ -118,6 +118,10 @@ export const store = markRaw(new Pizzax('base', {
 		where: 'device',
 		default: true,
 	},
+	showStoragePersistenceSuggestion: {
+		where: 'device',
+		default: true,
+	},
 
 	//#region TODO: そのうち消す (preferに移行済み)
 	defaultWithReplies: {
diff --git a/packages/frontend/src/utility/storage.ts b/packages/frontend/src/utility/storage.ts
new file mode 100644
index 0000000000..9df3a251e6
--- /dev/null
+++ b/packages/frontend/src/utility/storage.ts
@@ -0,0 +1,34 @@
+/*
+ * SPDX-FileCopyrightText: syuilo and misskey-project
+ * SPDX-License-Identifier: AGPL-3.0-only
+ */
+
+import { computed, ref, shallowRef, watch, defineAsyncComponent } from 'vue';
+import * as os from '@/os.js';
+import { store } from '@/store.js';
+import { i18n } from '@/i18n.js';
+
+export const storagePersisted = ref(await navigator.storage.persisted());
+
+export async function enableStoragePersistence() {
+	try {
+		const persisted = await navigator.storage.persist();
+		if (persisted) {
+			storagePersisted.value = true;
+		} else {
+			os.alert({
+				type: 'error',
+				text: i18n.ts.somethingHappened,
+			});
+		}
+	}	catch (err) {
+		os.alert({
+			type: 'error',
+			text: i18n.ts.somethingHappened,
+		});
+	}
+}
+
+export function skipStoragePersistence() {
+	store.set('showStoragePersistenceSuggestion', false);
+}