From 1d50616949537bfdad157578a6653a8ee2490fae Mon Sep 17 00:00:00 2001
From: webfansplz <308241863@qq.com>
Date: Sat, 14 Jan 2023 18:39:49 +0800
Subject: [PATCH] fix: rework tip for unavailable following/followers (#1110)

Co-authored-by: Anthony Fu <anthonyfu117@hotmail.com>
---
 components/account/AccountPaginator.vue       | 24 ++++++++++++++++++-
 locales/en-US.json                            |  4 +++-
 locales/zh-CN.json                            |  4 +++-
 locales/zh-TW.json                            |  4 +++-
 .../[[server]]/@[account]/index/followers.vue |  2 +-
 .../[[server]]/@[account]/index/following.vue |  2 +-
 6 files changed, 34 insertions(+), 6 deletions(-)

diff --git a/components/account/AccountPaginator.vue b/components/account/AccountPaginator.vue
index ecb92d7d..86bcccb8 100644
--- a/components/account/AccountPaginator.vue
+++ b/components/account/AccountPaginator.vue
@@ -1,10 +1,19 @@
 <script setup lang="ts">
 import type { Paginator, mastodon } from 'masto'
 
-const { paginator } = defineProps<{
+const { paginator, account, context } = defineProps<{
   paginator: Paginator<mastodon.v1.Account[], mastodon.DefaultPaginationParams>
+  context?: 'following' | 'followers'
+  account?: mastodon.v1.Account
   relationshipContext?: 'followedBy' | 'following'
 }>()
+
+const fallbackContext = $computed(() => {
+  return ['following', 'followers'].includes(context!)
+})
+const showOriginSite = $computed(() =>
+  account && account.id !== currentUser.value?.account.id && getServerName(account) !== currentServer.value,
+)
 </script>
 
 <template>
@@ -17,5 +26,18 @@ const { paginator } = defineProps<{
         border="b base" py2 px4
       />
     </template>
+    <template v-if="fallbackContext && showOriginSite" #done>
+      <div p5 text-secondary text-center flex flex-col items-center gap1>
+        <span italic>{{ $t(`account.view_other_${context}`) }}</span>
+        <NuxtLink
+          :href="account!.url" target="_blank" external
+          flex="~ gap-1" items-center text-primary
+          hover="underline text-primary-active"
+        >
+          <div i-ri:external-link-fill />
+          {{ $t('menu.open_in_original_site') }}
+        </NuxtLink>
+      </div>
+    </template>
   </CommonPaginator>
 </template>
diff --git a/locales/en-US.json b/locales/en-US.json
index 082a6d0b..28f03590 100644
--- a/locales/en-US.json
+++ b/locales/en-US.json
@@ -35,7 +35,9 @@
     "profile_unavailable": "Profile unavailable",
     "unblock": "Unblock",
     "unfollow": "Unfollow",
-    "unmute": "Unmute"
+    "unmute": "Unmute",
+    "view_other_followers": "Followers from other instances may not be displayed.",
+    "view_other_following": "Following from other instances may not be displayed."
   },
   "action": {
     "apply": "Apply",
diff --git a/locales/zh-CN.json b/locales/zh-CN.json
index 8ecbda73..0ff90838 100644
--- a/locales/zh-CN.json
+++ b/locales/zh-CN.json
@@ -35,7 +35,9 @@
     "profile_unavailable": "个人资料不可见",
     "unblock": "取消拉黑",
     "unfollow": "取消关注",
-    "unmute": "取消屏蔽"
+    "unmute": "取消屏蔽",
+    "view_other_followers": "其他站点上的关注者可能不会在这里显示。",
+    "view_other_following": "其他站点上正在关注的人可能不会在这里显示。"
   },
   "action": {
     "apply": "应用",
diff --git a/locales/zh-TW.json b/locales/zh-TW.json
index b547bac8..dd8f6db3 100644
--- a/locales/zh-TW.json
+++ b/locales/zh-TW.json
@@ -35,7 +35,9 @@
     "profile_unavailable": "個人資料不可見",
     "unblock": "取消黑名單",
     "unfollow": "取消關注",
-    "unmute": "取消靜音"
+    "unmute": "取消靜音",
+    "view_other_followers": "其他站點上的關注者可能不會在這裡顯示。",
+    "view_other_following": "其他站點上正在關注的人可能不會在這裡顯示。"
   },
   "action": {
     "apply": "套用",
diff --git a/pages/[[server]]/@[account]/index/followers.vue b/pages/[[server]]/@[account]/index/followers.vue
index 8ef6a10a..aca2eeb7 100644
--- a/pages/[[server]]/@[account]/index/followers.vue
+++ b/pages/[[server]]/@[account]/index/followers.vue
@@ -19,6 +19,6 @@ if (account) {
 
 <template>
   <template v-if="paginator">
-    <AccountPaginator :paginator="paginator" :relationship-context="isSelf ? 'followedBy' : undefined" />
+    <AccountPaginator :paginator="paginator" :relationship-context="isSelf ? 'followedBy' : undefined" context="followers" :account="account" />
   </template>
 </template>
diff --git a/pages/[[server]]/@[account]/index/following.vue b/pages/[[server]]/@[account]/index/following.vue
index d8f6451b..9c0c43e5 100644
--- a/pages/[[server]]/@[account]/index/following.vue
+++ b/pages/[[server]]/@[account]/index/following.vue
@@ -19,6 +19,6 @@ if (account) {
 
 <template>
   <template v-if="paginator">
-    <AccountPaginator :paginator="paginator" :relationship-context="isSelf ? 'following' : undefined" />
+    <AccountPaginator :paginator="paginator" :relationship-context="isSelf ? 'following' : undefined" context="following" :account="account" />
   </template>
 </template>