Merge pull request #1313 from akihikodaki/key

Replace /:user endpoints with /@:user

20 files changed, 63 insertions, 63 deletions

diff --git a/src/web/app/desktop/script.ts b/src/web/app/desktop/script.ts
index 2362613cdc..f2bcc6f8a6 100644
--- a/src/web/app/desktop/script.ts
+++ b/src/web/app/desktop/script.ts
@@ -83,8 +83,8 @@ init(async (launch) => {
 		{ path: '/search', component: MkSearch },
 		{ path: '/othello', component: MkOthello },
 		{ path: '/othello/:game', component: MkOthello },
-		{ path: '/:user', component: MkUser },
-		{ path: '/:user/:post', component: MkPost }
+		{ path: '/@:user', component: MkUser },
+		{ path: '/@:user/:post', component: MkPost }
 	]);
 }, true);
 
diff --git a/src/web/app/desktop/views/components/friends-maker.vue b/src/web/app/desktop/views/components/friends-maker.vue
index ab35efc75a..65adff7cec 100644
--- a/src/web/app/desktop/views/components/friends-maker.vue
+++ b/src/web/app/desktop/views/components/friends-maker.vue
@@ -3,11 +3,11 @@
 	<p class="title">気になるユーザーをフォロー:</p>
 	<div class="users" v-if="!fetching && users.length > 0">
 		<div class="user" v-for="user in users" :key="user.id">
-			<router-link class="avatar-anchor" :to="`/${user.username}`">
+			<router-link class="avatar-anchor" :to="`/@${user.username}`">
 				<img class="avatar" :src="`${user.avatar_url}?thumbnail&size=42`" alt="" v-user-preview="user.id"/>
 			</router-link>
 			<div class="body">
-				<router-link class="name" :to="`/${user.username}`" v-user-preview="user.id">{{ user.name }}</router-link>
+				<router-link class="name" :to="`/@${user.username}`" v-user-preview="user.id">{{ user.name }}</router-link>
 				<p class="username">@{{ user.username }}</p>
 			</div>
 			<mk-follow-button :user="user"/>
diff --git a/src/web/app/desktop/views/components/notifications.vue b/src/web/app/desktop/views/components/notifications.vue
index d61397d536..86cd1ba4f6 100644
--- a/src/web/app/desktop/views/components/notifications.vue
+++ b/src/web/app/desktop/views/components/notifications.vue
@@ -5,82 +5,82 @@
 			<div class="notification" :class="notification.type" :key="notification.id">
 				<mk-time :time="notification.created_at"/>
 				<template v-if="notification.type == 'reaction'">
-					<router-link class="avatar-anchor" :to="`/${notification.user.username}`" v-user-preview="notification.user.id">
+					<router-link class="avatar-anchor" :to="`/@${notification.user.username}`" v-user-preview="notification.user.id">
 						<img class="avatar" :src="`${notification.user.avatar_url}?thumbnail&size=48`" alt="avatar"/>
 					</router-link>
 					<div class="text">
 						<p>
 							<mk-reaction-icon :reaction="notification.reaction"/>
-							<router-link :to="`/${notification.user.username}`" v-user-preview="notification.user.id">{{ notification.user.name }}</router-link>
+							<router-link :to="`/@${notification.user.username}`" v-user-preview="notification.user.id">{{ notification.user.name }}</router-link>
 						</p>
-						<router-link class="post-ref" :to="`/${notification.post.user.username}/${notification.post.id}`">
+						<router-link class="post-ref" :to="`/@${notification.post.user.username}/${notification.post.id}`">
 							%fa:quote-left%{{ getPostSummary(notification.post) }}%fa:quote-right%
 						</router-link>
 					</div>
 				</template>
 				<template v-if="notification.type == 'repost'">
-					<router-link class="avatar-anchor" :to="`/${notification.post.user.username}`" v-user-preview="notification.post.user_id">
+					<router-link class="avatar-anchor" :to="`/@${notification.post.user.username}`" v-user-preview="notification.post.user_id">
 						<img class="avatar" :src="`${notification.post.user.avatar_url}?thumbnail&size=48`" alt="avatar"/>
 					</router-link>
 					<div class="text">
 						<p>%fa:retweet%
-							<router-link :to="`/${notification.post.user.username}`" v-user-preview="notification.post.user_id">{{ notification.post.user.name }}</router-link>
+							<router-link :to="`/@${notification.post.user.username}`" v-user-preview="notification.post.user_id">{{ notification.post.user.name }}</router-link>
 						</p>
-						<router-link class="post-ref" :to="`/${notification.post.user.username}/${notification.post.id}`">
+						<router-link class="post-ref" :to="`/@${notification.post.user.username}/${notification.post.id}`">
 							%fa:quote-left%{{ getPostSummary(notification.post.repost) }}%fa:quote-right%
 						</router-link>
 					</div>
 				</template>
 				<template v-if="notification.type == 'quote'">
-					<router-link class="avatar-anchor" :to="`/${notification.post.user.username}`" v-user-preview="notification.post.user_id">
+					<router-link class="avatar-anchor" :to="`/@${notification.post.user.username}`" v-user-preview="notification.post.user_id">
 						<img class="avatar" :src="`${notification.post.user.avatar_url}?thumbnail&size=48`" alt="avatar"/>
 					</router-link>
 					<div class="text">
 						<p>%fa:quote-left%
-							<router-link :to="`/${notification.post.user.username}`" v-user-preview="notification.post.user_id">{{ notification.post.user.name }}</router-link>
+							<router-link :to="`/@${notification.post.user.username}`" v-user-preview="notification.post.user_id">{{ notification.post.user.name }}</router-link>
 						</p>
-						<router-link class="post-preview" :to="`/${notification.post.user.username}/${notification.post.id}`">{{ getPostSummary(notification.post) }}</router-link>
+						<router-link class="post-preview" :to="`/@${notification.post.user.username}/${notification.post.id}`">{{ getPostSummary(notification.post) }}</router-link>
 					</div>
 				</template>
 				<template v-if="notification.type == 'follow'">
-					<router-link class="avatar-anchor" :to="`/${notification.user.username}`" v-user-preview="notification.user.id">
+					<router-link class="avatar-anchor" :to="`/@${notification.user.username}`" v-user-preview="notification.user.id">
 						<img class="avatar" :src="`${notification.user.avatar_url}?thumbnail&size=48`" alt="avatar"/>
 					</router-link>
 					<div class="text">
 						<p>%fa:user-plus%
-							<router-link :to="`/${notification.user.username}`" v-user-preview="notification.user.id">{{ notification.user.name }}</router-link>
+							<router-link :to="`/@${notification.user.username}`" v-user-preview="notification.user.id">{{ notification.user.name }}</router-link>
 						</p>
 					</div>
 				</template>
 				<template v-if="notification.type == 'reply'">
-					<router-link class="avatar-anchor" :to="`/${notification.post.user.username}`" v-user-preview="notification.post.user_id">
+					<router-link class="avatar-anchor" :to="`/@${notification.post.user.username}`" v-user-preview="notification.post.user_id">
 						<img class="avatar" :src="`${notification.post.user.avatar_url}?thumbnail&size=48`" alt="avatar"/>
 					</router-link>
 					<div class="text">
 						<p>%fa:reply%
-							<router-link :to="`/${notification.post.user.username}`" v-user-preview="notification.post.user_id">{{ notification.post.user.name }}</router-link>
+							<router-link :to="`/@${notification.post.user.username}`" v-user-preview="notification.post.user_id">{{ notification.post.user.name }}</router-link>
 						</p>
-						<router-link class="post-preview" :to="`/${notification.post.user.username}/${notification.post.id}`">{{ getPostSummary(notification.post) }}</router-link>
+						<router-link class="post-preview" :to="`/@${notification.post.user.username}/${notification.post.id}`">{{ getPostSummary(notification.post) }}</router-link>
 					</div>
 				</template>
 				<template v-if="notification.type == 'mention'">
-					<router-link class="avatar-anchor" :to="`/${notification.post.user.username}`" v-user-preview="notification.post.user_id">
+					<router-link class="avatar-anchor" :to="`/@${notification.post.user.username}`" v-user-preview="notification.post.user_id">
 						<img class="avatar" :src="`${notification.post.user.avatar_url}?thumbnail&size=48`" alt="avatar"/>
 					</router-link>
 					<div class="text">
 						<p>%fa:at%
-							<router-link :to="`/${notification.post.user.username}`" v-user-preview="notification.post.user_id">{{ notification.post.user.name }}</router-link>
+							<router-link :to="`/@${notification.post.user.username}`" v-user-preview="notification.post.user_id">{{ notification.post.user.name }}</router-link>
 						</p>
-						<a class="post-preview" :href="`/${notification.post.user.username}/${notification.post.id}`">{{ getPostSummary(notification.post) }}</a>
+						<a class="post-preview" :href="`/@${notification.post.user.username}/${notification.post.id}`">{{ getPostSummary(notification.post) }}</a>
 					</div>
 				</template>
 				<template v-if="notification.type == 'poll_vote'">
-					<router-link class="avatar-anchor" :to="`/${notification.user.username}`" v-user-preview="notification.user.id">
+					<router-link class="avatar-anchor" :to="`/@${notification.user.username}`" v-user-preview="notification.user.id">
 						<img class="avatar" :src="`${notification.user.avatar_url}?thumbnail&size=48`" alt="avatar"/>
 					</router-link>
 					<div class="text">
-						<p>%fa:chart-pie%<a :href="`/${notification.user.username}`" v-user-preview="notification.user.id">{{ notification.user.name }}</a></p>
-						<router-link class="post-ref" :to="`/${notification.post.user.username}/${notification.post.id}`">
+						<p>%fa:chart-pie%<a :href="`/@${notification.user.username}`" v-user-preview="notification.user.id">{{ notification.user.name }}</a></p>
+						<router-link class="post-ref" :to="`/@${notification.post.user.username}/${notification.post.id}`">
 							%fa:quote-left%{{ getPostSummary(notification.post) }}%fa:quote-right%
 						</router-link>
 					</div>
diff --git a/src/web/app/desktop/views/components/post-detail.sub.vue b/src/web/app/desktop/views/components/post-detail.sub.vue
index c35a07d7ca..53fc724fc6 100644
--- a/src/web/app/desktop/views/components/post-detail.sub.vue
+++ b/src/web/app/desktop/views/components/post-detail.sub.vue
@@ -1,16 +1,16 @@
 <template>
 <div class="sub" :title="title">
-	<router-link class="avatar-anchor" :to="`/${post.user.username}`">
+	<router-link class="avatar-anchor" :to="`/@${post.user.username}`">
 		<img class="avatar" :src="`${post.user.avatar_url}?thumbnail&size=64`" alt="avatar" v-user-preview="post.user_id"/>
 	</router-link>
 	<div class="main">
 		<header>
 			<div class="left">
-				<router-link class="name" :to="`/${post.user.username}`" v-user-preview="post.user_id">{{ post.user.name }}</router-link>
+				<router-link class="name" :to="`/@${post.user.username}`" v-user-preview="post.user_id">{{ post.user.name }}</router-link>
 				<span class="username">@{{ post.user.username }}</span>
 			</div>
 			<div class="right">
-				<router-link class="time" :to="`/${post.user.username}/${post.id}`">
+				<router-link class="time" :to="`/@${post.user.username}/${post.id}`">
 					<mk-time :time="post.created_at"/>
 				</router-link>
 			</div>
diff --git a/src/web/app/desktop/views/components/post-detail.vue b/src/web/app/desktop/views/components/post-detail.vue
index 5845ab4f8f..9a8958679c 100644
--- a/src/web/app/desktop/views/components/post-detail.vue
+++ b/src/web/app/desktop/views/components/post-detail.vue
@@ -18,22 +18,22 @@
 	</div>
 	<div class="repost" v-if="isRepost">
 		<p>
-			<router-link class="avatar-anchor" :to="`/${post.user.username}`" v-user-preview="post.user_id">
+			<router-link class="avatar-anchor" :to="`/@${post.user.username}`" v-user-preview="post.user_id">
 				<img class="avatar" :src="`${post.user.avatar_url}?thumbnail&size=32`" alt="avatar"/>
 			</router-link>
 			%fa:retweet%
-			<router-link class="name" :href="`/${post.user.username}`">{{ post.user.name }}</router-link>
+			<router-link class="name" :href="`/@${post.user.username}`">{{ post.user.name }}</router-link>
 			がRepost
 		</p>
 	</div>
 	<article>
-		<router-link class="avatar-anchor" :to="`/${p.user.username}`">
+		<router-link class="avatar-anchor" :to="`/@${p.user.username}`">
 			<img class="avatar" :src="`${p.user.avatar_url}?thumbnail&size=64`" alt="avatar" v-user-preview="p.user.id"/>
 		</router-link>
 		<header>
-			<router-link class="name" :to="`/${p.user.username}`" v-user-preview="p.user.id">{{ p.user.name }}</router-link>
+			<router-link class="name" :to="`/@${p.user.username}`" v-user-preview="p.user.id">{{ p.user.name }}</router-link>
 			<span class="username">@{{ p.user.username }}</span>
-			<router-link class="time" :to="`/${p.user.username}/${p.id}`">
+			<router-link class="time" :to="`/@${p.user.username}/${p.id}`">
 				<mk-time :time="p.created_at"/>
 			</router-link>
 		</header>
diff --git a/src/web/app/desktop/views/components/post-preview.vue b/src/web/app/desktop/views/components/post-preview.vue
index ec3372f908..edb593457e 100644
--- a/src/web/app/desktop/views/components/post-preview.vue
+++ b/src/web/app/desktop/views/components/post-preview.vue
@@ -1,13 +1,13 @@
 <template>
 <div class="mk-post-preview" :title="title">
-	<router-link class="avatar-anchor" :to="`/${post.user.username}`">
+	<router-link class="avatar-anchor" :to="`/@${post.user.username}`">
 		<img class="avatar" :src="`${post.user.avatar_url}?thumbnail&size=64`" alt="avatar" v-user-preview="post.user_id"/>
 	</router-link>
 	<div class="main">
 		<header>
-			<router-link class="name" :to="`/${post.user.username}`" v-user-preview="post.user_id">{{ post.user.name }}</router-link>
+			<router-link class="name" :to="`/@${post.user.username}`" v-user-preview="post.user_id">{{ post.user.name }}</router-link>
 			<span class="username">@{{ post.user.username }}</span>
-			<router-link class="time" :to="`/${post.user.username}/${post.id}`">
+			<router-link class="time" :to="`/@${post.user.username}/${post.id}`">
 				<mk-time :time="post.created_at"/>
 			</router-link>
 		</header>
diff --git a/src/web/app/desktop/views/components/posts.post.sub.vue b/src/web/app/desktop/views/components/posts.post.sub.vue
index 69c88fed50..2fd8a9865f 100644
--- a/src/web/app/desktop/views/components/posts.post.sub.vue
+++ b/src/web/app/desktop/views/components/posts.post.sub.vue
@@ -1,13 +1,13 @@
 <template>
 <div class="sub" :title="title">
-	<router-link class="avatar-anchor" :to="`/${post.user.username}`">
+	<router-link class="avatar-anchor" :to="`/@${post.user.username}`">
 		<img class="avatar" :src="`${post.user.avatar_url}?thumbnail&size=64`" alt="avatar" v-user-preview="post.user_id"/>
 	</router-link>
 	<div class="main">
 		<header>
-			<router-link class="name" :to="`/${post.user.username}`" v-user-preview="post.user_id">{{ post.user.name }}</router-link>
+			<router-link class="name" :to="`/@${post.user.username}`" v-user-preview="post.user_id">{{ post.user.name }}</router-link>
 			<span class="username">@{{ post.user.username }}</span>
-			<router-link class="created-at" :to="`/${post.user.username}/${post.id}`">
+			<router-link class="created-at" :to="`/@${post.user.username}/${post.id}`">
 				<mk-time :time="post.created_at"/>
 			</router-link>
 		</header>
diff --git a/src/web/app/desktop/views/components/posts.post.vue b/src/web/app/desktop/views/components/posts.post.vue
index 71cbbc68d2..a525900b95 100644
--- a/src/web/app/desktop/views/components/posts.post.vue
+++ b/src/web/app/desktop/views/components/posts.post.vue
@@ -5,23 +5,23 @@
 	</div>
 	<div class="repost" v-if="isRepost">
 		<p>
-			<router-link class="avatar-anchor" :to="`/${post.user.username}`" v-user-preview="post.user_id">
+			<router-link class="avatar-anchor" :to="`/@${post.user.username}`" v-user-preview="post.user_id">
 				<img class="avatar" :src="`${post.user.avatar_url}?thumbnail&size=32`" alt="avatar"/>
 			</router-link>
 			%fa:retweet%
 			<span>{{ '%i18n:desktop.tags.mk-timeline-post.reposted-by%'.substr(0, '%i18n:desktop.tags.mk-timeline-post.reposted-by%'.indexOf('{')) }}</span>
-			<a class="name" :href="`/${post.user.username}`" v-user-preview="post.user_id">{{ post.user.name }}</a>
+			<a class="name" :href="`/@${post.user.username}`" v-user-preview="post.user_id">{{ post.user.name }}</a>
 			<span>{{ '%i18n:desktop.tags.mk-timeline-post.reposted-by%'.substr('%i18n:desktop.tags.mk-timeline-post.reposted-by%'.indexOf('}') + 1) }}</span>
 		</p>
 		<mk-time :time="post.created_at"/>
 	</div>
 	<article>
-		<router-link class="avatar-anchor" :to="`/${p.user.username}`">
+		<router-link class="avatar-anchor" :to="`/@${p.user.username}`">
 			<img class="avatar" :src="`${p.user.avatar_url}?thumbnail&size=64`" alt="avatar" v-user-preview="p.user.id"/>
 		</router-link>
 		<div class="main">
 			<header>
-				<router-link class="name" :to="`/${p.user.username}`" v-user-preview="p.user.id">{{ p.user.name }}</router-link>
+				<router-link class="name" :to="`/@${p.user.username}`" v-user-preview="p.user.id">{{ p.user.name }}</router-link>
 				<span class="is-bot" v-if="p.user.account.is_bot">bot</span>
 				<span class="username">@{{ p.user.username }}</span>
 				<div class="info">
@@ -135,7 +135,7 @@ export default Vue.extend({
 			return dateStringify(this.p.created_at);
 		},
 		url(): string {
-			return `/${this.p.user.username}/${this.p.id}`;
+			return `/@${this.p.user.username}/${this.p.id}`;
 		},
 		urls(): string[] {
 			if (this.p.ast) {
diff --git a/src/web/app/desktop/views/components/ui.header.account.vue b/src/web/app/desktop/views/components/ui.header.account.vue
index 2cc2c1867f..19b9d77798 100644
--- a/src/web/app/desktop/views/components/ui.header.account.vue
+++ b/src/web/app/desktop/views/components/ui.header.account.vue
@@ -8,7 +8,7 @@
 		<div class="menu" v-if="isOpen">
 			<ul>
 				<li>
-					<router-link :to="`/${ os.i.username }`">%fa:user%%i18n:desktop.tags.mk-ui-header-account.profile%%fa:angle-right%</router-link>
+					<router-link :to="`/@${ os.i.username }`">%fa:user%%i18n:desktop.tags.mk-ui-header-account.profile%%fa:angle-right%</router-link>
 				</li>
 				<li @click="drive">
 					<p>%fa:cloud%%i18n:desktop.tags.mk-ui-header-account.drive%%fa:angle-right%</p>
diff --git a/src/web/app/desktop/views/components/user-preview.vue b/src/web/app/desktop/views/components/user-preview.vue
index cfb95961da..ffc959fac5 100644
--- a/src/web/app/desktop/views/components/user-preview.vue
+++ b/src/web/app/desktop/views/components/user-preview.vue
@@ -2,11 +2,11 @@
 <div class="mk-user-preview">
 	<template v-if="u != null">
 		<div class="banner" :style="u.banner_url ? `background-image: url(${u.banner_url}?thumbnail&size=512)` : ''"></div>
-		<router-link class="avatar" :to="`/${u.username}`">
+		<router-link class="avatar" :to="`/@${u.username}`">
 			<img :src="`${u.avatar_url}?thumbnail&size=64`" alt="avatar"/>
 		</router-link>
 		<div class="title">
-			<router-link class="name" :to="`/${u.username}`">{{ u.name }}</router-link>
+			<router-link class="name" :to="`/@${u.username}`">{{ u.name }}</router-link>
 			<p class="username">@{{ u.username }}</p>
 		</div>
 		<div class="description">{{ u.description }}</div>
diff --git a/src/web/app/desktop/views/components/users-list.item.vue b/src/web/app/desktop/views/components/users-list.item.vue
index 374f55b410..2d1e133473 100644
--- a/src/web/app/desktop/views/components/users-list.item.vue
+++ b/src/web/app/desktop/views/components/users-list.item.vue
@@ -1,11 +1,11 @@
 <template>
 <div class="root item">
-	<router-link class="avatar-anchor" :to="`/${user.username}`" v-user-preview="user.id">
+	<router-link class="avatar-anchor" :to="`/@${user.username}`" v-user-preview="user.id">
 		<img class="avatar" :src="`${user.avatar_url}?thumbnail&size=64`" alt="avatar"/>
 	</router-link>
 	<div class="main">
 		<header>
-			<router-link class="name" :to="`/${user.username}`" v-user-preview="user.id">{{ user.name }}</router-link>
+			<router-link class="name" :to="`/@${user.username}`" v-user-preview="user.id">{{ user.name }}</router-link>
 			<span class="username">@{{ user.username }}</span>
 		</header>
 		<div class="body">
diff --git a/src/web/app/desktop/views/pages/user/user.followers-you-know.vue b/src/web/app/desktop/views/pages/user/user.followers-you-know.vue
index 015b12d3d4..20675c454e 100644
--- a/src/web/app/desktop/views/pages/user/user.followers-you-know.vue
+++ b/src/web/app/desktop/views/pages/user/user.followers-you-know.vue
@@ -3,7 +3,7 @@
 	<p class="title">%fa:users%%i18n:desktop.tags.mk-user.followers-you-know.title%</p>
 	<p class="initializing" v-if="fetching">%fa:spinner .pulse .fw%%i18n:desktop.tags.mk-user.followers-you-know.loading%<mk-ellipsis/></p>
 	<div v-if="!fetching && users.length > 0">
-	<router-link v-for="user in users" :to="`/${user.username}`" :key="user.id">
+	<router-link v-for="user in users" :to="`/@${user.username}`" :key="user.id">
 		<img :src="`${user.avatar_url}?thumbnail&size=64`" :alt="user.name" v-user-preview="user.id"/>
 	</router-link>
 	</div>
diff --git a/src/web/app/desktop/views/pages/user/user.friends.vue b/src/web/app/desktop/views/pages/user/user.friends.vue
index d27009a82d..a60020f59a 100644
--- a/src/web/app/desktop/views/pages/user/user.friends.vue
+++ b/src/web/app/desktop/views/pages/user/user.friends.vue
@@ -4,11 +4,11 @@
 	<p class="initializing" v-if="fetching">%fa:spinner .pulse .fw%%i18n:desktop.tags.mk-user.frequently-replied-users.loading%<mk-ellipsis/></p>
 	<template v-if="!fetching && users.length != 0">
 		<div class="user" v-for="friend in users">
-			<router-link class="avatar-anchor" :to="`/${friend.username}`">
+			<router-link class="avatar-anchor" :to="`/@${friend.username}`">
 				<img class="avatar" :src="`${friend.avatar_url}?thumbnail&size=42`" alt="" v-user-preview="friend.id"/>
 			</router-link>
 			<div class="body">
-				<router-link class="name" :to="`/${friend.username}`" v-user-preview="friend.id">{{ friend.name }}</router-link>
+				<router-link class="name" :to="`/@${friend.username}`" v-user-preview="friend.id">{{ friend.name }}</router-link>
 				<p class="username">@{{ friend.username }}</p>
 			</div>
 			<mk-follow-button :user="friend"/>
diff --git a/src/web/app/desktop/views/pages/user/user.header.vue b/src/web/app/desktop/views/pages/user/user.header.vue
index 63542055d9..e60b312ca8 100644
--- a/src/web/app/desktop/views/pages/user/user.header.vue
+++ b/src/web/app/desktop/views/pages/user/user.header.vue
@@ -12,9 +12,9 @@
 			<p class="location" v-if="user.account.profile.location">%fa:map-marker%{{ user.account.profile.location }}</p>
 		</div>
 		<footer>
-			<router-link :to="`/${user.username}`" :data-active="$parent.page == 'home'">%fa:home%概要</router-link>
-			<router-link :to="`/${user.username}/media`" :data-active="$parent.page == 'media'">%fa:image%メディア</router-link>
-			<router-link :to="`/${user.username}/graphs`" :data-active="$parent.page == 'graphs'">%fa:chart-bar%グラフ</router-link>
+			<router-link :to="`/@${user.username}`" :data-active="$parent.page == 'home'">%fa:home%概要</router-link>
+			<router-link :to="`/@${user.username}/media`" :data-active="$parent.page == 'media'">%fa:image%メディア</router-link>
+			<router-link :to="`/@${user.username}/graphs`" :data-active="$parent.page == 'graphs'">%fa:chart-bar%グラフ</router-link>
 		</footer>
 	</div>
 </div>
diff --git a/src/web/app/desktop/views/pages/welcome.vue b/src/web/app/desktop/views/pages/welcome.vue
index ad1dccae97..c514500b2d 100644
--- a/src/web/app/desktop/views/pages/welcome.vue
+++ b/src/web/app/desktop/views/pages/welcome.vue
@@ -8,7 +8,7 @@
 					<p>ようこそ！ <b>Misskey</b>はTwitter風ミニブログSNSです。思ったことや皆と共有したいことを投稿しましょう。タイムラインを見れば、皆の関心事をすぐにチェックすることもできます。<a :href="aboutUrl">詳しく...</a></p>
 					<p><button class="signup" @click="signup">はじめる</button><button class="signin" @click="signin">ログイン</button></p>
 					<div class="users">
-						<router-link v-for="user in users" :key="user.id" class="avatar-anchor" :to="`/${user.username}`" v-user-preview="user.id">
+						<router-link v-for="user in users" :key="user.id" class="avatar-anchor" :to="`/@${user.username}`" v-user-preview="user.id">
 							<img class="avatar" :src="`${user.avatar_url}?thumbnail&size=64`" alt="avatar"/>
 						</router-link>
 					</div>
diff --git a/src/web/app/desktop/views/widgets/channel.channel.post.vue b/src/web/app/desktop/views/widgets/channel.channel.post.vue
index faaf0fb731..b2fa92ad43 100644
--- a/src/web/app/desktop/views/widgets/channel.channel.post.vue
+++ b/src/web/app/desktop/views/widgets/channel.channel.post.vue
@@ -2,7 +2,7 @@
 <div class="post">
 	<header>
 		<a class="index" @click="reply">{{ post.index }}:</a>
-		<router-link class="name" :to="`/${post.user.username}`" v-user-preview="post.user.id"><b>{{ post.user.name }}</b></router-link>
+		<router-link class="name" :to="`/@${post.user.username}`" v-user-preview="post.user.id"><b>{{ post.user.name }}</b></router-link>
 		<span>ID:<i>{{ post.user.username }}</i></span>
 	</header>
 	<div>
diff --git a/src/web/app/desktop/views/widgets/polls.vue b/src/web/app/desktop/views/widgets/polls.vue
index fda4e17d87..636378d0bb 100644
--- a/src/web/app/desktop/views/widgets/polls.vue
+++ b/src/web/app/desktop/views/widgets/polls.vue
@@ -5,8 +5,8 @@
 		<button @click="fetch" title="%i18n:desktop.tags.mk-recommended-polls-home-widget.refresh%">%fa:sync%</button>
 	</template>
 	<div class="poll" v-if="!fetching && poll != null">
-		<p v-if="poll.text"><router-link to="`/${ poll.user.username }/${ poll.id }`">{{ poll.text }}</router-link></p>
-		<p v-if="!poll.text"><router-link to="`/${ poll.user.username }/${ poll.id }`">%fa:link%</router-link></p>
+		<p v-if="poll.text"><router-link to="`/@${ poll.user.username }/${ poll.id }`">{{ poll.text }}</router-link></p>
+		<p v-if="!poll.text"><router-link to="`/@${ poll.user.username }/${ poll.id }`">%fa:link%</router-link></p>
 		<mk-poll :post="poll"/>
 	</div>
 	<p class="empty" v-if="!fetching && poll == null">%i18n:desktop.tags.mk-recommended-polls-home-widget.nothing%</p>
diff --git a/src/web/app/desktop/views/widgets/profile.vue b/src/web/app/desktop/views/widgets/profile.vue
index e067a0eb24..3940106197 100644
--- a/src/web/app/desktop/views/widgets/profile.vue
+++ b/src/web/app/desktop/views/widgets/profile.vue
@@ -15,7 +15,7 @@
 		title="クリックでアバター編集"
 		v-user-preview="os.i.id"
 	/>
-	<router-link class="name" :to="`/${os.i.username}`">{{ os.i.name }}</router-link>
+	<router-link class="name" :to="`/@${os.i.username}`">{{ os.i.name }}</router-link>
 	<p class="username">@{{ os.i.username }}</p>
 </div>
 </template>
diff --git a/src/web/app/desktop/views/widgets/trends.vue b/src/web/app/desktop/views/widgets/trends.vue
index 09cad9ba4a..c006c811d6 100644
--- a/src/web/app/desktop/views/widgets/trends.vue
+++ b/src/web/app/desktop/views/widgets/trends.vue
@@ -6,8 +6,8 @@
 	</template>
 	<p class="fetching" v-if="fetching">%fa:spinner .pulse .fw%%i18n:common.loading%<mk-ellipsis/></p>
 	<div class="post" v-else-if="post != null">
-		<p class="text"><router-link :to="`/${ post.user.username }/${ post.id }`">{{ post.text }}</router-link></p>
-		<p class="author">―<router-link :to="`/${ post.user.username }`">@{{ post.user.username }}</router-link></p>
+		<p class="text"><router-link :to="`/@${ post.user.username }/${ post.id }`">{{ post.text }}</router-link></p>
+		<p class="author">―<router-link :to="`/@${ post.user.username }`">@{{ post.user.username }}</router-link></p>
 	</div>
 	<p class="empty" v-else>%i18n:desktop.tags.mk-trends-home-widget.nothing%</p>
 </div>
diff --git a/src/web/app/desktop/views/widgets/users.vue b/src/web/app/desktop/views/widgets/users.vue
index f7af8205ec..c0a85a08e2 100644
--- a/src/web/app/desktop/views/widgets/users.vue
+++ b/src/web/app/desktop/views/widgets/users.vue
@@ -7,11 +7,11 @@
 	<p class="fetching" v-if="fetching">%fa:spinner .pulse .fw%%i18n:common.loading%<mk-ellipsis/></p>
 	<template v-else-if="users.length != 0">
 		<div class="user" v-for="_user in users">
-			<router-link class="avatar-anchor" :to="`/${_user.username}`">
+			<router-link class="avatar-anchor" :to="`/@${_user.username}`">
 				<img class="avatar" :src="`${_user.avatar_url}?thumbnail&size=42`" alt="" v-user-preview="_user.id"/>
 			</router-link>
 			<div class="body">
-				<router-link class="name" :to="`/${_user.username}`" v-user-preview="_user.id">{{ _user.name }}</router-link>
+				<router-link class="name" :to="`/@${_user.username}`" v-user-preview="_user.id">{{ _user.name }}</router-link>
 				<p class="username">@{{ _user.username }}</p>
 			</div>
 			<mk-follow-button :user="_user"/>