Implement remote account resolution

This commit is contained in:
Akihiko Odaki 2018-03-27 16:51:12 +09:00
parent bee892d446
commit 68ce6d5748
73 changed files with 735 additions and 334 deletions

View file

@ -3,12 +3,12 @@
<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="`/@${getAcct(user)}`">
<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>
<p class="username">@{{ user.username }}</p>
<router-link class="name" :to="`/@${getAcct(user)}`" v-user-preview="user.id">{{ user.name }}</router-link>
<p class="username">@{{ getAcct(user) }}</p>
</div>
<mk-follow-button :user="user"/>
</div>
@ -22,6 +22,8 @@
<script lang="ts">
import Vue from 'vue';
import getAcct from '../../../../../common/user/get-acct';
export default Vue.extend({
data() {
return {
@ -35,6 +37,7 @@ export default Vue.extend({
this.fetch();
},
methods: {
getAcct,
fetch() {
this.fetching = true;
this.users = [];

View file

@ -8,12 +8,13 @@
<script lang="ts">
import Vue from 'vue';
import { url } from '../../../config';
import getAcct from '../../../../../common/user/get-acct';
export default Vue.extend({
props: ['user'],
computed: {
popout(): string {
return `${url}/i/messaging/${this.user.username}`;
return `${url}/i/messaging/${getAcct(this.user)}`;
}
}
});

View file

@ -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="`/@${getAcct(notification.user)}`" 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="`/@${getAcct(notification.user)}`" 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="`/@${getAcct(notification.post.user)}/${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="`/@${getAcct(notification.post.user)}`" 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="`/@${getAcct(notification.post.user)}`" 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="`/@${getAcct(notification.post.user)}/${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="`/@${getAcct(notification.post.user)}`" 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="`/@${getAcct(notification.post.user)}`" 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="`/@${getAcct(notification.post.user)}/${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="`/@${getAcct(notification.user)}`" 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="`/@${getAcct(notification.user)}`" 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="`/@${getAcct(notification.post.user)}`" 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="`/@${getAcct(notification.post.user)}`" 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="`/@${getAcct(notification.post.user)}/${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="`/@${getAcct(notification.post.user)}`" 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="`/@${getAcct(notification.post.user)}`" 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="`/@${getAcct(notification.post.user)}/${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="`/@${getAcct(notification.user)}`" 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="`/@${getAcct(notification.user)}`" v-user-preview="notification.user.id">{{ notification.user.name }}</a></p>
<router-link class="post-ref" :to="`/@${getAcct(notification.post.user)}/${notification.post.id}`">
%fa:quote-left%{{ getPostSummary(notification.post) }}%fa:quote-right%
</router-link>
</div>
@ -102,6 +102,7 @@
<script lang="ts">
import Vue from 'vue';
import getAcct from '../../../../../common/user/get-acct';
import getPostSummary from '../../../../../common/get-post-summary';
export default Vue.extend({
@ -152,6 +153,7 @@ export default Vue.extend({
(this as any).os.stream.dispose(this.connectionId);
},
methods: {
getAcct,
fetchMoreNotifications() {
this.fetchingMoreNotifications = true;

View file

@ -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="`/@${acct}`">
<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>
<span class="username">@{{ post.user.username }}</span>
<router-link class="name" :to="`/@${acct}`" v-user-preview="post.user_id">{{ post.user.name }}</router-link>
<span class="username">@{{ acct }}</span>
</div>
<div class="right">
<router-link class="time" :to="`/@${post.user.username}/${post.id}`">
<router-link class="time" :to="`/@${acct}/${post.id}`">
<mk-time :time="post.created_at"/>
</router-link>
</div>
@ -28,10 +28,14 @@
<script lang="ts">
import Vue from 'vue';
import dateStringify from '../../../common/scripts/date-stringify';
import getAcct from '../../../../../common/user/get-acct';
export default Vue.extend({
props: ['post'],
computed: {
acct() {
return getAcct(this.post.user);
},
title(): string {
return dateStringify(this.post.created_at);
}

View file

@ -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="`/@${acct}`" 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="`/@${acct}`">{{ post.user.name }}</router-link>
がRepost
</p>
</div>
<article>
<router-link class="avatar-anchor" :to="`/@${p.user.username}`">
<router-link class="avatar-anchor" :to="`/@${acct}`">
<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>
<span class="username">@{{ p.user.username }}</span>
<router-link class="time" :to="`/@${p.user.username}/${p.id}`">
<router-link class="name" :to="`/@${acct}`" v-user-preview="p.user.id">{{ p.user.name }}</router-link>
<span class="username">@{{ acct }}</span>
<router-link class="time" :to="`/@${acct}/${p.id}`">
<mk-time :time="p.created_at"/>
</router-link>
</header>
@ -78,6 +78,7 @@
<script lang="ts">
import Vue from 'vue';
import dateStringify from '../../../common/scripts/date-stringify';
import getAcct from '../../../../../common/user/get-acct';
import MkPostFormWindow from './post-form-window.vue';
import MkRepostFormWindow from './repost-form-window.vue';
@ -98,6 +99,11 @@ export default Vue.extend({
default: false
}
},
computed: {
acct() {
return getAcct(this.post.user);
}
},
data() {
return {
context: [],

View file

@ -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="`/@${acct}`">
<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>
<span class="username">@{{ post.user.username }}</span>
<router-link class="time" :to="`/@${post.user.username}/${post.id}`">
<router-link class="name" :to="`/@${acct}`" v-user-preview="post.user_id">{{ post.user.name }}</router-link>
<span class="username">@{{ acct }}</span>
<router-link class="time" :to="`/@${acct}/${post.id}`">
<mk-time :time="post.created_at"/>
</router-link>
</header>
@ -21,10 +21,14 @@
<script lang="ts">
import Vue from 'vue';
import dateStringify from '../../../common/scripts/date-stringify';
import getAcct from '../../../../../common/user/get-acct';
export default Vue.extend({
props: ['post'],
computed: {
acct() {
return getAcct(this.post.user);
},
title(): string {
return dateStringify(this.post.created_at);
}

View file

@ -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="`/@${acct}`">
<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>
<span class="username">@{{ post.user.username }}</span>
<router-link class="created-at" :to="`/@${post.user.username}/${post.id}`">
<router-link class="name" :to="`/@${acct}`" v-user-preview="post.user_id">{{ post.user.name }}</router-link>
<span class="username">@{{ acct }}</span>
<router-link class="created-at" :to="`/@${acct}/${post.id}`">
<mk-time :time="post.created_at"/>
</router-link>
</header>
@ -21,10 +21,14 @@
<script lang="ts">
import Vue from 'vue';
import dateStringify from '../../../common/scripts/date-stringify';
import getAcct from '../../../../../common/user/get-acct';
export default Vue.extend({
props: ['post'],
computed: {
acct() {
return getAcct(this.post.user);
},
title(): string {
return dateStringify(this.post.created_at);
}

View file

@ -5,25 +5,25 @@
</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="`/@${acct}`" 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="`/@${acct}`" 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="`/@${acct}`">
<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>
<span class="is-bot" v-if="p.user.account.is_bot">bot</span>
<span class="username">@{{ p.user.username }}</span>
<router-link class="name" :to="`/@${acct}`" v-user-preview="p.user.id">{{ acct }}</router-link>
<span class="is-bot" v-if="p.user.host === null && p.user.account.is_bot">bot</span>
<span class="username">@{{ acct }}</span>
<div class="info">
<span class="app" v-if="p.app">via <b>{{ p.app.name }}</b></span>
<span class="mobile" v-if="p.via_mobile">%fa:mobile-alt%</span>
@ -85,6 +85,7 @@
<script lang="ts">
import Vue from 'vue';
import dateStringify from '../../../common/scripts/date-stringify';
import getAcct from '../../../../../common/user/get-acct';
import MkPostFormWindow from './post-form-window.vue';
import MkRepostFormWindow from './repost-form-window.vue';
import MkPostMenu from '../../../common/views/components/post-menu.vue';
@ -115,6 +116,9 @@ export default Vue.extend({
};
},
computed: {
acct() {
return getAcct(this.p.user);
},
isRepost(): boolean {
return (this.post.repost &&
this.post.text == null &&
@ -135,7 +139,7 @@ export default Vue.extend({
return dateStringify(this.p.created_at);
},
url(): string {
return `/@${this.p.user.username}/${this.p.id}`;
return `/@${this.acct}/${this.p.id}`;
},
urls(): string[] {
if (this.p.ast) {

View file

@ -5,7 +5,7 @@
</div>
<div class="users" v-if="users.length != 0">
<div v-for="user in users" :key="user.id">
<p><b>{{ user.name }}</b> @{{ user.username }}</p>
<p><b>{{ user.name }}</b> @{{ getAcct(user) }}</p>
</div>
</div>
</div>
@ -13,6 +13,7 @@
<script lang="ts">
import Vue from 'vue';
import getAcct from '../../../../../common/user/get-acct';
export default Vue.extend({
data() {
@ -21,6 +22,9 @@ export default Vue.extend({
users: []
};
},
methods: {
getAcct
},
mounted() {
(this as any).api('mute/list').then(x => {
this.users = x.users;

View file

@ -2,12 +2,12 @@
<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="`/@${acct}`">
<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>
<p class="username">@{{ u.username }}</p>
<router-link class="name" :to="`/@${acct}`">{{ u.name }}</router-link>
<p class="username">@{{ acct }}</p>
</div>
<div class="description">{{ u.description }}</div>
<div class="status">
@ -29,6 +29,8 @@
<script lang="ts">
import Vue from 'vue';
import * as anime from 'animejs';
import getAcct from '../../../../../common/user/get-acct';
import parseAcct from '../../../../../common/user/parse-acct';
export default Vue.extend({
props: {
@ -37,6 +39,11 @@ export default Vue.extend({
required: true
}
},
computed: {
acct() {
return getAcct(this.u);
}
},
data() {
return {
u: null
@ -49,10 +56,11 @@ export default Vue.extend({
this.open();
});
} else {
(this as any).api('users/show', {
user_id: this.user[0] == '@' ? undefined : this.user,
username: this.user[0] == '@' ? this.user.substr(1) : undefined
}).then(user => {
const query = this.user[0] == '@' ?
parseAcct(this.user[0].substr(1)) :
{ user_id: this.user[0] };
(this as any).api('users/show', query).then(user => {
this.u = user;
this.open();
});

View file

@ -1,12 +1,12 @@
<template>
<div class="root item">
<router-link class="avatar-anchor" :to="`/@${user.username}`" v-user-preview="user.id">
<router-link class="avatar-anchor" :to="`/@${acct}`" 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>
<span class="username">@{{ user.username }}</span>
<router-link class="name" :to="`/@${acct}`" v-user-preview="user.id">{{ user.name }}</router-link>
<span class="username">@{{ acct }}</span>
</header>
<div class="body">
<p class="followed" v-if="user.is_followed">フォローされています</p>
@ -19,8 +19,15 @@
<script lang="ts">
import Vue from 'vue';
import getAcct from '../../../../../common/user/get-acct';
export default Vue.extend({
props: ['user']
props: ['user'],
computed: {
acct() {
return getAcct(this.user);
}
}
});
</script>