From 6b5b1f2aedfd6f6748e1387570f8da7b21b03f06 Mon Sep 17 00:00:00 2001
From: Piotrek Tomczewski <piotrski@gmail.com>
Date: Wed, 4 Jan 2023 21:08:05 +0100
Subject: [PATCH] feat(search): :sparkles: show hashtag stats and chart in
 autocomplete (#779)

---
 components/search/HashtagInfo.vue | 15 +++++++++++----
 1 file changed, 11 insertions(+), 4 deletions(-)

diff --git a/components/search/HashtagInfo.vue b/components/search/HashtagInfo.vue
index 20e53228..f98cf3fd 100644
--- a/components/search/HashtagInfo.vue
+++ b/components/search/HashtagInfo.vue
@@ -1,5 +1,11 @@
 <script setup lang="ts">
-defineProps<{ hashtag: any }>()
+import type { History, Tag } from 'masto'
+
+const { hashtag } = defineProps<{ hashtag: Tag }>()
+
+const totalTrend = $computed(() =>
+  hashtag.history?.reduce((total: number, item) => total + (Number(item.accounts) || 0), 0),
+)
 </script>
 
 <template>
@@ -11,9 +17,10 @@ defineProps<{ hashtag: any }>()
       <span>
         {{ hashtag.name }}
       </span>
-      <span text-xs text-secondary>
-        {{ hashtag.following ? 'Following' : 'Not Following' }}
-      </span>
+      <CommonTrending :history="hashtag.history" text-xs text-secondary truncate />
+    </div>
+    <div v-if="totalTrend" w-12 h-12 flex place-items-center place-content-center ml-auto>
+      <CommonTrendingCharts :history="hashtag.history" text-xs text-secondary />
     </div>
   </div>
 </template>