From 1aeccc1cc6b4f84cb20754705014bc8e3563d1aa Mon Sep 17 00:00:00 2001
From: Surmon <surmon.me@gmail.com>
Date: Wed, 2 Oct 2024 14:10:12 +0700
Subject: [PATCH] feat: v4.49.1

---
 package.json                         |  2 +-
 src/pages/snippets/desktop/index.vue | 11 ++++++--
 src/pages/snippets/mobile/index.vue  |  5 ++--
 src/pages/snippets/threads/card.vue  | 39 ++++++++++++++++++++--------
 4 files changed, 40 insertions(+), 17 deletions(-)

diff --git a/package.json b/package.json
index 2d28e908..a8c9914d 100644
--- a/package.json
+++ b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "surmon.me",
-  "version": "4.49.0",
+  "version": "4.49.1",
   "description": "Surmon.me blog",
   "author": "Surmon",
   "license": "MIT",
diff --git a/src/pages/snippets/desktop/index.vue b/src/pages/snippets/desktop/index.vue
index 1ab0efba..e767742a 100644
--- a/src/pages/snippets/desktop/index.vue
+++ b/src/pages/snippets/desktop/index.vue
@@ -11,6 +11,10 @@
 
   const { latestThreadsStore, loading, finished, allMedias, fetchMoreMedias } = useThreadsMediasData()
 
+  const openImagePopup = (url: string) => {
+    window.$popup.vImage(url)
+  }
+
   useSnippetsPageMeta()
   useUniversalFetch(() => latestThreadsStore.fetch())
 </script>
@@ -27,7 +31,10 @@
           Threads
         </ulink>
         <divider type="vertical" size="lg" color="#ffffffcc" />
-        <ulink :href="VALUABLE_LINKS.ZHIHU" class="link"><i class="iconfont icon-zhihu-full"></i></ulink>
+        <ulink :href="VALUABLE_LINKS.ZHIHU" class="link">
+          <i class="iconfont icon-zhihu"></i>
+          Zhihu.com
+        </ulink>
       </template>
     </page-banner>
     <container class="page-bridge"></container>
@@ -51,7 +58,7 @@
           <div>
             <masonry-list :data="allMedias" :cols="3">
               <template #item="{ data }">
-                <threads-card :media="data" />
+                <threads-card :media="data" :show-icon="true" @click-image="openImagePopup" />
               </template>
             </masonry-list>
             <loadmore
diff --git a/src/pages/snippets/mobile/index.vue b/src/pages/snippets/mobile/index.vue
index 1ff3384d..1d7ed377 100644
--- a/src/pages/snippets/mobile/index.vue
+++ b/src/pages/snippets/mobile/index.vue
@@ -47,9 +47,7 @@
               <i class="iconfont icon-threads"></i> Threads
             </ulink>
             <divider type="vertical" />
-            <ulink class="item" :href="VALUABLE_LINKS.ZHIHU">
-              <i class="iconfont icon-zhihu-full"></i>
-            </ulink>
+            <ulink class="item" :href="VALUABLE_LINKS.ZHIHU"><i class="iconfont icon-zhihu"></i> Zhihu.com</ulink>
           </div>
           <ul class="cards">
             <li class="item" v-for="(media, index) in allMedias" :key="index" data-allow-mismatch>
@@ -137,6 +135,7 @@
         align-items: center;
 
         .item {
+          flex: 1;
           text-align: center;
           font-size: $font-size-h3;
         }
diff --git a/src/pages/snippets/threads/card.vue b/src/pages/snippets/threads/card.vue
index 8d8a5477..ae021999 100644
--- a/src/pages/snippets/threads/card.vue
+++ b/src/pages/snippets/threads/card.vue
@@ -1,31 +1,48 @@
 <script lang="ts" setup>
+  import { computed } from 'vue'
+  import { useEnhancer } from '/@/app/enhancer'
+  import { useCountry } from '/@/app/context'
+  import { isCNCode } from '/@/transforms/region'
+  import { getProxyURL } from '/@/transforms/url'
   import type { ThreadsMedia } from '/@/server/getters/threads'
   import Markdown from '/@/components/common/markdown.vue'
-  defineProps<{
+
+  const props = defineProps<{
     media: ThreadsMedia
+    showIcon?: boolean
   }>()
 
-  const openImagePopup = (url: string) => {
-    window.$popup.vImage(url)
-  }
+  const emit = defineEmits<{
+    (e: 'click-image', url: string): void
+  }>()
+
+  const { cdnDomain } = useEnhancer()
+  const mediaUrl = computed(() => {
+    const url = props.media.media_url
+    if (!url) return null
+    const countryCode = useCountry()
+    const isCNUser = isCNCode(countryCode ?? '')
+    return isCNUser ? getProxyURL(cdnDomain, url) : url
+  })
 </script>
 
 <template>
   <div class="threads-media-card">
-    <div class="media" :class="{ audio: media.media_type === 'AUDIO' }" v-if="media.media_url">
-      <audio class="audio" :src="media.media_url" controls v-if="media.media_type === 'AUDIO'" />
-      <video class="video" :src="media.media_url" controls v-else-if="media.media_type === 'VIDEO'" />
-      <uimage
+    <div class="media" :class="{ audio: media.media_type === 'AUDIO' }" v-if="mediaUrl">
+      <audio class="audio" :src="mediaUrl" controls v-if="media.media_type === 'AUDIO'" />
+      <video class="video" :src="mediaUrl" controls v-else-if="media.media_type === 'VIDEO'" />
+      <img
         class="image"
         :alt="media.text"
-        :src="media.media_url"
+        :src="mediaUrl"
         loading="lazy"
+        draggable="false"
+        @click="emit('click-image', mediaUrl)"
         v-else
-        @click="openImagePopup(media.media_url)"
       />
     </div>
     <div class="content">
-      <span class="icon" v-if="!media.media_url">
+      <span class="icon" v-if="!mediaUrl && showIcon">
         <i class="iconfont icon-repost" v-if="media.is_quote_post"></i>
         <i class="iconfont icon-audio" v-else-if="media.media_type === 'AUDIO'"></i>
         <i class="iconfont icon-video" v-else-if="media.media_type === 'VIDEO'"></i>