🎨

locales/ja-JP.yml

@@ -832,6 +832,8 @@ breakFollow: "フォロワーを解除"
 breakFollowConfirm: "フォロワー解除しますか？"
 itsOn: "オンになっています"
 itsOff: "オフになっています"
+on: "オン"
+off: "オフ"
 emailRequiredForSignup: "アカウント登録にメールアドレスを必須にする"
 unread: "未読"
 filter: "フィルタ"

packages/frontend/src/components/MkUserSetupDialog.Privacy.vue

@@ -2,22 +2,33 @@
 <div class="_gaps">
 	<MkInfo>{{ i18n.ts._initialAccountSetting.theseSettingsCanEditLater }}</MkInfo>
 
-	<MkSwitch v-model="isLocked">{{ i18n.ts.makeFollowManuallyApprove }}<template #caption>{{ i18n.ts.lockedAccountInfo }}</template></MkSwitch>
+	<MkFolder>
+		<template #label>{{ i18n.ts.makeFollowManuallyApprove }}</template>
+		<template #suffix>{{ isLocked ? i18n.ts.on : i18n.ts.off }}</template>
 
-	<MkSwitch v-model="hideOnlineStatus" @update:model-value="save()">
-		{{ i18n.ts.hideOnlineStatus }}
-		<template #caption>{{ i18n.ts.hideOnlineStatusDescription }}</template>
-	</MkSwitch>
+		<MkSwitch v-model="isLocked">{{ i18n.ts.makeFollowManuallyApprove }}<template #caption>{{ i18n.ts.lockedAccountInfo }}</template></MkSwitch>
+	</MkFolder>
 
-	<MkSwitch v-model="noCrawle" @update:model-value="save()">
-		{{ i18n.ts.noCrawle }}
-		<template #caption>{{ i18n.ts.noCrawleDescription }}</template>
-	</MkSwitch>
+	<MkFolder>
+		<template #label>{{ i18n.ts.hideOnlineStatus }}</template>
+		<template #suffix>{{ hideOnlineStatus ? i18n.ts.on : i18n.ts.off }}</template>
 
-	<MkSwitch v-model="preventAiLearning" @update:model-value="save()">
-		{{ i18n.ts.preventAiLearning }}<span class="_beta">{{ i18n.ts.beta }}</span>
-		<template #caption>{{ i18n.ts.preventAiLearningDescription }}</template>
-	</MkSwitch>
+		<MkSwitch v-model="hideOnlineStatus">{{ i18n.ts.hideOnlineStatus }}<template #caption>{{ i18n.ts.hideOnlineStatusDescription }}</template></MkSwitch>
+	</MkFolder>
+
+	<MkFolder>
+		<template #label>{{ i18n.ts.noCrawle }}</template>
+		<template #suffix>{{ noCrawle ? i18n.ts.on : i18n.ts.off }}</template>
+
+		<MkSwitch v-model="noCrawle">{{ i18n.ts.noCrawle }}<template #caption>{{ i18n.ts.noCrawleDescription }}</template></MkSwitch>
+	</MkFolder>
+
+	<MkFolder>
+		<template #label>{{ i18n.ts.preventAiLearning }}</template>
+		<template #suffix>{{ preventAiLearning ? i18n.ts.on : i18n.ts.off }}</template>
+
+		<MkSwitch v-model="preventAiLearning">{{ i18n.ts.preventAiLearning }}<template #caption>{{ i18n.ts.preventAiLearningDescription }}</template></MkSwitch>
+	</MkFolder>
 
 	<MkInfo>{{ i18n.ts._initialAccountSetting.youCanEditMoreSettingsInSettingsPageLater }}</MkInfo>
 </div>
@@ -29,6 +40,7 @@ import { instance } from '@/instance';
 import { i18n } from '@/i18n';
 import MkSwitch from '@/components/MkSwitch.vue';
 import MkInfo from '@/components/MkInfo.vue';
+import MkFolder from '@/components/MkFolder.vue';
 import * as os from '@/os';
 import { $i } from '@/account';