feat: move from life cycle to data or watcher

- remove from created / mounted
- initialize component services in data
- use immediate watcher where appropriate
- deep watch for route changes

src/components/user/avatar-settings.vue

@@ -74,14 +74,13 @@ export default {
 	data() {
 		return {
 			avatarProvider: '',
-			avatarService: AvatarService,
+			avatarService: new AvatarService(),
 			isCropAvatar: false,
 			avatarToCrop: null,
 			loading: false, // Seperate variable because some things we're doing in browser take a bit
 		}
 	},
 	created() {
-		this.avatarService = new AvatarService()
 		this.avatarStatus()
 	},
 	components: {

src/components/user/settings/deletion.vue

@@ -91,14 +91,11 @@ export default {
 	name: 'user-settings-deletion',
 	data() {
 		return {
-			accountDeleteService: AccountDeleteService,
+			accountDeleteService: new AccountDeleteService(),
 			password: '',
 			errPasswordRequired: false,
 		}
 	},
-	created() {
-		this.accountDeleteService = new AccountDeleteService()
-	},
 	computed: mapState({
 		userDeletionEnabled: state => state.config.userDeletionEnabled,
 		deletionScheduledAt: state => parseDateOrNull(state.auth.info.deletionScheduledAt),