Refactor settings/email to use Composition API (#8576)
* refactor(client): refactor settings/email to use Composition API * fix(client): switch to non-null assertion for settings values
This commit is contained in:
		@@ -39,8 +39,8 @@
 | 
				
			|||||||
</div>
 | 
					</div>
 | 
				
			||||||
</template>
 | 
					</template>
 | 
				
			||||||
 | 
					
 | 
				
			||||||
<script lang="ts">
 | 
					<script lang="ts" setup>
 | 
				
			||||||
import { defineComponent, onMounted, ref, watch } from 'vue';
 | 
					import { defineExpose, onMounted, ref, watch } from 'vue';
 | 
				
			||||||
import FormSection from '@/components/form/section.vue';
 | 
					import FormSection from '@/components/form/section.vue';
 | 
				
			||||||
import FormInput from '@/components/form/input.vue';
 | 
					import FormInput from '@/components/form/input.vue';
 | 
				
			||||||
import FormSwitch from '@/components/form/switch.vue';
 | 
					import FormSwitch from '@/components/form/switch.vue';
 | 
				
			||||||
@@ -49,23 +49,7 @@ import * as symbols from '@/symbols';
 | 
				
			|||||||
import { $i } from '@/account';
 | 
					import { $i } from '@/account';
 | 
				
			||||||
import { i18n } from '@/i18n';
 | 
					import { i18n } from '@/i18n';
 | 
				
			||||||
 | 
					
 | 
				
			||||||
export default defineComponent({
 | 
					const emailAddress = ref($i!.email);
 | 
				
			||||||
	components: {
 | 
					 | 
				
			||||||
		FormSection,
 | 
					 | 
				
			||||||
		FormSwitch,
 | 
					 | 
				
			||||||
		FormInput,
 | 
					 | 
				
			||||||
	},
 | 
					 | 
				
			||||||
 | 
					 | 
				
			||||||
	emits: ['info'],
 | 
					 | 
				
			||||||
 | 
					 | 
				
			||||||
	setup(props, context) {
 | 
					 | 
				
			||||||
		const emailAddress = ref($i.email);
 | 
					 | 
				
			||||||
 | 
					 | 
				
			||||||
		const INFO = {
 | 
					 | 
				
			||||||
			title: i18n.ts.email,
 | 
					 | 
				
			||||||
			icon: 'fas fa-envelope',
 | 
					 | 
				
			||||||
			bg: 'var(--bg)',
 | 
					 | 
				
			||||||
		};
 | 
					 | 
				
			||||||
 | 
					
 | 
				
			||||||
const onChangeReceiveAnnouncementEmail = (v) => {
 | 
					const onChangeReceiveAnnouncementEmail = (v) => {
 | 
				
			||||||
	os.api('i/update', {
 | 
						os.api('i/update', {
 | 
				
			||||||
@@ -86,12 +70,12 @@ export default defineComponent({
 | 
				
			|||||||
	});
 | 
						});
 | 
				
			||||||
};
 | 
					};
 | 
				
			||||||
 | 
					
 | 
				
			||||||
		const emailNotification_mention = ref($i.emailNotificationTypes.includes('mention'));
 | 
					const emailNotification_mention = ref($i!.emailNotificationTypes.includes('mention'));
 | 
				
			||||||
		const emailNotification_reply = ref($i.emailNotificationTypes.includes('reply'));
 | 
					const emailNotification_reply = ref($i!.emailNotificationTypes.includes('reply'));
 | 
				
			||||||
		const emailNotification_quote = ref($i.emailNotificationTypes.includes('quote'));
 | 
					const emailNotification_quote = ref($i!.emailNotificationTypes.includes('quote'));
 | 
				
			||||||
		const emailNotification_follow = ref($i.emailNotificationTypes.includes('follow'));
 | 
					const emailNotification_follow = ref($i!.emailNotificationTypes.includes('follow'));
 | 
				
			||||||
		const emailNotification_receiveFollowRequest = ref($i.emailNotificationTypes.includes('receiveFollowRequest'));
 | 
					const emailNotification_receiveFollowRequest = ref($i!.emailNotificationTypes.includes('receiveFollowRequest'));
 | 
				
			||||||
		const emailNotification_groupInvited = ref($i.emailNotificationTypes.includes('groupInvited'));
 | 
					const emailNotification_groupInvited = ref($i!.emailNotificationTypes.includes('groupInvited'));
 | 
				
			||||||
 | 
					
 | 
				
			||||||
const saveNotificationSettings = () => {
 | 
					const saveNotificationSettings = () => {
 | 
				
			||||||
	os.api('i/update', {
 | 
						os.api('i/update', {
 | 
				
			||||||
@@ -116,12 +100,11 @@ export default defineComponent({
 | 
				
			|||||||
	});
 | 
						});
 | 
				
			||||||
});
 | 
					});
 | 
				
			||||||
 | 
					
 | 
				
			||||||
		return {
 | 
					defineExpose({
 | 
				
			||||||
			[symbols.PAGE_INFO]: INFO,
 | 
						[symbols.PAGE_INFO]: {
 | 
				
			||||||
			emailAddress,
 | 
							title: i18n.ts.email,
 | 
				
			||||||
			onChangeReceiveAnnouncementEmail,
 | 
							icon: 'fas fa-envelope',
 | 
				
			||||||
			emailNotification_mention, emailNotification_reply, emailNotification_quote, emailNotification_follow, emailNotification_receiveFollowRequest, emailNotification_groupInvited,
 | 
							bg: 'var(--bg)',
 | 
				
			||||||
		};
 | 
						}
 | 
				
			||||||
	},
 | 
					 | 
				
			||||||
});
 | 
					});
 | 
				
			||||||
</script>
 | 
					</script>
 | 
				
			||||||
 
 | 
				
			|||||||
		Reference in New Issue
	
	Block a user