:v:

3 files changed, 144 insertions, 3 deletions

diff --git a/src/web/app/desktop/views/components/settings.apps.vue b/src/web/app/desktop/views/components/settings.apps.vue
new file mode 100644
index 0000000000..0503b03abd
--- /dev/null
+++ b/src/web/app/desktop/views/components/settings.apps.vue
@@ -0,0 +1,39 @@
+<template>
+<div class="root">
+	<div class="none ui info" v-if="!fetching && apps.length == 0">
+		<p>%fa:info-circle%%i18n:common.tags.mk-authorized-apps.no-apps%</p>
+	</div>
+	<div class="apps" v-if="apps.length != 0">
+		<div v-for="app in apps">
+			<p><b>{{ app.name }}</b></p>
+			<p>{{ app.description }}</p>
+		</div>
+	</div>
+</div>
+</template>
+
+<script lang="ts">
+import Vue from 'vue';
+export default Vue.extend({
+	data() {
+		return {
+			fetching: true,
+			apps: []
+		};
+	},
+	mounted() {
+		(this as any).api('i/authorized_apps').then(apps => {
+			this.apps = apps;
+			this.fetching = false;
+		});
+	}
+});
+</script>
+
+<style lang="stylus" scoped>
+.root
+	> .apps
+		> div
+			padding 16px 0 0 0
+			border-bottom solid 1px #eee
+</style>
diff --git a/src/web/app/desktop/views/components/settings.signins.vue b/src/web/app/desktop/views/components/settings.signins.vue
new file mode 100644
index 0000000000..ddc567f06f
--- /dev/null
+++ b/src/web/app/desktop/views/components/settings.signins.vue
@@ -0,0 +1,98 @@
+<template>
+<div class="root">
+<div class="signins" v-if="signins.length != 0">
+	<div v-for="signin in signins">
+		<header @click="signin._show = !signin._show">
+			<template v-if="signin.success">%fa:check%</template>
+			<template v-else>%fa:times%</template>
+			<span class="ip">{{ signin.ip }}</span>
+			<mk-time :time="signin.created_at"/>
+		</header>
+		<div class="headers" v-show="signin._show">
+			<tree-view :data="signin.headers"/>
+		</div>
+	</div>
+</div>
+</div>
+</template>
+
+<script lang="ts">
+import Vue from 'vue';
+export default Vue.extend({
+	data() {
+		return {
+			fetching: true,
+			signins: [],
+			connection: null,
+			connectionId: null
+		};
+	},
+	mounted() {
+		(this as any).api('i/signin_history').then(signins => {
+			this.signins = signins;
+			this.fetching = false;
+		});
+
+		this.connection = (this as any).os.stream.getConnection();
+		this.connectionId = (this as any).os.stream.use();
+
+		this.connection.on('signin', this.onSignin);
+	},
+	beforeDestroy() {
+		this.connection.off('signin', this.onSignin);
+		(this as any).os.stream.dispose(this.connectionId);
+	},
+	methods: {
+		onSignin(signin) {
+			this.signins.unshift(signin);
+		}
+	}
+});
+</script>
+
+<style lang="stylus" scoped>
+.root
+	> .signins
+		> div
+			border-bottom solid 1px #eee
+
+			> header
+				display flex
+				padding 8px 0
+				line-height 32px
+				cursor pointer
+
+				> [data-fa]
+					margin-right 8px
+					text-align left
+
+					&.check
+						color #0fda82
+
+					&.times
+						color #ff3100
+
+				> .ip
+					display inline-block
+					text-align left
+					padding 8px
+					line-height 16px
+					font-family monospace
+					font-size 14px
+					color #444
+					background #f8f8f8
+					border-radius 4px
+
+				> .mk-time
+					margin-left auto
+					text-align right
+					color #777
+
+			> .headers
+				overflow auto
+				margin 0 0 16px 0
+				max-height 100px
+				white-space pre-wrap
+				word-break break-all
+
+</style>
diff --git a/src/web/app/desktop/views/components/settings.vue b/src/web/app/desktop/views/components/settings.vue
index 0eb18770a5..096ba57fd7 100644
--- a/src/web/app/desktop/views/components/settings.vue
+++ b/src/web/app/desktop/views/components/settings.vue
@@ -81,7 +81,7 @@
 
 		<section class="apps" v-show="page == 'apps'">
 			<h1>アプリケーション</h1>
-			<mk-authorized-apps/>
+			<x-apps/>
 		</section>
 
 		<section class="twitter" v-show="page == 'twitter'">
@@ -101,7 +101,7 @@
 
 		<section class="signin" v-show="page == 'security'">
 			<h1>サインイン履歴</h1>
-			<mk-signin-history/>
+			<x-signins/>
 		</section>
 
 		<section class="api" v-show="page == 'api'">
@@ -161,6 +161,8 @@ import XMute from './settings.mute.vue';
 import XPassword from './settings.password.vue';
 import X2fa from './settings.2fa.vue';
 import XApi from './settings.api.vue';
+import XApps from './settings.apps.vue';
+import XSignins from './settings.signins.vue';
 import { docsUrl, license, lang, version } from '../../../config';
 import checkForUpdate from '../../../common/scripts/check-for-update';
 
@@ -170,7 +172,9 @@ export default Vue.extend({
 		XMute,
 		XPassword,
 		X2fa,
-		XApi
+		XApi,
+		XApps,
+		XSignins
 	},
 	data() {
 		return {