enhance(frontend): チャットをすべて既読に表示するボタンをヘッダーに追加

CHANGELOG_CHERRYPICK.md

@@ -47,6 +47,7 @@
 - Enhance: 대화 페이지 디자인 개선
 - Enhance: 유저 페이지 헤더에 유저 메뉴, 팔로우 버튼 추가
 - Enhance: 대화 페이지의 탭을 '다이렉트 메시지 / 그룹'으로 분할
+- Enhance: 헤더에 모든 대화를 읽음으로 표시하는 버튼 추가
 - Fix: (Friendly) 흐림 효과를 사용할 때 하단 내비게이션 바의 가독성이 매우 떨어지는 문제
 - Fix: (Friendly) 위젯 버튼에서 'UI 애니메이션 줄이기' 옵션이 적용되지 않는 문제
 - Fix: (Friendly) 스크롤을 해도 위젯 버튼이 숨겨지지 않는 문제

packages/frontend/src/pages/messaging/index.vue

@@ -129,6 +129,10 @@ async function startGroup() {
 	router.push(`/my/messaging/group/${group.id}`);
 }
 
+async function readAllMessagingMessages() {
+	await os.apiWithDialog('i/read-all-messaging-messages');
+}
+
 onMounted(() => {
 	connection = markRaw(useStream().useChannel('messagingIndex'));
 
@@ -140,7 +144,7 @@ onMounted(() => {
 			const _messages = userMessages.concat(groupMessages);
 			_messages.sort((a, b) => new Date(b.createdAt).getTime() - new Date(a.createdAt).getTime());
 			messages = _messages;
-      fetching = false;
+			fetching = false;
 		});
 	});
 
@@ -157,6 +161,10 @@ const headerActions = $computed(() => [{
 	icon: 'ti ti-plus',
 	text: i18n.ts.create,
 	handler: start,
+}, {
+	icon: 'ti ti-check',
+	text: i18n.ts.markAllAsRead,
+	handler: readAllMessagingMessages,
 }]);
 
 const headerTabs = $computed(() => [{