diff --git a/src/web/app/common/views/components/messaging-room.message.vue b/src/web/app/common/views/components/messaging-room.message.vue
index 95a6efa28b..2464eceb7f 100644
--- a/src/web/app/common/views/components/messaging-room.message.vue
+++ b/src/web/app/common/views/components/messaging-room.message.vue
@@ -5,8 +5,8 @@
 	</a>
 	<div class="content-container">
 		<div class="balloon">
-			<p class="read" v-if="message.is_me && message.is_read">%i18n:common.tags.mk-messaging-message.is-read%</p>
-			<button class="delete-button" v-if="message.is_me" title="%i18n:common.delete%">
+			<p class="read" v-if="isMe && message.is_read">%i18n:common.tags.mk-messaging-message.is-read%</p>
+			<button class="delete-button" v-if="isMe" title="%i18n:common.delete%">
 				<img src="/assets/desktop/messaging/delete.png" alt="Delete"/>
 			</button>
 			<div class="content" v-if="!message.is_deleted">
diff --git a/src/web/app/mobile/script.ts b/src/web/app/mobile/script.ts
index eef7c20f00..904cebc7e1 100644
--- a/src/web/app/mobile/script.ts
+++ b/src/web/app/mobile/script.ts
@@ -20,6 +20,8 @@ import MkUser from './views/pages/user.vue';
 import MkSelectDrive from './views/pages/selectdrive.vue';
 import MkDrive from './views/pages/drive.vue';
 import MkNotifications from './views/pages/notifications.vue';
+import MkMessaging from './views/pages/messaging.vue';
+import MkMessagingRoom from './views/pages/messaging-room.vue';
 
 /**
  * init
@@ -49,6 +51,8 @@ init((launch) => {
 		{ path: '/', name: 'index', component: MkIndex },
 		{ path: '/signup', name: 'signup', component: MkSignup },
 		{ path: '/i/notifications', component: MkNotifications },
+		{ path: '/i/messaging', component: MkMessaging },
+		{ path: '/i/messaging/:username', component: MkMessagingRoom },
 		{ path: '/i/drive', component: MkDrive },
 		{ path: '/i/drive/folder/:folder', component: MkDrive },
 		{ path: '/selectdrive', component: MkSelectDrive },
diff --git a/src/web/app/mobile/views/components/index.ts b/src/web/app/mobile/views/components/index.ts
index 658cc48639..f5e4ce48f4 100644
--- a/src/web/app/mobile/views/components/index.ts
+++ b/src/web/app/mobile/views/components/index.ts
@@ -14,6 +14,7 @@ import postDetail from './post-detail.vue';
 import followButton from './follow-button.vue';
 import friendsMaker from './friends-maker.vue';
 import notifications from './notifications.vue';
+import notificationPreview from './notification-preview.vue';
 
 Vue.component('mk-ui', ui);
 Vue.component('mk-home', home);
@@ -29,3 +30,4 @@ Vue.component('mk-post-detail', postDetail);
 Vue.component('mk-follow-button', followButton);
 Vue.component('mk-friends-maker', friendsMaker);
 Vue.component('mk-notifications', notifications);
+Vue.component('mk-notification-preview', notificationPreview);
diff --git a/src/web/app/mobile/views/pages/messaging-room.vue b/src/web/app/mobile/views/pages/messaging-room.vue
index 671ede217a..a653145c10 100644
--- a/src/web/app/mobile/views/pages/messaging-room.vue
+++ b/src/web/app/mobile/views/pages/messaging-room.vue
@@ -17,15 +17,25 @@ export default Vue.extend({
 			user: null
 		};
 	},
-	mounted() {
-		(this as any).api('users/show', {
-			username: (this as any).$route.params.user
-		}).then(user => {
-			this.user = user;
-			this.fetching = false;
+	watch: {
+		$route: 'fetch'
+	},
+	created() {
+		document.documentElement.style.background = '#fff';
+		this.fetch();
+	},
+	methods: {
+		fetch() {
+			this.fetching = true;
+			(this as any).api('users/show', {
+				username: (this as any).$route.params.username
+			}).then(user => {
+				this.user = user;
+				this.fetching = false;
 
-			document.title = `%i18n:mobile.tags.mk-messaging-room-page.message%: ${user.name} | Misskey`;
-		});
+				document.title = `%i18n:mobile.tags.mk-messaging-room-page.message%: ${user.name} | Misskey`;
+			});
+		}
 	}
 });
 </script>
diff --git a/src/web/app/mobile/views/pages/messaging.vue b/src/web/app/mobile/views/pages/messaging.vue
index 607e44650d..f36ad4a4fe 100644
--- a/src/web/app/mobile/views/pages/messaging.vue
+++ b/src/web/app/mobile/views/pages/messaging.vue
@@ -9,7 +9,8 @@
 import Vue from 'vue';
 export default Vue.extend({
 	mounted() {
-		document.title = 'Misskey | %i18n:mobile.tags.mk-messaging-page.message%';
+		document.title = 'Misskey %i18n:mobile.tags.mk-messaging-page.message%';
+		document.documentElement.style.background = '#fff';
 	},
 	methods: {
 		navigate(user) {
@@ -18,4 +19,3 @@ export default Vue.extend({
 	}
 });
 </script>
-