enhance(client): make possible to reload page of window

Resolve #10007

CHANGELOG.md

@@ -21,6 +21,7 @@ You should also include the user name that made the change.
 - 広告開始時期を設定できるように
 - みつけるで公開ロール一覧とそのメンバーを閲覧できるように
 - enhance(client): MFMのx3, x4が含まれていたらノートをたたむように
+- enhance(client): make possible to reload page of window
 
 ### Bugfixes
 - ユーザー検索ダイアログでローカルユーザーを絞って検索できない問題を修正

packages/frontend/src/components/MkPageWindow.vue

@@ -18,7 +18,7 @@
 	</template>
 
 	<div :class="$style.root" :style="{ background: pageMetadata?.value?.bg }" style="container-type: inline-size;">
-		<RouterView :router="router"/>
+		<RouterView :key="reloadCount" :router="router"/>
 	</div>
 </MkWindow>
 </template>
@@ -67,6 +67,10 @@ const buttonsLeft = $computed(() => {
 });
 const buttonsRight = $computed(() => {
 	const buttons = [{
+		icon: 'ti ti-reload',
+		title: i18n.ts.reload,
+		onClick: reload,
+	}, {
 		icon: 'ti ti-player-eject',
 		title: i18n.ts.showInPage,
 		onClick: expand,
@@ -74,6 +78,7 @@ const buttonsRight = $computed(() => {
 
 	return buttons;
 });
+let reloadCount = $ref(0);
 
 router.addListener('push', ctx => {
 	history.push({ path: ctx.path, key: ctx.key });
@@ -115,6 +120,10 @@ function back() {
 	router.replace(history[history.length - 1].path, history[history.length - 1].key);
 }
 
+function reload() {
+	reloadCount++;
+}
+
 function close() {
 	windowEl.close();
 }