Refactor

src/client/app/mobile/views/components/ui.nav.vue

@@ -29,7 +29,7 @@
 				</ul>
 				<ul>
 					<li><router-link to="/i/settings" :data-active="$route.name == 'settings'">%fa:cog%%i18n:@settings%%fa:angle-right%</router-link></li>
-					<li @click="dark"><p><template v-if="_darkmode_">%fa:moon%</template><template v-else>%fa:R moon%</template><span>ダークモード</span></p></li>
+					<li @click="dark"><p><template v-if="$store.state.device.darkmode">%fa:moon%</template><template v-else>%fa:R moon%</template><span>ダークモード</span></p></li>
 				</ul>
 			</div>
 			<a :href="aboutUrl"><p class="about">%i18n:@about%</p></a>
@@ -117,7 +117,10 @@ export default Vue.extend({
 			this.hasGameInvitations = false;
 		},
 		dark() {
-			(this as any)._updateDarkmode_(!(this as any)._darkmode_);
+			this.$store.commit('device/set', {
+				key: 'darkmode',
+				value: !this.$store.state.device.darkmode
+			});
 		}
 	}
 });

src/client/app/mobile/views/pages/home.vue

@@ -17,7 +17,7 @@
 		<button @click="fn">%fa:pencil-alt%</button>
 	</template>
 
-	<main :data-darkmode="_darkmode_">
+	<main :data-darkmode="$store.state.device.darkmode">
 		<div class="nav" v-if="showNav">
 			<div class="bg" @click="showNav = false"></div>
 			<div class="body">

src/client/app/mobile/views/pages/settings.vue

@@ -141,7 +141,6 @@ export default Vue.extend({
 			version,
 			codename,
 			langs,
-			darkmode: localStorage.getItem('darkmode') == 'true',
 			latestVersion: undefined,
 			checkingForUpdate: false
 		};
@@ -152,6 +151,11 @@ export default Vue.extend({
 			return Vue.filter('userName')((this as any).os.i);
 		},
 
+		darkmode: {
+			get() { return this.$store.state.device.darkmode; },
+			set(value) { this.$store.commit('device/set', { key: 'darkmode', value }); }
+		},
+
 		postStyle: {
 			get() { return this.$store.state.device.postStyle; },
 			set(value) { this.$store.commit('device/set', { key: 'postStyle', value }); }
@@ -168,12 +172,6 @@ export default Vue.extend({
 		},
 	},
 
-	watch: {
-		darkmode() {
-			(this as any)._updateDarkmode_(this.darkmode);
-		}
-	},
-
 	mounted() {
 		document.title = 'Misskey | %i18n:@settings%';
 	},

src/client/app/mobile/views/pages/user.vue

@@ -1,7 +1,7 @@
 <template>
 <mk-ui>
 	<template slot="header" v-if="!fetching"><img :src="`${user.avatarUrl}?thumbnail&size=64`" alt="">{{ user | userName }}</template>
-	<main v-if="!fetching" :data-darkmode="_darkmode_">
+	<main v-if="!fetching" :data-darkmode="$store.state.device.darkmode">
 		<div class="is-suspended" v-if="user.isSuspended"><p>%fa:exclamation-triangle% %i18n:@is-suspended%</p></div>
 		<div class="is-remote" v-if="user.host != null"><p>%fa:exclamation-triangle% %i18n:@is-remote%<a :href="user.url || user.uri" target="_blank">%i18n:@view-remote%</a></p></div>
 		<header>