From 74ddde44242c8e00fe6f8a0cbb1215071745e17f Mon Sep 17 00:00:00 2001
From: NoriDev <m1nthing2322@gmail.com>
Date: Thu, 19 Oct 2023 18:30:36 +0900
Subject: [PATCH] =?UTF-8?q?enhance(frontend):=20=ED=83=80=EC=9E=84?=
 =?UTF-8?q?=EB=9D=BC=EC=9D=B8=EC=97=90=EC=84=9C=20=EC=83=88=20=EB=85=B8?=
 =?UTF-8?q?=ED=8A=B8=EA=B0=80=2020=EA=B0=9C=20=EC=9D=B4=EC=83=81=EC=9D=B4?=
 =?UTF-8?q?=EB=A9=B4=20'20+'=EB=A1=9C=20=ED=91=9C=EA=B8=B0?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 CHANGELOG_CHERRYPICK.md                  |  1 +
 packages/frontend/src/pages/timeline.vue | 22 ++++++++++++++++++++--
 2 files changed, 21 insertions(+), 2 deletions(-)

diff --git a/CHANGELOG_CHERRYPICK.md b/CHANGELOG_CHERRYPICK.md
index 3547231541..c2b8f67d81 100644
--- a/CHANGELOG_CHERRYPICK.md
+++ b/CHANGELOG_CHERRYPICK.md
@@ -31,6 +31,7 @@ Misskey의 전체 변경 사항을 확인하려면, [CHANGELOG.md#2023xx](CHANGE
 ### Client
 - Feat: 노트 편집 시 토스트 알림을 표시하고 사운드를 재생
 - Enhance: 노트를 편집할 때 편집 중인 노트임을 강조함
+- Enhance: 타임라인에서 새 노트가 20개 이상이면 '20+'로 표기
 - Fix: '새 노트 알림'을 '노트 수 표시'로 설정했을 때 한국어 이외의 언어에서 내용이 표시되지 않음
 
 ### Server
diff --git a/packages/frontend/src/pages/timeline.vue b/packages/frontend/src/pages/timeline.vue
index 33ad149978..18320e4575 100644
--- a/packages/frontend/src/pages/timeline.vue
+++ b/packages/frontend/src/pages/timeline.vue
@@ -20,7 +20,15 @@ SPDX-License-Identifier: AGPL-3.0-only
 				:enterFromClass="defaultStore.state.animation ? $style.transition_new_enterFrom : ''"
 				:leaveToClass="defaultStore.state.animation ? $style.transition_new_leaveTo : ''"
 			>
-				<div v-if="queue > 0 && defaultStore.state.newNoteReceivedNotificationBehavior === 'default'" :class="[$style.new, { [$style.showEl]: (showEl && ['hideHeaderOnly', 'hideHeaderFloatBtn', 'hide'].includes(<string>defaultStore.state.displayHeaderNavBarWhenScroll)) && isMobile && !isFriendly, [$style.showElTab]: (showEl && ['hideHeaderOnly', 'hideHeaderFloatBtn', 'hide'].includes(<string>defaultStore.state.displayHeaderNavBarWhenScroll)) && isMobile && isFriendly, [$style.reduceAnimation]: !defaultStore.state.animation }]"><button class="_buttonPrimary" :class="$style.newButton" @click="top()"><i class="ti ti-arrow-up"></i>{{ i18n.ts.newNoteRecived }}</button></div>
+				<div
+					v-if="queue > 0 && defaultStore.state.newNoteReceivedNotificationBehavior === 'default'"
+					:class="[$style.new, { [$style.showEl]: (showEl && ['hideHeaderOnly', 'hideHeaderFloatBtn', 'hide'].includes(<string>defaultStore.state.displayHeaderNavBarWhenScroll)) && isMobile && !isFriendly, [$style.showElTab]: (showEl && ['hideHeaderOnly', 'hideHeaderFloatBtn', 'hide'].includes(<string>defaultStore.state.displayHeaderNavBarWhenScroll)) && isMobile && isFriendly, [$style.reduceAnimation]: !defaultStore.state.animation }]"
+				>
+					<button class="_buttonPrimary" :class="$style.newButton" @click="top()">
+						<i class="ti ti-arrow-up"></i>
+						{{ i18n.ts.newNoteRecived }}
+					</button>
+				</div>
 			</transition>
 			<transition
 				:enterActiveClass="defaultStore.state.animation ? $style.transition_new_enterActive : ''"
@@ -28,7 +36,17 @@ SPDX-License-Identifier: AGPL-3.0-only
 				:enterFromClass="defaultStore.state.animation ? $style.transition_new_enterFrom : ''"
 				:leaveToClass="defaultStore.state.animation ? $style.transition_new_leaveTo : ''"
 			>
-				<div v-if="queue > 0 && defaultStore.state.newNoteReceivedNotificationBehavior === 'count'" :class="[$style.new, { [$style.showEl]: (showEl && ['hideHeaderOnly', 'hideHeaderFloatBtn', 'hide'].includes(<string>defaultStore.state.displayHeaderNavBarWhenScroll)) && isMobile && !isFriendly, [$style.showElTab]: (showEl && ['hideHeaderOnly', 'hideHeaderFloatBtn', 'hide'].includes(<string>defaultStore.state.displayHeaderNavBarWhenScroll)) && isMobile && isFriendly, [$style.reduceAnimation]: !defaultStore.state.animation }]"><button class="_buttonPrimary" :class="$style.newButton" @click="top()"><i class="ti ti-arrow-up"></i><I18n :src="i18n.ts.newNoteRecivedCount" textTag="span"><template #n>{{ queue }}</template></I18n></button></div>
+				<div
+					v-if="queue > 0 && defaultStore.state.newNoteReceivedNotificationBehavior === 'count'"
+					:class="[$style.new, { [$style.showEl]: (showEl && ['hideHeaderOnly', 'hideHeaderFloatBtn', 'hide'].includes(<string>defaultStore.state.displayHeaderNavBarWhenScroll)) && isMobile && !isFriendly, [$style.showElTab]: (showEl && ['hideHeaderOnly', 'hideHeaderFloatBtn', 'hide'].includes(<string>defaultStore.state.displayHeaderNavBarWhenScroll)) && isMobile && isFriendly, [$style.reduceAnimation]: !defaultStore.state.animation }]"
+				>
+					<button class="_buttonPrimary" :class="$style.newButton" @click="top()">
+						<i class="ti ti-arrow-up"></i>
+						<I18n :src="i18n.ts.newNoteRecivedCount" textTag="span">
+							<template #n>{{ queue > 19 ? queue + '+' : queue }}</template>
+						</I18n>
+					</button>
+				</div>
 			</transition>
 			<div :class="$style.tl">
 				<MkTimeline