From 6037b0acc5541b1fadf5150b037f27890dfa00f0 Mon Sep 17 00:00:00 2001
From: syuilo <syuilotan@yahoo.co.jp>
Date: Fri, 22 Jun 2018 18:32:21 +0900
Subject: [PATCH] =?UTF-8?q?=E9=9D=9E=E3=83=AD=E3=82=B0=E3=82=A4=E3=83=B3?=
 =?UTF-8?q?=E6=99=82=E3=81=AE=E3=83=88=E3=83=83=E3=83=97=E3=81=AB=E3=83=88?=
 =?UTF-8?q?=E3=83=AC=E3=83=B3=E3=83=89=E3=82=92=E8=A1=A8=E7=A4=BA=E3=81=99?=
 =?UTF-8?q?=E3=82=8B=E3=82=88=E3=81=86=E3=81=AB?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../views/components/welcome-timeline.vue     |  8 +++
 .../app/desktop/views/pages/welcome.vue       | 53 ++++++++++++-------
 src/client/app/mobile/views/pages/welcome.vue | 20 ++++++-
 src/server/api/endpoints.ts                   |  3 +-
 4 files changed, 63 insertions(+), 21 deletions(-)

diff --git a/src/client/app/common/views/components/welcome-timeline.vue b/src/client/app/common/views/components/welcome-timeline.vue
index bf2c653766..5a8b9df476 100644
--- a/src/client/app/common/views/components/welcome-timeline.vue
+++ b/src/client/app/common/views/components/welcome-timeline.vue
@@ -24,6 +24,13 @@
 import Vue from 'vue';
 
 export default Vue.extend({
+	props: {
+		max: {
+			type: Number,
+			required: false,
+			default: undefined
+		}
+	},
 	data() {
 		return {
 			fetching: true,
@@ -37,6 +44,7 @@ export default Vue.extend({
 		fetch(cb?) {
 			this.fetching = true;
 			(this as any).api('notes', {
+				limit: this.max,
 				local: true,
 				reply: false,
 				renote: false,
diff --git a/src/client/app/desktop/views/pages/welcome.vue b/src/client/app/desktop/views/pages/welcome.vue
index 2203efcc92..cac4007b40 100644
--- a/src/client/app/desktop/views/pages/welcome.vue
+++ b/src/client/app/desktop/views/pages/welcome.vue
@@ -7,6 +7,13 @@
 	</button>
 	<div class="body" :style="{ backgroundImage: `url('${ welcomeBgUrl }')` }">
 		<div class="container">
+			<div class="info">
+				<span>%i18n:common.misskey% <b>{{ host }}</b></span>
+				<span class="stats" v-if="stats">
+					<span>%fa:user% {{ stats.originalUsersCount | number }}</span>
+					<span>%fa:pencil-alt% {{ stats.originalNotesCount | number }}</span>
+				</span>
+			</div>
 			<main>
 				<div class="about">
 					<h1 v-if="name">{{ name }}</h1>
@@ -19,12 +26,8 @@
 					<mk-signin/>
 				</div>
 			</main>
-			<div class="info">
-				<span>%i18n:common.misskey% <b>{{ host }}</b></span>
-				<span class="stats" v-if="stats">
-					<span>%fa:user% {{ stats.originalUsersCount | number }}</span>
-					<span>%fa:pencil-alt% {{ stats.originalNotesCount | number }}</span>
-				</span>
+			<div class="hashtags">
+				<router-link v-for="tag in tags" :key="tag" :to="`/tags/${ tag }`" :title="tag">#{{ tag }}</router-link>
 			</div>
 			<mk-nav class="nav"/>
 		</div>
@@ -32,7 +35,7 @@
 		<img src="assets/title.dark.svg" alt="Misskey">
 	</div>
 	<div class="tl">
-		<mk-welcome-timeline/>
+		<mk-welcome-timeline :max="20"/>
 	</div>
 	<modal name="signup" width="500px" height="auto" scrollable>
 		<header :class="$style.signupFormHeader">%i18n:@signup%</header>
@@ -54,13 +57,18 @@ export default Vue.extend({
 			host,
 			name,
 			description,
-			pointerInterval: null
+			pointerInterval: null,
+			tags: []
 		};
 	},
 	created() {
 		(this as any).api('stats').then(stats => {
 			this.stats = stats;
 		});
+
+		(this as any).api('hashtags/trend').then(stats => {
+			this.tags = stats.map(x => x.tag);
+		});
 	},
 	mounted() {
 		this.point();
@@ -161,6 +169,20 @@ root(isDark)
 			$loginWidth = 340px
 			$width = $aboutWidth + $loginWidth
 
+			> .info
+				margin 0 auto 16px auto
+				width $width
+				font-size 14px
+				color #fff
+
+				> .stats
+					margin-left 16px
+					padding-left 16px
+					border-left solid 1px #fff
+
+					> *
+						margin-right 16px
+
 			> main
 				display flex
 				margin auto
@@ -201,22 +223,17 @@ root(isDark)
 					padding 16px 32px 32px 32px
 					background isDark ? #2e3440 : #f5f5f5
 
-			> .info
+			> .hashtags
 				margin 16px auto
-				padding 12px
 				width $width
 				font-size 14px
 				color #fff
-				background rgba(#000, 0.2)
+				background rgba(#000, 0.3)
 				border-radius 8px
 
-				> .stats
-					margin-left 16px
-					padding-left 16px
-					border-left solid 1px #fff
-
-					> *
-						margin-right 16px
+				> *
+					display inline-block
+					margin 14px
 
 			> .nav
 				display block
diff --git a/src/client/app/mobile/views/pages/welcome.vue b/src/client/app/mobile/views/pages/welcome.vue
index cd8f5841e7..feef2e8c6f 100644
--- a/src/client/app/mobile/views/pages/welcome.vue
+++ b/src/client/app/mobile/views/pages/welcome.vue
@@ -14,6 +14,9 @@
 		<div class="tl">
 			<mk-welcome-timeline/>
 		</div>
+		<div class="hashtags">
+			<router-link v-for="tag in tags" :key="tag" :to="`/tags/${ tag }`" :title="tag">#{{ tag }}</router-link>
+		</div>
 		<div class="stats" v-if="stats">
 			<span>%fa:user% {{ stats.originalUsersCount | number }}</span>
 			<span>%fa:pencil-alt% {{ stats.originalNotesCount | number }}</span>
@@ -37,13 +40,18 @@ export default Vue.extend({
 			stats: null,
 			host,
 			name,
-			description
+			description,
+			tags: []
 		};
 	},
 	created() {
 		(this as any).api('stats').then(stats => {
 			this.stats = stats;
 		});
+
+		(this as any).api('hashtags/trend').then(stats => {
+			this.tags = stats.map(x => x.tag);
+		});
 	}
 });
 </script>
@@ -116,12 +124,22 @@ export default Vue.extend({
 						box-shadow 0 1px 3px rgba(#000, 0.075), inset 0 0 5px rgba(#000, 0.2)
 
 		> .tl
+			margin 16px 0
+
 			> *
 				max-height 300px
 				border-radius 6px
 				overflow auto
 				-webkit-overflow-scrolling touch
 
+		> .hashtags
+			border solid 2px #ddd
+			border-radius 8px
+
+			> *
+				display inline-block
+				margin 16px
+
 		> .stats
 			margin 16px 0
 			padding 8px
diff --git a/src/server/api/endpoints.ts b/src/server/api/endpoints.ts
index a5d13b0237..f613710c80 100644
--- a/src/server/api/endpoints.ts
+++ b/src/server/api/endpoints.ts
@@ -629,8 +629,7 @@ const endpoints: Endpoint[] = [
 	},
 
 	{
-		name: 'hashtags/trend',
-		withCredential: true
+		name: 'hashtags/trend'
 	},
 
 	{