feat: (friendly) Adjusted so that the account switching modal appears when you press and hold the timeline button on the bottom navigation bar, Add refresh button to account switch modal

CHANGELOG_CHERRYPICK.md

@@ -18,11 +18,13 @@
 - 클라이언트: (friendly) 하단으로 스크롤하면 새 노트 알림의 위치가 자동으로 조정됨
 - 클라이언트: (friendly) UI에 흐림 효과 사용 옵션을 비활성화하면 플로팅 버튼을 불투명하게 표시하도록 설정함
 - 클라이언트: (friendly) UI 애니메이션 줄이기 옵션이 활성화된 경우 헤더와 플로팅 버튼의 전환 애니메이션을 비활성화함
+- 클라이언트: (friendly) 하단 내비게이션 바의 타임라인 버튼을 길게 누르면 계정 전환 모달이 뜨도록 조정
 - 클라이언트: 기본 테마 색상 일부 변경 🎨
 - 클라이언트: 모든 계정 로그아웃 버튼과 구분하기 쉽도록 로그아웃 아이콘이 변경됨
 - 클라이언트: 새 노트 알림이 부드럽게 표시되도록 애니메이션 추가
 - 클라이언트: UI 애니메이션 줄이기 옵션이 활성화된 경우 새 노트 알림의 애니메이션을 비활성화함
 - 클라이언트: 노트를 작성할 때, 단축키로 공개 범위를 전환할 수 있음
+- 클라이언트: 계정 전환 모달에 새로고침 버튼 추가
 
 ### Bugfixes
 - 클라이언트: (friendly) 타임라인이 아닌 페이지에서 헤더에 블러가 적용되는 문제

packages/frontend/src/account.ts

@@ -282,6 +282,11 @@ export async function openAccountMenu(opts: {
 				signout();
 			},
 			danger: true,
+		}, {
+			type: 'button',
+			icon: 'ti ti-refresh',
+			text: i18n.ts.reload,
+			action: () => { location.reload(); },
 		}]], ev.currentTarget ?? ev.target, {
 			align: 'left',
 		});

packages/frontend/src/ui/friendly.vue

@@ -24,7 +24,7 @@
 
 	<div v-if="isMobile" :class="$style.nav">
 		<!-- <button :class="$style.navButton" class="_button" @click="drawerMenuShowing = true"><i :class="$style.navButtonIcon" class="ti ti-menu-2"></i><span v-if="menuIndicated" :class="$style.navButtonIndicator"><i class="_indicatorCircle"></i></span></button> -->
-		<button :class="[$style.navButton, { [$style.active]: mainRouter.currentRoute.value.name === 'index' }]" class="_button" @click="mainRouter.currentRoute.value.name === 'index' ? top() : mainRouter.replace('/')"><i :class="$style.navButtonIcon" class="ti ti-home"></i><span v-if="queue > 0" :class="$style.navButtonIndicatorHome"><i class="_indicatorCircle"></i></span></button>
+		<button :class="[$style.navButton, { [$style.active]: mainRouter.currentRoute.value.name === 'index' }]" class="_button" @click="mainRouter.currentRoute.value.name === 'index' ? top() : mainRouter.replace('/')" @touchstart="openAccountMenu" @touchend="closeAccountMenu"><i :class="$style.navButtonIcon" class="ti ti-home"></i><span v-if="queue > 0" :class="$style.navButtonIndicatorHome"><i class="_indicatorCircle"></i></span></button>
 		<button :class="[$style.navButton, { [$style.active]: mainRouter.currentRoute.value.name === 'explore' }]" class="_button" @click="mainRouter.currentRoute.value.name === 'explore' ? top() : mainRouter.replace('/explore')"><i :class="$style.navButtonIcon" class="ti ti-hash"></i></button>
 		<button :class="[$style.navButton, { [$style.active]: mainRouter.currentRoute.value.name === 'my-notifications' }]" class="_button" @click="mainRouter.currentRoute.value.name === 'my-notifications' ? top() : mainRouter.replace('/my/notifications')"><i :class="$style.navButtonIcon" class="ti ti-bell"></i><span v-if="$i?.hasUnreadNotification" :class="$style.navButtonIndicator"><i class="_indicatorCircle"></i></span></button>
 		<button :class="[$style.navButton, { [$style.active]: mainRouter.currentRoute.value.name === 'messaging' || mainRouter.currentRoute.value.name === 'messaging-room' || mainRouter.currentRoute.value.name === 'messaging-room-group' }]" class="_button" @click="mainRouter.currentRoute.value.name === 'messaging' ? top() : mainRouter.replace('/my/messaging')"><i :class="$style.navButtonIcon" class="ti ti-messages"></i><span v-if="$i?.hasUnreadMessagingMessage" :class="$style.navButtonIndicator"><i class="_indicatorCircle"></i></span></button>
@@ -99,7 +99,7 @@ import * as os from '@/os';
 import { defaultStore } from '@/store';
 import { navbarItemDef } from '@/navbar';
 import { i18n } from '@/i18n';
-import { $i } from '@/account';
+import { $i, openAccountMenu as openAccountMenu_ } from '@/account';
 import { Router } from '@/nirax';
 import { mainRouter } from '@/router';
 import { PageMetadata, provideMetadataReceiver, setPageMetadata } from '@/scripts/page-metadata';
@@ -128,6 +128,8 @@ let lastScrollPosition = $ref(0);
 
 let queue = $ref(0);
 
+let longTouchNavHome = $ref(false);
+
 let pageMetadata = $ref<null | ComputedRef<PageMetadata>>();
 const widgetsEl = $shallowRef<HTMLElement>();
 const widgetsShowing = $ref(false);
@@ -249,6 +251,21 @@ function queueUpdated(q: number): void {
 	queue = q;
 }
 
+function openAccountMenu(ev: MouseEvent) {
+	longTouchNavHome = true;
+	setTimeout(() => {
+		if (longTouchNavHome === true) {
+			openAccountMenu_({
+				withExtraOperation: true,
+			}, ev);
+		}
+	}, 500);
+}
+
+function closeAccountMenu() {
+	longTouchNavHome = false;
+}
+
 const wallpaper = miLocalStorage.getItem('wallpaper') != null;
 </script>