Merge pull request #36 from sinProject-Inc/35-show-action-counts

close #35

Author: sinproject-iwasaki

src/routes/home/+page.server.ts

@@ -11,7 +11,7 @@ export const load: PageServerLoad = async ({ locals }) => {
 		const tweets = await client.tweets.usersIdTimeline(locals.user.twitter_id, {
 			// max_results: 30,
 			expansions: ['author_id', 'referenced_tweets.id', 'referenced_tweets.id.author_id'],
-			'tweet.fields': ['created_at'],
+			'tweet.fields': ['created_at', 'public_metrics'],
 			'user.fields': ['profile_image_url'],
 			// 'tweet.fields': ['author_id'],
 			// 'tweet.fields': ['created_at', 'entities', 'public_metrics'],

src/routes/home/+page.svelte

@@ -95,6 +95,33 @@
 		return target_tweet.text ?? ''
 	}
 
+	function get_retweet_count(tweet: components['schemas']['Tweet']): string {
+		const target_tweet = get_target_tweet(tweet)
+
+		const count = target_tweet.public_metrics?.retweet_count ?? 0 
+		const count_text = count > 0 ? count.toLocaleString('ja-JP') : ''
+
+		return count_text
+	}
+
+	function get_reply_count(tweet: components['schemas']['Tweet']): string {
+		const target_tweet = get_target_tweet(tweet)
+
+		const count = target_tweet.public_metrics?.reply_count ?? 0 
+		const count_text = count > 0 ? count.toLocaleString('ja-JP') : ''
+
+		return count_text
+	}
+
+	function get_like_count(tweet: components['schemas']['Tweet']): string {
+		const target_tweet = get_target_tweet(tweet)
+
+		const count = target_tweet.public_metrics?.like_count ?? 0 
+		const count_text = count > 0 ? count.toLocaleString('ja-JP') : ''
+
+		return count_text
+	}
+
 	// console.log(tweets)
 </script>
 
@@ -135,21 +162,21 @@
 							<div class="tap_area" />
 							<Reply />
 						</div>
-						<div class="icon_text overflow_ellipsis">1,234</div>
+						<div class="icon_text overflow_ellipsis">{get_reply_count(tweet)}</div>
 					</div>
 					<div class="action">
 						<div class="icon">
 							<div class="tap_area" />
 							<Retweet />
 						</div>
-						<div class="icon_text overflow_ellipsis">2,345</div>
+						<div class="icon_text overflow_ellipsis">{get_retweet_count(tweet)}</div>
 					</div>
 					<div class="action">
 						<div class="icon">
 							<div class="tap_area" />
 							<Like />
 						</div>
-						<div class="icon_text overflow_ellipsis">3,456</div>
+						<div class="icon_text overflow_ellipsis">{get_like_count(tweet)}</div>
 					</div>
 				</div>
 			</div>