enhance(frontend): フォロー/フォロワー非公開時の表示を改善

Close #10934
Resolve #10887
This commit is contained in:
syuilo 2023-07-18 19:50:23 +09:00
parent e6db7b9fa7
commit 269cd560c7
5 changed files with 22 additions and 7 deletions

View file

@ -40,6 +40,7 @@
- Deckで非ルートページにアクセスした際に簡易UIで表示しない設定を追加 - Deckで非ルートページにアクセスした際に簡易UIで表示しない設定を追加
- ロール設定画面でロールIDを確認できるように - ロール設定画面でロールIDを確認できるように
- コンテキストメニュー表示時のパフォーマンスを改善 - コンテキストメニュー表示時のパフォーマンスを改善
- フォロー/フォロワー非公開時の表示を改善
- Fix: サーバーメトリクスが90度傾いている - Fix: サーバーメトリクスが90度傾いている
- Fix: 非ログイン時にクレデンシャルが必要なページに行くとエラーが出る問題を修正 - Fix: 非ログイン時にクレデンシャルが必要なページに行くとエラーが出る問題を修正
- Fix: sparkle内にリンクを入れるとクリック不能になる問題の修正 - Fix: sparkle内にリンクを入れるとクリック不能になる問題の修正

View file

@ -17,10 +17,10 @@
<div :class="$style.statusItem"> <div :class="$style.statusItem">
<p :class="$style.statusItemLabel">{{ i18n.ts.notes }}</p><span :class="$style.statusItemValue">{{ user.notesCount }}</span> <p :class="$style.statusItemLabel">{{ i18n.ts.notes }}</p><span :class="$style.statusItemValue">{{ user.notesCount }}</span>
</div> </div>
<div :class="$style.statusItem"> <div v-if="isFfVisibleForMe(user)" :class="$style.statusItem">
<p :class="$style.statusItemLabel">{{ i18n.ts.following }}</p><span :class="$style.statusItemValue">{{ user.followingCount }}</span> <p :class="$style.statusItemLabel">{{ i18n.ts.following }}</p><span :class="$style.statusItemValue">{{ user.followingCount }}</span>
</div> </div>
<div :class="$style.statusItem"> <div v-if="isFfVisibleForMe(user)" :class="$style.statusItem">
<p :class="$style.statusItemLabel">{{ i18n.ts.followers }}</p><span :class="$style.statusItemValue">{{ user.followersCount }}</span> <p :class="$style.statusItemLabel">{{ i18n.ts.followers }}</p><span :class="$style.statusItemValue">{{ user.followersCount }}</span>
</div> </div>
</div> </div>
@ -34,6 +34,7 @@ import MkFollowButton from '@/components/MkFollowButton.vue';
import { userPage } from '@/filters/user'; import { userPage } from '@/filters/user';
import { i18n } from '@/i18n'; import { i18n } from '@/i18n';
import { $i } from '@/account'; import { $i } from '@/account';
import { isFfVisibleForMe } from '@/scripts/isFfVisibleForMe';
defineProps<{ defineProps<{
user: misskey.entities.UserDetailed; user: misskey.entities.UserDetailed;

View file

@ -30,11 +30,11 @@
<div :class="$style.statusItemLabel">{{ i18n.ts.notes }}</div> <div :class="$style.statusItemLabel">{{ i18n.ts.notes }}</div>
<div>{{ number(user.notesCount) }}</div> <div>{{ number(user.notesCount) }}</div>
</div> </div>
<div :class="$style.statusItem"> <div v-if="isFfVisibleForMe(user)" :class="$style.statusItem">
<div :class="$style.statusItemLabel">{{ i18n.ts.following }}</div> <div :class="$style.statusItemLabel">{{ i18n.ts.following }}</div>
<div>{{ number(user.followingCount) }}</div> <div>{{ number(user.followingCount) }}</div>
</div> </div>
<div :class="$style.statusItem"> <div v-if="isFfVisibleForMe(user)" :class="$style.statusItem">
<div :class="$style.statusItemLabel">{{ i18n.ts.followers }}</div> <div :class="$style.statusItemLabel">{{ i18n.ts.followers }}</div>
<div>{{ number(user.followersCount) }}</div> <div>{{ number(user.followersCount) }}</div>
</div> </div>
@ -61,6 +61,7 @@ import number from '@/filters/number';
import { i18n } from '@/i18n'; import { i18n } from '@/i18n';
import { defaultStore } from '@/store'; import { defaultStore } from '@/store';
import { $i } from '@/account'; import { $i } from '@/account';
import { isFfVisibleForMe } from '@/scripts/isFfVisibleForMe';
const props = defineProps<{ const props = defineProps<{
showing: boolean; showing: boolean;

View file

@ -100,15 +100,15 @@
</dl> </dl>
</div> </div>
<div class="status"> <div class="status">
<MkA v-click-anime :to="userPage(user)"> <MkA :to="userPage(user)">
<b>{{ number(user.notesCount) }}</b> <b>{{ number(user.notesCount) }}</b>
<span>{{ i18n.ts.notes }}</span> <span>{{ i18n.ts.notes }}</span>
</MkA> </MkA>
<MkA v-click-anime :to="userPage(user, 'following')"> <MkA v-if="isFfVisibleForMe(user)" :to="userPage(user, 'following')">
<b>{{ number(user.followingCount) }}</b> <b>{{ number(user.followingCount) }}</b>
<span>{{ i18n.ts.following }}</span> <span>{{ i18n.ts.following }}</span>
</MkA> </MkA>
<MkA v-click-anime :to="userPage(user, 'followers')"> <MkA v-if="isFfVisibleForMe(user)" :to="userPage(user, 'followers')">
<b>{{ number(user.followersCount) }}</b> <b>{{ number(user.followersCount) }}</b>
<span>{{ i18n.ts.followers }}</span> <span>{{ i18n.ts.followers }}</span>
</MkA> </MkA>
@ -160,6 +160,7 @@ import { dateString } from '@/filters/date';
import { confetti } from '@/scripts/confetti'; import { confetti } from '@/scripts/confetti';
import MkNotes from '@/components/MkNotes.vue'; import MkNotes from '@/components/MkNotes.vue';
import { api } from '@/os'; import { api } from '@/os';
import { isFfVisibleForMe } from '@/scripts/isFfVisibleForMe';
const XPhotos = defineAsyncComponent(() => import('./index.photos.vue')); const XPhotos = defineAsyncComponent(() => import('./index.photos.vue'));
const XActivity = defineAsyncComponent(() => import('./index.activity.vue')); const XActivity = defineAsyncComponent(() => import('./index.activity.vue'));

View file

@ -0,0 +1,11 @@
import * as misskey from 'misskey-js';
import { $i } from '@/account';
export function isFfVisibleForMe(user: misskey.entities.UserDetailed): boolean {
if ($i && $i.id === user.id) return true;
if (user.ffVisibility === 'private') return false;
if (user.ffVisibility === 'followers' && !user.isFollowing) return false;
return true;
}