From 6a69e4180b2506aa94983a7e2f1d6dafc2214b07 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E3=81=8B=E3=81=A3=E3=81=93=E3=81=8B=E3=82=8A?=
 <67428053+kakkokari-gtyih@users.noreply.github.com>
Date: Sun, 27 Apr 2025 10:46:55 +0900
Subject: [PATCH] =?UTF-8?q?fix(frontend):=20PageWithHeader=E3=81=8B?=
 =?UTF-8?q?=E3=82=89PageHeader=E3=81=AB=E5=85=A8Props=E3=81=8C=E4=BC=9D?=
 =?UTF-8?q?=E3=82=8F=E3=81=A3=E3=81=A6=E3=81=84=E3=81=AA=E3=81=8B=E3=81=A3?=
 =?UTF-8?q?=E3=81=9F=E5=95=8F=E9=A1=8C=E3=82=92=E4=BF=AE=E6=AD=A3=20(#1585?=
 =?UTF-8?q?8)?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../src/components/global/MkPageHeader.vue    | 27 +++++++++++--------
 .../src/components/global/PageWithHeader.vue  | 21 +++++++--------
 2 files changed, 25 insertions(+), 23 deletions(-)

diff --git a/packages/frontend/src/components/global/MkPageHeader.vue b/packages/frontend/src/components/global/MkPageHeader.vue
index dc0b52b141..542c3d8d12 100644
--- a/packages/frontend/src/components/global/MkPageHeader.vue
+++ b/packages/frontend/src/components/global/MkPageHeader.vue
@@ -40,19 +40,12 @@ SPDX-License-Identifier: AGPL-3.0-only
 </div>
 </template>
 
-<script lang="ts" setup>
-import { onMounted, onUnmounted, ref, inject, useTemplateRef, computed } from 'vue';
-import { scrollToTop } from '@@/js/scroll.js';
-import XTabs from './MkPageHeader.tabs.vue';
-import type { Tab } from './MkPageHeader.tabs.vue';
+<script lang="ts">
 import type { PageHeaderItem } from '@/types/page-header.js';
 import type { PageMetadata } from '@/page.js';
-import { globalEvents } from '@/events.js';
-import { openAccountMenu as openAccountMenu_ } from '@/accounts.js';
-import { $i } from '@/i.js';
-import { DI } from '@/di.js';
+import type { Tab } from './MkPageHeader.tabs.vue';
 
-const props = withDefaults(defineProps<{
+export type PageHeaderProps = {
 	overridePageMetadata?: PageMetadata;
 	tabs?: Tab[];
 	tab?: string;
@@ -60,7 +53,19 @@ const props = withDefaults(defineProps<{
 	thin?: boolean;
 	hideTitle?: boolean;
 	displayMyAvatar?: boolean;
-}>(), {
+};
+</script>
+
+<script lang="ts" setup>
+import { onMounted, onUnmounted, ref, inject, useTemplateRef, computed } from 'vue';
+import { scrollToTop } from '@@/js/scroll.js';
+import XTabs from './MkPageHeader.tabs.vue';
+import { globalEvents } from '@/events.js';
+import { openAccountMenu as openAccountMenu_ } from '@/accounts.js';
+import { $i } from '@/i.js';
+import { DI } from '@/di.js';
+
+const props = withDefaults(defineProps<PageHeaderProps>(), {
 	tabs: () => ([] as Tab[]),
 });
 
diff --git a/packages/frontend/src/components/global/PageWithHeader.vue b/packages/frontend/src/components/global/PageWithHeader.vue
index 99f8df0780..4d26f8031b 100644
--- a/packages/frontend/src/components/global/PageWithHeader.vue
+++ b/packages/frontend/src/components/global/PageWithHeader.vue
@@ -6,7 +6,7 @@ SPDX-License-Identifier: AGPL-3.0-only
 <template>
 <div ref="rootEl" :class="[$style.root, reversed ? '_pageScrollableReversed' : '_pageScrollable']">
 	<MkStickyContainer>
-		<template #header><MkPageHeader v-model:tab="tab" :actions="actions" :tabs="tabs"/></template>
+		<template #header><MkPageHeader v-model:tab="tab" v-bind="pageHeaderProps"/></template>
 		<div :class="$style.body">
 			<slot></slot>
 		</div>
@@ -16,21 +16,18 @@ SPDX-License-Identifier: AGPL-3.0-only
 </template>
 
 <script lang="ts" setup>
-import { useTemplateRef } from 'vue';
+import { computed, useTemplateRef } from 'vue';
 import { scrollInContainer } from '@@/js/scroll.js';
-import type { PageHeaderItem } from '@/types/page-header.js';
-import type { Tab } from './MkPageHeader.tabs.vue';
+import type { PageHeaderProps } from './MkPageHeader.vue';
 import { useScrollPositionKeeper } from '@/use/use-scroll-position-keeper.js';
 
-const props = withDefaults(defineProps<{
-	tabs?: Tab[];
-	actions?: PageHeaderItem[] | null;
-	thin?: boolean;
-	hideTitle?: boolean;
-	displayMyAvatar?: boolean;
+const props = defineProps<PageHeaderProps & {
 	reversed?: boolean;
-}>(), {
-	tabs: () => ([] as Tab[]),
+}>();
+
+const pageHeaderProps = computed(() => {
+	const { reversed, ...rest } = props;
+	return rest;
 });
 
 const tab = defineModel<string>('tab');