diff --git a/packages/frontend/src/components/MkPageWindow.vue b/packages/frontend/src/components/MkPageWindow.vue
index 338403df143e2c8da0fc7e3120b66a54a11cff37..aa4509b14b62f47d4239611c7c36458ac4681d79 100644
--- a/packages/frontend/src/components/MkPageWindow.vue
+++ b/packages/frontend/src/components/MkPageWindow.vue
@@ -16,9 +16,9 @@ SPDX-License-Identifier: AGPL-3.0-only
@closed="$emit('closed')"
>
<template #header>
- <template v-if="pageMetadata?.value">
- <i v-if="pageMetadata.value.icon" :class="pageMetadata.value.icon" style="margin-right: 0.5em;"></i>
- <span>{{ pageMetadata.value.title }}</span>
+ <template v-if="pageMetadata">
+ <i v-if="pageMetadata.icon" :class="pageMetadata.icon" style="margin-right: 0.5em;"></i>
+ <span>{{ pageMetadata.title }}</span>
</template>
</template>
@@ -29,7 +29,7 @@ SPDX-License-Identifier: AGPL-3.0-only
</template>
<script lang="ts" setup>
-import { computed, ComputedRef, onMounted, onUnmounted, provide, ref, shallowRef } from 'vue';
+import { computed, onMounted, onUnmounted, provide, ref, shallowRef } from 'vue';
import RouterView from '@/components/global/RouterView.vue';
import MkWindow from '@/components/MkWindow.vue';
import { popout as _popout } from '@/scripts/popout.js';
@@ -37,7 +37,7 @@ import copyToClipboard from '@/scripts/copy-to-clipboard.js';
import { url } from '@/config.js';
import { useScrollPositionManager } from '@/nirax.js';
import { i18n } from '@/i18n.js';
-import { PageMetadata, provideMetadataReceiver } from '@/scripts/page-metadata.js';
+import { PageMetadata, provideMetadataReceiver, provideReactiveMetadata } from '@/scripts/page-metadata.js';
import { openingWindowsCount } from '@/os.js';
import { claimAchievement } from '@/scripts/achievements.js';
import { getScrollContainer } from '@/scripts/scroll.js';
@@ -56,7 +56,7 @@ const routerFactory = useRouterFactory();
const windowRouter = routerFactory(props.initialPath);
const contents = shallowRef<HTMLElement | null>(null);
-const pageMetadata = ref<null | ComputedRef<PageMetadata>>();
+const pageMetadata = ref<null | PageMetadata>(null);
const windowEl = shallowRef<InstanceType<typeof MkWindow>>();
const history = ref<{ path: string; key: any; }[]>([{
path: windowRouter.getCurrentPath(),
@@ -101,9 +101,11 @@ windowRouter.addListener('replace', ctx => {
windowRouter.init();
provide('router', windowRouter);
-provideMetadataReceiver((info) => {
+provideMetadataReceiver((metadataGetter) => {
+ const info = metadataGetter();
pageMetadata.value = info;
});
+provideReactiveMetadata(pageMetadata);
provide('shouldOmitHeaderTitle', true);
provide('shouldHeaderThin', true);
provide('forceSpacerMin', true);
diff --git a/packages/frontend/src/components/global/MkPageHeader.vue b/packages/frontend/src/components/global/MkPageHeader.vue
index 8d0374a20aca3c380cc02c1ab1a4b546b9d509d2..f16d951679c37a3833fb8224e9316fc56405a790 100644
--- a/packages/frontend/src/components/global/MkPageHeader.vue
+++ b/packages/frontend/src/components/global/MkPageHeader.vue
@@ -11,18 +11,18 @@ SPDX-License-Identifier: AGPL-3.0-only
</div>
<div v-else-if="!thin_ && narrow && !hideTitle" :class="$style.buttonsLeft"/>
- <template v-if="metadata">
+ <template v-if="pageMetadata">
<div v-if="!hideTitle" :class="$style.titleContainer" @click="top">
- <div v-if="metadata.avatar" :class="$style.titleAvatarContainer">
- <MkAvatar :class="$style.titleAvatar" :user="metadata.avatar" indicator/>
+ <div v-if="pageMetadata.avatar" :class="$style.titleAvatarContainer">
+ <MkAvatar :class="$style.titleAvatar" :user="pageMetadata.avatar" indicator/>
</div>
- <i v-else-if="metadata.icon" :class="[$style.titleIcon, metadata.icon]"></i>
+ <i v-else-if="pageMetadata.icon" :class="[$style.titleIcon, pageMetadata.icon]"></i>
<div :class="$style.title">
- <MkUserName v-if="metadata.userName" :user="metadata.userName" :nowrap="true"/>
- <div v-else-if="metadata.title">{{ metadata.title }}</div>
- <div v-if="metadata.subtitle" :class="$style.subtitle">
- {{ metadata.subtitle }}
+ <MkUserName v-if="pageMetadata.userName" :user="pageMetadata.userName" :nowrap="true"/>
+ <div v-else-if="pageMetadata.title">{{ pageMetadata.title }}</div>
+ <div v-if="pageMetadata.subtitle" :class="$style.subtitle">
+ {{ pageMetadata.subtitle }}
</div>
</div>
</div>
@@ -46,7 +46,7 @@ import tinycolor from 'tinycolor2';
import XTabs, { Tab } from './MkPageHeader.tabs.vue';
import { scrollToTop } from '@/scripts/scroll.js';
import { globalEvents } from '@/events.js';
-import { injectPageMetadata } from '@/scripts/page-metadata.js';
+import { injectReactiveMetadata } from '@/scripts/page-metadata.js';
import { $i, openAccountMenu as openAccountMenu_ } from '@/account.js';
import { PageHeaderItem } from '@/types/page-header.js';
@@ -64,7 +64,7 @@ const emit = defineEmits<{
(ev: 'update:tab', key: string);
}>();
-const metadata = injectPageMetadata();
+const pageMetadata = injectReactiveMetadata();
const hideTitle = inject('shouldOmitHeaderTitle', false);
const thin_ = props.thin || inject('shouldHeaderThin', false);
diff --git a/packages/frontend/src/config.ts b/packages/frontend/src/config.ts
index 113d52d0a8474174a8ad52c4ab6f28b865850ed6..277dfc12aa59eba2de5916c75c9db7c4c0570bfa 100644
--- a/packages/frontend/src/config.ts
+++ b/packages/frontend/src/config.ts
@@ -18,7 +18,7 @@ export const langs = _LANGS_;
const preParseLocale = miLocalStorage.getItem('locale');
export let locale = preParseLocale ? JSON.parse(preParseLocale) : null;
export const version = _VERSION_;
-export const instanceName = siteName === 'Misskey' ? host : siteName;
+export const instanceName = siteName === 'Misskey' || siteName == null ? host : siteName;
export const ui = miLocalStorage.getItem('ui');
export const debug = miLocalStorage.getItem('debug') === 'true';
diff --git a/packages/frontend/src/pages/_error_.vue b/packages/frontend/src/pages/_error_.vue
index c5673cbaa06ba36ce452410974a47dd679b833cb..c04f399c6d2b31d6103d5c81c194188130b89afb 100644
--- a/packages/frontend/src/pages/_error_.vue
+++ b/packages/frontend/src/pages/_error_.vue
@@ -67,10 +67,10 @@ const headerActions = computed(() => []);
const headerTabs = computed(() => []);
-definePageMetadata({
+definePageMetadata(() => ({
title: i18n.ts.error,
icon: 'ti ti-alert-triangle',
-});
+}));
</script>
<style lang="scss" module>
diff --git a/packages/frontend/src/pages/about-misskey.vue b/packages/frontend/src/pages/about-misskey.vue
index 5be1634e05fa039a5dec7368d38d7d4a646a618e..a2ecae3b80bcc6edcdefe69d7128f402624b46c8 100644
--- a/packages/frontend/src/pages/about-misskey.vue
+++ b/packages/frontend/src/pages/about-misskey.vue
@@ -363,10 +363,10 @@ const headerActions = computed(() => []);
const headerTabs = computed(() => []);
-definePageMetadata({
+definePageMetadata(() => ({
title: i18n.ts.aboutMisskey,
icon: null,
-});
+}));
</script>
<style lang="scss" scoped>
diff --git a/packages/frontend/src/pages/about.vue b/packages/frontend/src/pages/about.vue
index f5744bab00ccd14fb56dfab91bd401c205a0f453..f99eb9c57777962db9b68afd5f7c3b04bdba2297 100644
--- a/packages/frontend/src/pages/about.vue
+++ b/packages/frontend/src/pages/about.vue
@@ -164,10 +164,10 @@ const headerTabs = computed(() => [{
icon: 'ti ti-chart-line',
}]);
-definePageMetadata(computed(() => ({
+definePageMetadata(() => ({
title: i18n.ts.instanceInfo,
icon: 'ti ti-info-circle',
-})));
+}));
</script>
<style lang="scss" module>
diff --git a/packages/frontend/src/pages/achievements.vue b/packages/frontend/src/pages/achievements.vue
index 74f11f74a76ad84ae1f973ba9e2abe71ab99ee2f..77ab473ea2561f4fe285a3f907e8f71538dd8085 100644
--- a/packages/frontend/src/pages/achievements.vue
+++ b/packages/frontend/src/pages/achievements.vue
@@ -48,10 +48,10 @@ onDeactivated(() => {
}
});
-definePageMetadata({
+definePageMetadata(() => ({
title: i18n.ts.achievements,
icon: 'ti ti-medal',
-});
+}));
</script>
<style lang="scss" module>
diff --git a/packages/frontend/src/pages/admin-file.vue b/packages/frontend/src/pages/admin-file.vue
index 9a57225dabd76ed7f442c2ed39615df97412f9ec..d8311186ab84676851af70999185278b9d3bf81c 100644
--- a/packages/frontend/src/pages/admin-file.vue
+++ b/packages/frontend/src/pages/admin-file.vue
@@ -140,10 +140,10 @@ const headerTabs = computed(() => [{
icon: 'ti ti-code',
}]);
-definePageMetadata(computed(() => ({
- title: file.value ? i18n.ts.file + ': ' + file.value.name : i18n.ts.file,
+definePageMetadata(() => ({
+ title: file.value ? `${i18n.ts.file}: ${file.value.name}` : i18n.ts.file,
icon: 'ti ti-file',
-})));
+}));
</script>
<style lang="scss" scoped>
diff --git a/packages/frontend/src/pages/admin-user.vue b/packages/frontend/src/pages/admin-user.vue
index 83f1ed2773e39589ea111a47925f6c1fecf79e66..2cef55df6c9eb2aafe4d0ee7bbe5a7545d944c3d 100644
--- a/packages/frontend/src/pages/admin-user.vue
+++ b/packages/frontend/src/pages/admin-user.vue
@@ -518,10 +518,10 @@ const headerTabs = computed(() => [{
icon: 'ti ti-code',
}]);
-definePageMetadata(computed(() => ({
+definePageMetadata(() => ({
title: user.value ? acct(user.value) : i18n.ts.userInfo,
icon: 'ti ti-user-exclamation',
-})));
+}));
</script>
<style lang="scss" scoped>
diff --git a/packages/frontend/src/pages/admin/_header_.vue b/packages/frontend/src/pages/admin/_header_.vue
index 9c05329499aa511127c99568198bf39fb59e381c..c5a9609e6ed20c15e304b0974114ce1d6449e690 100644
--- a/packages/frontend/src/pages/admin/_header_.vue
+++ b/packages/frontend/src/pages/admin/_header_.vue
@@ -5,12 +5,12 @@ SPDX-License-Identifier: AGPL-3.0-only
<template>
<div ref="el" class="fdidabkc" :style="{ background: bg }" @click="onClick">
- <template v-if="metadata">
+ <template v-if="pageMetadata">
<div class="titleContainer" @click="showTabsPopup">
- <i v-if="metadata.icon" class="icon" :class="metadata.icon"></i>
+ <i v-if="pageMetadata.icon" class="icon" :class="pageMetadata.icon"></i>
<div class="title">
- <div class="title">{{ metadata.title }}</div>
+ <div class="title">{{ pageMetadata.title }}</div>
</div>
</div>
<div class="tabs">
@@ -39,7 +39,7 @@ import { popupMenu } from '@/os.js';
import { scrollToTop } from '@/scripts/scroll.js';
import MkButton from '@/components/MkButton.vue';
import { globalEvents } from '@/events.js';
-import { injectPageMetadata } from '@/scripts/page-metadata.js';
+import { injectReactiveMetadata } from '@/scripts/page-metadata.js';
type Tab = {
key?: string | null;
@@ -65,7 +65,7 @@ const emit = defineEmits<{
(ev: 'update:tab', key: string);
}>();
-const metadata = injectPageMetadata();
+const pageMetadata = injectReactiveMetadata();
const el = shallowRef<HTMLElement>(null);
const tabRefs = {};
@@ -118,7 +118,7 @@ function onTabClick(tab: Tab, ev: MouseEvent): void {
}
const calcBg = () => {
- const rawBg = metadata?.bg ?? 'var(--bg)';
+ const rawBg = pageMetadata.value?.bg ?? 'var(--bg)';
const tinyBg = tinycolor(rawBg.startsWith('var(') ? getComputedStyle(document.documentElement).getPropertyValue(rawBg.slice(4, -1)) : rawBg);
tinyBg.setAlpha(0.85);
bg.value = tinyBg.toRgbString();
diff --git a/packages/frontend/src/pages/admin/abuses.vue b/packages/frontend/src/pages/admin/abuses.vue
index f16e9d22f71860d87779344359bb2d7a79c555c0..d2f4a4b531e6276339326180eb0f44107f71e14d 100644
--- a/packages/frontend/src/pages/admin/abuses.vue
+++ b/packages/frontend/src/pages/admin/abuses.vue
@@ -87,8 +87,8 @@ const headerActions = computed(() => []);
const headerTabs = computed(() => []);
-definePageMetadata({
+definePageMetadata(() => ({
title: i18n.ts.abuseReports,
icon: 'ti ti-exclamation-circle',
-});
+}));
</script>
diff --git a/packages/frontend/src/pages/admin/ads.vue b/packages/frontend/src/pages/admin/ads.vue
index 72ae14b3e9172a0934033e294c3ab6ec293c6dab..bd442ccc691a4b4dcf0b0d39b854c52168847f42 100644
--- a/packages/frontend/src/pages/admin/ads.vue
+++ b/packages/frontend/src/pages/admin/ads.vue
@@ -255,10 +255,10 @@ const headerActions = computed(() => [{
const headerTabs = computed(() => []);
-definePageMetadata({
+definePageMetadata(() => ({
title: i18n.ts.ads,
icon: 'ti ti-ad',
-});
+}));
</script>
<style lang="scss" module>
diff --git a/packages/frontend/src/pages/admin/announcements.vue b/packages/frontend/src/pages/admin/announcements.vue
index 300af0164056ffb4c719a16abbfbaa0bac9c8f09..e7fb62ec1de8dabc758ed00fd4c658223934648f 100644
--- a/packages/frontend/src/pages/admin/announcements.vue
+++ b/packages/frontend/src/pages/admin/announcements.vue
@@ -157,8 +157,8 @@ const headerActions = computed(() => [{
const headerTabs = computed(() => []);
-definePageMetadata({
+definePageMetadata(() => ({
title: i18n.ts.announcements,
icon: 'ti ti-speakerphone',
-});
+}));
</script>
diff --git a/packages/frontend/src/pages/admin/branding.vue b/packages/frontend/src/pages/admin/branding.vue
index 8fecdca5b87729f6046230f023f3c84261389ec2..4ac2011aafb32169f352c98b9fc2255d67d0da51 100644
--- a/packages/frontend/src/pages/admin/branding.vue
+++ b/packages/frontend/src/pages/admin/branding.vue
@@ -159,10 +159,10 @@ function save() {
const headerTabs = computed(() => []);
-definePageMetadata({
+definePageMetadata(() => ({
title: i18n.ts.branding,
icon: 'ti ti-paint',
-});
+}));
</script>
<style lang="scss" module>
diff --git a/packages/frontend/src/pages/admin/database.vue b/packages/frontend/src/pages/admin/database.vue
index e7c90f5a03fb078aec740ea654890c449b38a728..e092efd92c23a2755708f89a0ce2efc44856a492 100644
--- a/packages/frontend/src/pages/admin/database.vue
+++ b/packages/frontend/src/pages/admin/database.vue
@@ -33,8 +33,8 @@ const headerActions = computed(() => []);
const headerTabs = computed(() => []);
-definePageMetadata({
+definePageMetadata(() => ({
title: i18n.ts.database,
icon: 'ti ti-database',
-});
+}));
</script>
diff --git a/packages/frontend/src/pages/admin/email-settings.vue b/packages/frontend/src/pages/admin/email-settings.vue
index c36ea81a017281bf35223c4f43eb73b4d6620dbd..839b9bee160eb69f2e3928b7a193391b94dd099c 100644
--- a/packages/frontend/src/pages/admin/email-settings.vue
+++ b/packages/frontend/src/pages/admin/email-settings.vue
@@ -130,10 +130,10 @@ function save() {
const headerTabs = computed(() => []);
-definePageMetadata({
+definePageMetadata(() => ({
title: i18n.ts.emailServer,
icon: 'ti ti-mail',
-});
+}));
</script>
<style lang="scss" module>
diff --git a/packages/frontend/src/pages/admin/external-services.vue b/packages/frontend/src/pages/admin/external-services.vue
index 2c9d447c4d363f293d4a489260c2aefb87cf34d9..ba3eb05e72ce62005d16a9fd57a4dbcdf7996c66 100644
--- a/packages/frontend/src/pages/admin/external-services.vue
+++ b/packages/frontend/src/pages/admin/external-services.vue
@@ -69,10 +69,10 @@ const headerActions = computed(() => []);
const headerTabs = computed(() => []);
-definePageMetadata({
+definePageMetadata(() => ({
title: i18n.ts.externalServices,
icon: 'ti ti-link',
-});
+}));
</script>
<style lang="scss" module>
diff --git a/packages/frontend/src/pages/admin/federation.vue b/packages/frontend/src/pages/admin/federation.vue
index 2dd1a968bb63da3df3bfec9edf0c06facb701d1d..de27e1f67a759c8af7a9e9c33ea52add0b84c96a 100644
--- a/packages/frontend/src/pages/admin/federation.vue
+++ b/packages/frontend/src/pages/admin/federation.vue
@@ -102,10 +102,10 @@ const headerActions = computed(() => []);
const headerTabs = computed(() => []);
-definePageMetadata(computed(() => ({
+definePageMetadata(() => ({
title: i18n.ts.federation,
icon: 'ti ti-whirl',
-})));
+}));
</script>
<style lang="scss" module>
diff --git a/packages/frontend/src/pages/admin/files.vue b/packages/frontend/src/pages/admin/files.vue
index eadfe63fa943f35bfaa4273d2c5849a60c744680..3fe021e77102903d3bca61b4c59a027552fbc561 100644
--- a/packages/frontend/src/pages/admin/files.vue
+++ b/packages/frontend/src/pages/admin/files.vue
@@ -108,8 +108,8 @@ const headerActions = computed(() => [{
const headerTabs = computed(() => []);
-definePageMetadata(computed(() => ({
+definePageMetadata(() => ({
title: i18n.ts.files,
icon: 'ti ti-cloud',
-})));
+}));
</script>
diff --git a/packages/frontend/src/pages/admin/index.vue b/packages/frontend/src/pages/admin/index.vue
index d83e14018cba96d4d8f6746d34e39d6d873ff15e..d4a41c66ccb6840e56587a542f3e67575f03e692 100644
--- a/packages/frontend/src/pages/admin/index.vue
+++ b/packages/frontend/src/pages/admin/index.vue
@@ -28,7 +28,7 @@ SPDX-License-Identifier: AGPL-3.0-only
</template>
<script lang="ts" setup>
-import { ComputedRef, Ref, onActivated, onMounted, onUnmounted, provide, watch, ref, computed } from 'vue';
+import { onActivated, onMounted, onUnmounted, provide, watch, ref, computed } from 'vue';
import { i18n } from '@/i18n.js';
import MkSuperMenu from '@/components/MkSuperMenu.vue';
import MkInfo from '@/components/MkInfo.vue';
@@ -36,7 +36,7 @@ import { instance } from '@/instance.js';
import * as os from '@/os.js';
import { misskeyApi } from '@/scripts/misskey-api.js';
import { lookupUser, lookupUserByEmail } from '@/scripts/lookup-user.js';
-import { PageMetadata, definePageMetadata, provideMetadataReceiver } from '@/scripts/page-metadata.js';
+import { PageMetadata, definePageMetadata, provideMetadataReceiver, provideReactiveMetadata } from '@/scripts/page-metadata.js';
import { useRouter } from '@/router/supplier.js';
const isEmpty = (x: string | null) => x == null || x === '';
@@ -52,7 +52,7 @@ const indexInfo = {
provide('shouldOmitHeaderTitle', false);
const INFO = ref(indexInfo);
-const childInfo: Ref<ComputedRef<PageMetadata> | null> = ref(null);
+const childInfo = ref<null | PageMetadata>(null);
const narrow = ref(false);
const view = ref(null);
const el = ref<HTMLDivElement | null>(null);
@@ -257,14 +257,16 @@ watch(router.currentRef, (to) => {
}
});
-provideMetadataReceiver((info) => {
+provideMetadataReceiver((metadataGetter) => {
+ const info = metadataGetter();
if (info == null) {
childInfo.value = null;
} else {
childInfo.value = info;
- INFO.value.needWideArea = info.value.needWideArea ?? undefined;
+ INFO.value.needWideArea = info.needWideArea ?? undefined;
}
});
+provideReactiveMetadata(INFO);
function invite() {
misskeyApi('admin/invite/create').then(x => {
@@ -318,7 +320,7 @@ const headerActions = computed(() => []);
const headerTabs = computed(() => []);
-definePageMetadata(INFO.value);
+definePageMetadata(() => INFO.value);
defineExpose({
header: {
diff --git a/packages/frontend/src/pages/admin/instance-block.vue b/packages/frontend/src/pages/admin/instance-block.vue
index 7cba6823e75ca004c547df6078a0eb95a055dfa9..5167b2e6b219a29cd4ec318261596b214e9330d0 100644
--- a/packages/frontend/src/pages/admin/instance-block.vue
+++ b/packages/frontend/src/pages/admin/instance-block.vue
@@ -66,8 +66,8 @@ const headerTabs = computed(() => [{
icon: 'ti ti-eye-off',
}]);
-definePageMetadata({
+definePageMetadata(() => ({
title: i18n.ts.instanceBlocking,
icon: 'ti ti-ban',
-});
+}));
</script>
diff --git a/packages/frontend/src/pages/admin/invites.vue b/packages/frontend/src/pages/admin/invites.vue
index a2187fbb271319db88560b6732406fc5cc9c273a..95727fb14c0fe320ab81379655b5ab37a0d77af7 100644
--- a/packages/frontend/src/pages/admin/invites.vue
+++ b/packages/frontend/src/pages/admin/invites.vue
@@ -113,10 +113,10 @@ function deleted(id: string) {
const headerActions = computed(() => []);
const headerTabs = computed(() => []);
-definePageMetadata({
+definePageMetadata(() => ({
title: i18n.ts.invite,
icon: 'ti ti-user-plus',
-});
+}));
</script>
<style lang="scss" module>
diff --git a/packages/frontend/src/pages/admin/moderation.vue b/packages/frontend/src/pages/admin/moderation.vue
index ae0606ed0da118d10386ccef8cb1b8b6a9b0e8ec..d6cb1e39a76ac12a92d777c6ba607c9944c3db8d 100644
--- a/packages/frontend/src/pages/admin/moderation.vue
+++ b/packages/frontend/src/pages/admin/moderation.vue
@@ -116,10 +116,10 @@ function save() {
const headerTabs = computed(() => []);
-definePageMetadata({
+definePageMetadata(() => ({
title: i18n.ts.moderation,
icon: 'ti ti-shield',
-});
+}));
</script>
<style lang="scss" module>
diff --git a/packages/frontend/src/pages/admin/modlog.vue b/packages/frontend/src/pages/admin/modlog.vue
index 7cfd530790ac9d3566d0fbb85a947e681032ae09..5e251b8a6f87adbebb735689a9f8c13501286309 100644
--- a/packages/frontend/src/pages/admin/modlog.vue
+++ b/packages/frontend/src/pages/admin/modlog.vue
@@ -60,8 +60,8 @@ const headerActions = computed(() => []);
const headerTabs = computed(() => []);
-definePageMetadata({
+definePageMetadata(() => ({
title: i18n.ts.moderationLogs,
icon: 'ti ti-list-search',
-});
+}));
</script>
diff --git a/packages/frontend/src/pages/admin/object-storage.vue b/packages/frontend/src/pages/admin/object-storage.vue
index 2d26eb0fb09db888bb9258c6bb4e2dd85e3f3724..4ff5ab09ca485f6280e985d2760728e3a9d6884b 100644
--- a/packages/frontend/src/pages/admin/object-storage.vue
+++ b/packages/frontend/src/pages/admin/object-storage.vue
@@ -149,10 +149,10 @@ function save() {
const headerTabs = computed(() => []);
-definePageMetadata({
+definePageMetadata(() => ({
title: i18n.ts.objectStorage,
icon: 'ti ti-cloud',
-});
+}));
</script>
<style lang="scss" module>
diff --git a/packages/frontend/src/pages/admin/other-settings.vue b/packages/frontend/src/pages/admin/other-settings.vue
index b9a34b8bc48abf48851bfad3f85c0a338e972a36..651f0ef93692bd2bb84bf9d73807a53dd267e7b9 100644
--- a/packages/frontend/src/pages/admin/other-settings.vue
+++ b/packages/frontend/src/pages/admin/other-settings.vue
@@ -86,8 +86,8 @@ const headerActions = computed(() => [{
const headerTabs = computed(() => []);
-definePageMetadata({
+definePageMetadata(() => ({
title: i18n.ts.other,
icon: 'ti ti-adjustments',
-});
+}));
</script>
diff --git a/packages/frontend/src/pages/admin/overview.vue b/packages/frontend/src/pages/admin/overview.vue
index c580f5781b49f4cd555189892b5bd723046c4ba2..1de4dc0dc88ff01a310e9570c8a6031aadc592df 100644
--- a/packages/frontend/src/pages/admin/overview.vue
+++ b/packages/frontend/src/pages/admin/overview.vue
@@ -184,10 +184,10 @@ const headerActions = computed(() => []);
const headerTabs = computed(() => []);
-definePageMetadata({
+definePageMetadata(() => ({
title: i18n.ts.dashboard,
icon: 'ti ti-dashboard',
-});
+}));
</script>
<style lang="scss" module>
diff --git a/packages/frontend/src/pages/admin/proxy-account.vue b/packages/frontend/src/pages/admin/proxy-account.vue
index 85c9812e8540e93c41f4da424828ccd26e9e7ead..02b506d13dae01987eab6820ff9abf04dc4ce8fe 100644
--- a/packages/frontend/src/pages/admin/proxy-account.vue
+++ b/packages/frontend/src/pages/admin/proxy-account.vue
@@ -64,8 +64,8 @@ const headerActions = computed(() => []);
const headerTabs = computed(() => []);
-definePageMetadata({
+definePageMetadata(() => ({
title: i18n.ts.proxyAccount,
icon: 'ti ti-ghost',
-});
+}));
</script>
diff --git a/packages/frontend/src/pages/admin/queue.vue b/packages/frontend/src/pages/admin/queue.vue
index 0466649e9e5790a2bcc56e86bfde1200dff6d008..8d77d927d7bfc04310794648d1611f40af7f385e 100644
--- a/packages/frontend/src/pages/admin/queue.vue
+++ b/packages/frontend/src/pages/admin/queue.vue
@@ -68,8 +68,8 @@ const headerTabs = computed(() => [{
title: 'Inbox',
}]);
-definePageMetadata({
+definePageMetadata(() => ({
title: i18n.ts.jobQueue,
icon: 'ti ti-clock-play',
-});
+}));
</script>
diff --git a/packages/frontend/src/pages/admin/relays.vue b/packages/frontend/src/pages/admin/relays.vue
index ea80822e535d41e6f69cdc63dd3156611df0b4c7..04982eea1fabdd1944ecec2f241346379ea7f5da 100644
--- a/packages/frontend/src/pages/admin/relays.vue
+++ b/packages/frontend/src/pages/admin/relays.vue
@@ -84,10 +84,10 @@ const headerActions = computed(() => [{
const headerTabs = computed(() => []);
-definePageMetadata({
+definePageMetadata(() => ({
title: i18n.ts.relays,
icon: 'ti ti-planet',
-});
+}));
</script>
<style lang="scss" module>
diff --git a/packages/frontend/src/pages/admin/roles.edit.vue b/packages/frontend/src/pages/admin/roles.edit.vue
index 5d0dbe789e5553ad9dd823c3fbe8bd849588411c..60f06d50badb2f284e1965dab9b39b8e87470a3c 100644
--- a/packages/frontend/src/pages/admin/roles.edit.vue
+++ b/packages/frontend/src/pages/admin/roles.edit.vue
@@ -87,11 +87,8 @@ async function save() {
const headerTabs = computed(() => []);
-definePageMetadata(computed(() => role.value ? {
- title: i18n.ts._role.edit + ': ' + role.value.name,
- icon: 'ti ti-badge',
-} : {
- title: i18n.ts._role.new,
+definePageMetadata(() => ({
+ title: role.value ? `${i18n.ts._role.edit}: ${role.value.name}` : i18n.ts._role.new,
icon: 'ti ti-badge',
}));
</script>
diff --git a/packages/frontend/src/pages/admin/roles.role.vue b/packages/frontend/src/pages/admin/roles.role.vue
index 87b5dc7f5c0f6f17efca48eb677da05c6b05c4a1..ab8005045bddcf01398bdaf95041fbfbc271dc5b 100644
--- a/packages/frontend/src/pages/admin/roles.role.vue
+++ b/packages/frontend/src/pages/admin/roles.role.vue
@@ -170,10 +170,10 @@ const headerActions = computed(() => []);
const headerTabs = computed(() => []);
-definePageMetadata(computed(() => ({
- title: i18n.ts.role + ': ' + role.name,
+definePageMetadata(() => ({
+ title: `${i18n.ts.role}: ${role.name}`,
icon: 'ti ti-badge',
-})));
+}));
</script>
<style lang="scss" module>
diff --git a/packages/frontend/src/pages/admin/roles.vue b/packages/frontend/src/pages/admin/roles.vue
index 44b6c0a25cc75c909c9cdd063b6545753db59f5c..496cb096645f07417b38763c1daf4b428f8fd03e 100644
--- a/packages/frontend/src/pages/admin/roles.vue
+++ b/packages/frontend/src/pages/admin/roles.vue
@@ -270,10 +270,10 @@ const headerActions = computed(() => []);
const headerTabs = computed(() => []);
-definePageMetadata(computed(() => ({
+definePageMetadata(() => ({
title: i18n.ts.roles,
icon: 'ti ti-badges',
-})));
+}));
</script>
<style lang="scss" module>
diff --git a/packages/frontend/src/pages/admin/security.vue b/packages/frontend/src/pages/admin/security.vue
index 6a0b3fe79302eda039985b4701441337d2aedaff..cadcf5a8cc6d4fb7853b8c5584420ac222a48a75 100644
--- a/packages/frontend/src/pages/admin/security.vue
+++ b/packages/frontend/src/pages/admin/security.vue
@@ -229,8 +229,8 @@ const headerActions = computed(() => []);
const headerTabs = computed(() => []);
-definePageMetadata({
+definePageMetadata(() => ({
title: i18n.ts.security,
icon: 'ti ti-lock',
-});
+}));
</script>
diff --git a/packages/frontend/src/pages/admin/server-rules.vue b/packages/frontend/src/pages/admin/server-rules.vue
index daea420988c0131ccc4594a2ece45c64ee7f7283..87318bccce006819a52f9048c705853b2b7683b8 100644
--- a/packages/frontend/src/pages/admin/server-rules.vue
+++ b/packages/frontend/src/pages/admin/server-rules.vue
@@ -67,10 +67,10 @@ const remove = (index: number): void => {
const headerTabs = computed(() => []);
-definePageMetadata({
+definePageMetadata(() => ({
title: i18n.ts.serverRules,
icon: 'ti ti-checkbox',
-});
+}));
</script>
<style lang="scss" module>
diff --git a/packages/frontend/src/pages/admin/settings.vue b/packages/frontend/src/pages/admin/settings.vue
index ea57176fffcf5d1d6d295a8433baac0d42cc365a..8af9deae62507d6a8764c782985e2fce788d6860 100644
--- a/packages/frontend/src/pages/admin/settings.vue
+++ b/packages/frontend/src/pages/admin/settings.vue
@@ -235,10 +235,10 @@ async function save(): void {
const headerTabs = computed(() => []);
-definePageMetadata({
+definePageMetadata(() => ({
title: i18n.ts.general,
icon: 'ti ti-settings',
-});
+}));
</script>
<style lang="scss" module>
diff --git a/packages/frontend/src/pages/admin/users.vue b/packages/frontend/src/pages/admin/users.vue
index 888a27906abe111fb58ddb614535fb0c3d96b807..06317760d2acd656d3eb861993c6e6a8d3a902c1 100644
--- a/packages/frontend/src/pages/admin/users.vue
+++ b/packages/frontend/src/pages/admin/users.vue
@@ -137,10 +137,10 @@ const headerActions = computed(() => [{
const headerTabs = computed(() => []);
-definePageMetadata(computed(() => ({
+definePageMetadata(() => ({
title: i18n.ts.users,
icon: 'ti ti-users',
-})));
+}));
</script>
<style lang="scss" module>
diff --git a/packages/frontend/src/pages/ads.vue b/packages/frontend/src/pages/ads.vue
index e6b12385838b4d2cd0d8cf831ba29ffa0be2a4f0..b31807f9f5dee8e4a3c36254166efc24be4f0c1d 100644
--- a/packages/frontend/src/pages/ads.vue
+++ b/packages/frontend/src/pages/ads.vue
@@ -20,9 +20,9 @@ import { definePageMetadata } from '@/scripts/page-metadata.js';
import { i18n } from '@/i18n.js';
import { instance } from '@/instance.js';
-definePageMetadata({
+definePageMetadata(() => ({
title: i18n.ts.ads,
icon: 'ti ti-ad',
-});
+}));
</script>
diff --git a/packages/frontend/src/pages/announcements.vue b/packages/frontend/src/pages/announcements.vue
index 1c4efe91d1d9df454c741aac7fa388708fd5fc31..bcd6eb7c0ff6fc9464574229de38336b05704f26 100644
--- a/packages/frontend/src/pages/announcements.vue
+++ b/packages/frontend/src/pages/announcements.vue
@@ -106,10 +106,10 @@ const headerTabs = computed(() => [{
icon: 'ti ti-point',
}]);
-definePageMetadata({
+definePageMetadata(() => ({
title: i18n.ts.announcements,
icon: 'ti ti-speakerphone',
-});
+}));
</script>
<style lang="scss" module>
diff --git a/packages/frontend/src/pages/antenna-timeline.vue b/packages/frontend/src/pages/antenna-timeline.vue
index 7a480205374d7a97c429e2b5bbdcde5aaea77402..273250d1d000177d5aafa6ba7fc582a2fe0b10ae 100644
--- a/packages/frontend/src/pages/antenna-timeline.vue
+++ b/packages/frontend/src/pages/antenna-timeline.vue
@@ -91,10 +91,10 @@ const headerActions = computed(() => antenna.value ? [{
const headerTabs = computed(() => []);
-definePageMetadata(computed(() => antenna.value ? {
- title: antenna.value.name,
+definePageMetadata(() => ({
+ title: antenna.value ? antenna.value.name : i18n.ts.antennas,
icon: 'ti ti-antenna',
-} : null));
+}));
</script>
<style lang="scss" module>
diff --git a/packages/frontend/src/pages/api-console.vue b/packages/frontend/src/pages/api-console.vue
index 5e794a975c594eca36a4b3992923fe6a9c7c6c08..30f12a8fb39bd143888e7955ea9af7301200e88d 100644
--- a/packages/frontend/src/pages/api-console.vue
+++ b/packages/frontend/src/pages/api-console.vue
@@ -87,8 +87,8 @@ const headerActions = computed(() => []);
const headerTabs = computed(() => []);
-definePageMetadata({
+definePageMetadata(() => ({
title: 'API console',
icon: 'ti ti-terminal-2',
-});
+}));
</script>
diff --git a/packages/frontend/src/pages/auth.vue b/packages/frontend/src/pages/auth.vue
index b30b2b50e7d176c729b74cf2a717d46b3ed7e362..d8f8d0b4285868d6fce6ae8b6891f9e0016410fa 100644
--- a/packages/frontend/src/pages/auth.vue
+++ b/packages/frontend/src/pages/auth.vue
@@ -97,10 +97,10 @@ const headerActions = computed(() => []);
const headerTabs = computed(() => []);
-definePageMetadata({
+definePageMetadata(() => ({
title: i18n.ts._auth.shareAccessTitle,
icon: 'ti ti-apps',
-});
+}));
</script>
<style lang="scss" module>
diff --git a/packages/frontend/src/pages/avatar-decorations.vue b/packages/frontend/src/pages/avatar-decorations.vue
index 66f724cd62ba840bfde646dd759df830ce075ea3..ad9ec3c4eecec5f4c20b2b2fd3be48793a950e88 100644
--- a/packages/frontend/src/pages/avatar-decorations.vue
+++ b/packages/frontend/src/pages/avatar-decorations.vue
@@ -94,8 +94,8 @@ const headerActions = computed(() => [{
const headerTabs = computed(() => []);
-definePageMetadata({
+definePageMetadata(() => ({
title: i18n.ts.avatarDecorations,
icon: 'ti ti-sparkles',
-});
+}));
</script>
diff --git a/packages/frontend/src/pages/channel-editor.vue b/packages/frontend/src/pages/channel-editor.vue
index 1c0da4f9bd739a3c5aebbdbb4fcbfb129da6c982..d3f4a65b893256e5e3b9a26ceddf8d723c33a85c 100644
--- a/packages/frontend/src/pages/channel-editor.vue
+++ b/packages/frontend/src/pages/channel-editor.vue
@@ -202,11 +202,8 @@ const headerActions = computed(() => []);
const headerTabs = computed(() => []);
-definePageMetadata(computed(() => props.channelId ? {
- title: i18n.ts._channel.edit,
- icon: 'ti ti-device-tv',
-} : {
- title: i18n.ts._channel.create,
+definePageMetadata(() => ({
+ title: props.channelId ? i18n.ts._channel.edit : i18n.ts._channel.create,
icon: 'ti ti-device-tv',
}));
</script>
diff --git a/packages/frontend/src/pages/channel.vue b/packages/frontend/src/pages/channel.vue
index 10cdb70a5110ffdab9ee5151ffd7bce6c0a58304..611ae6feca0f5abc3c5ccad35871e5408acf198d 100644
--- a/packages/frontend/src/pages/channel.vue
+++ b/packages/frontend/src/pages/channel.vue
@@ -258,10 +258,10 @@ const headerTabs = computed(() => [{
icon: 'ti ti-search',
}]);
-definePageMetadata(computed(() => channel.value ? {
- title: channel.value.name,
+definePageMetadata(() => ({
+ title: channel.value ? channel.value.name : i18n.ts.channel,
icon: 'ti ti-device-tv',
-} : null));
+}));
</script>
<style lang="scss" module>
diff --git a/packages/frontend/src/pages/channels.vue b/packages/frontend/src/pages/channels.vue
index 3d3e1c8d78942a3ae815a03952ca9bef405ca5e2..bde1650754abc95d12181aa6c5fddad6988abfc4 100644
--- a/packages/frontend/src/pages/channels.vue
+++ b/packages/frontend/src/pages/channels.vue
@@ -152,8 +152,8 @@ const headerTabs = computed(() => [{
icon: 'ti ti-edit',
}]);
-definePageMetadata(computed(() => ({
+definePageMetadata(() => ({
title: i18n.ts.channel,
icon: 'ti ti-device-tv',
-})));
+}));
</script>
diff --git a/packages/frontend/src/pages/clicker.vue b/packages/frontend/src/pages/clicker.vue
index fe4080da3d93cfa61354dd80641d62ba3f074bb1..9e9b5e8688a293dbf19e9b62796cbd90848b39f9 100644
--- a/packages/frontend/src/pages/clicker.vue
+++ b/packages/frontend/src/pages/clicker.vue
@@ -16,10 +16,10 @@ SPDX-License-Identifier: AGPL-3.0-only
import MkClickerGame from '@/components/MkClickerGame.vue';
import { definePageMetadata } from '@/scripts/page-metadata.js';
-definePageMetadata({
+definePageMetadata(() => ({
title: 'ðŸªðŸ‘ˆ',
icon: 'ti ti-cookie',
-});
+}));
</script>
<style lang="scss" module>
diff --git a/packages/frontend/src/pages/clip.vue b/packages/frontend/src/pages/clip.vue
index b3f72d889dfd8d65462943a8e23b02f3f1884137..c38cc117bcd46c21e272b3336214a6149fafd75a 100644
--- a/packages/frontend/src/pages/clip.vue
+++ b/packages/frontend/src/pages/clip.vue
@@ -157,10 +157,10 @@ const headerActions = computed(() => clip.value && isOwned.value ? [{
},
}] : null);
-definePageMetadata(computed(() => clip.value ? {
- title: clip.value.name,
+definePageMetadata(() => ({
+ title: clip.value ? clip.value.name : i18n.ts.clip,
icon: 'ti ti-paperclip',
-} : null));
+}));
</script>
<style lang="scss" module>
diff --git a/packages/frontend/src/pages/custom-emojis-manager.vue b/packages/frontend/src/pages/custom-emojis-manager.vue
index ea37b1b398d418bad96c6e352ffd67e22252be72..3e2332e4082d1bea52950605f65231173d1e90b8 100644
--- a/packages/frontend/src/pages/custom-emojis-manager.vue
+++ b/packages/frontend/src/pages/custom-emojis-manager.vue
@@ -305,10 +305,10 @@ const headerTabs = computed(() => [{
title: i18n.ts.remote,
}]);
-definePageMetadata(computed(() => ({
+definePageMetadata(() => ({
title: i18n.ts.customEmojis,
icon: 'ti ti-icons',
-})));
+}));
</script>
<style lang="scss" scoped>
diff --git a/packages/frontend/src/pages/drive.file.vue b/packages/frontend/src/pages/drive.file.vue
index 255d07f251aa4f2d9485b91ffbe0e323d5e1d677..5711ec8b3a0f9bf92446f8bdd6d7610b4bea67e2 100644
--- a/packages/frontend/src/pages/drive.file.vue
+++ b/packages/frontend/src/pages/drive.file.vue
@@ -48,8 +48,8 @@ const headerTabs = computed(() => [{
icon: 'ti ti-pencil',
}]);
-definePageMetadata(computed(() => ({
+definePageMetadata(() => ({
title: i18n.ts._fileViewer.title,
icon: 'ti ti-file',
-})));
+}));
</script>
diff --git a/packages/frontend/src/pages/drive.vue b/packages/frontend/src/pages/drive.vue
index fa02319fe04474769bce1071877f16f536cb423b..25e140f67fdc0024b923af9b0cd627312d705fc0 100644
--- a/packages/frontend/src/pages/drive.vue
+++ b/packages/frontend/src/pages/drive.vue
@@ -22,9 +22,9 @@ const headerActions = computed(() => []);
const headerTabs = computed(() => []);
-definePageMetadata(computed(() => ({
+definePageMetadata(() => ({
title: folder.value ? folder.value.name : i18n.ts.drive,
icon: 'ti ti-cloud',
hideHeader: true,
-})));
+}));
</script>
diff --git a/packages/frontend/src/pages/drop-and-fusion.game.vue b/packages/frontend/src/pages/drop-and-fusion.game.vue
index 0f52835bb7f63a426f887533c148b819f031b739..d9881cebbf04c4d1558821e87459ea05f75f39cc 100644
--- a/packages/frontend/src/pages/drop-and-fusion.game.vue
+++ b/packages/frontend/src/pages/drop-and-fusion.game.vue
@@ -1204,10 +1204,10 @@ onDeactivated(() => {
bgmNodes?.soundSource.stop();
});
-definePageMetadata({
+definePageMetadata(() => ({
title: i18n.ts.bubbleGame,
icon: 'ti ti-apple',
-});
+}));
</script>
<style lang="scss" module>
diff --git a/packages/frontend/src/pages/drop-and-fusion.vue b/packages/frontend/src/pages/drop-and-fusion.vue
index d749c149091f68cdd9f4cfbaf6f4761531fabcc9..1b11457988387ccf57523b2e6e8eceb36d342888 100644
--- a/packages/frontend/src/pages/drop-and-fusion.vue
+++ b/packages/frontend/src/pages/drop-and-fusion.vue
@@ -121,10 +121,10 @@ function onGameEnd() {
gameStarted.value = false;
}
-definePageMetadata({
+definePageMetadata(() => ({
title: i18n.ts.bubbleGame,
icon: 'ti ti-device-gamepad',
-});
+}));
</script>
<style lang="scss" module>
diff --git a/packages/frontend/src/pages/explore.vue b/packages/frontend/src/pages/explore.vue
index 1c1ddb8de001b6d116104cdb0a17b071975ca62b..b1a8183d9b8bec3158395be8cb1c2d7882c0dc97 100644
--- a/packages/frontend/src/pages/explore.vue
+++ b/packages/frontend/src/pages/explore.vue
@@ -60,8 +60,8 @@ const headerTabs = computed(() => [{
title: i18n.ts.roles,
}]);
-definePageMetadata(computed(() => ({
+definePageMetadata(() => ({
title: i18n.ts.explore,
icon: 'ti ti-hash',
-})));
+}));
</script>
diff --git a/packages/frontend/src/pages/favorites.vue b/packages/frontend/src/pages/favorites.vue
index 1dd6436409cd61e0305877bce85186d7e19b7af0..c3d4cae4aa746e271b37ef2a8827ddb470a3e6e7 100644
--- a/packages/frontend/src/pages/favorites.vue
+++ b/packages/frontend/src/pages/favorites.vue
@@ -38,10 +38,10 @@ const pagination = {
limit: 10,
};
-definePageMetadata({
+definePageMetadata(() => ({
title: i18n.ts.favorites,
icon: 'ti ti-star',
-});
+}));
</script>
<style lang="scss" module>
diff --git a/packages/frontend/src/pages/flash/flash-edit.vue b/packages/frontend/src/pages/flash/flash-edit.vue
index a1981318d1d5aab585bc7b4b1bdb2d69b91568d6..4418172e629c48857a666c2f29778018aa310726 100644
--- a/packages/frontend/src/pages/flash/flash-edit.vue
+++ b/packages/frontend/src/pages/flash/flash-edit.vue
@@ -452,9 +452,7 @@ const headerActions = computed(() => []);
const headerTabs = computed(() => []);
-definePageMetadata(computed(() => flash.value ? {
- title: i18n.ts._play.edit + ': ' + flash.value.title,
-} : {
- title: i18n.ts._play.new,
+definePageMetadata(() => ({
+ title: flash.value ? `${i18n.ts._play.edit}: ${flash.value.title}` : i18n.ts._play.new,
}));
</script>
diff --git a/packages/frontend/src/pages/flash/flash-index.vue b/packages/frontend/src/pages/flash/flash-index.vue
index 7ac06fc4277b66895e94ab17cd1afac6c2c30643..f63a799365de1bdcb46e37f26ac75bc539d0091f 100644
--- a/packages/frontend/src/pages/flash/flash-index.vue
+++ b/packages/frontend/src/pages/flash/flash-index.vue
@@ -90,8 +90,8 @@ const headerTabs = computed(() => [{
icon: 'ti ti-heart',
}]);
-definePageMetadata(computed(() => ({
+definePageMetadata(() => ({
title: 'Play',
icon: 'ti ti-player-play',
-})));
+}));
</script>
diff --git a/packages/frontend/src/pages/flash/flash.vue b/packages/frontend/src/pages/flash/flash.vue
index 41c25d60821039e3ce24fe12170f6882308f68b9..4aa3ce1672e3698423424ee3d616d46bd661546f 100644
--- a/packages/frontend/src/pages/flash/flash.vue
+++ b/packages/frontend/src/pages/flash/flash.vue
@@ -205,15 +205,17 @@ const headerActions = computed(() => []);
const headerTabs = computed(() => []);
-definePageMetadata(computed(() => flash.value ? {
- title: flash.value.title,
- avatar: flash.value.user,
- path: `/play/${flash.value.id}`,
- share: {
- title: flash.value.title,
- text: flash.value.summary,
- },
-} : null));
+definePageMetadata(() => ({
+ title: flash.value ? flash.value.title : 'Play',
+ ...flash.value ? {
+ avatar: flash.value.user,
+ path: `/play/${flash.value.id}`,
+ share: {
+ title: flash.value.title,
+ text: flash.value.summary,
+ },
+ } : {},
+}));
</script>
<style lang="scss" module>
diff --git a/packages/frontend/src/pages/follow-requests.vue b/packages/frontend/src/pages/follow-requests.vue
index b57a42b92ab7212fb6360c5cd8eaf382c2747d51..8991af80862798285406083fe5f17dee81ab9ded 100644
--- a/packages/frontend/src/pages/follow-requests.vue
+++ b/packages/frontend/src/pages/follow-requests.vue
@@ -69,10 +69,10 @@ const headerActions = computed(() => []);
const headerTabs = computed(() => []);
-definePageMetadata(computed(() => ({
+definePageMetadata(() => ({
title: i18n.ts.followRequests,
icon: 'ti ti-user-plus',
-})));
+}));
</script>
<style lang="scss" scoped>
diff --git a/packages/frontend/src/pages/gallery/edit.vue b/packages/frontend/src/pages/gallery/edit.vue
index 270d125dcda749ea9513d1613913690e27824c04..a68a7e5c41425ddfe3494b3af9a33b67224d4d06 100644
--- a/packages/frontend/src/pages/gallery/edit.vue
+++ b/packages/frontend/src/pages/gallery/edit.vue
@@ -122,11 +122,8 @@ const headerActions = computed(() => []);
const headerTabs = computed(() => []);
-definePageMetadata(computed(() => props.postId ? {
- title: i18n.ts.edit,
- icon: 'ti ti-pencil',
-} : {
- title: i18n.ts.postToGallery,
+definePageMetadata(() => ({
+ title: props.postId ? i18n.ts.edit : i18n.ts.postToGallery,
icon: 'ti ti-pencil',
}));
</script>
diff --git a/packages/frontend/src/pages/gallery/index.vue b/packages/frontend/src/pages/gallery/index.vue
index 70444a5ef4f34eb14ab8c9e0625fed683cf23cdd..e0e187f2ce085942a47d023520911791fc518d3b 100644
--- a/packages/frontend/src/pages/gallery/index.vue
+++ b/packages/frontend/src/pages/gallery/index.vue
@@ -119,10 +119,10 @@ const headerTabs = computed(() => [{
icon: 'ti ti-edit',
}]);
-definePageMetadata({
+definePageMetadata(() => ({
title: i18n.ts.gallery,
icon: 'ti ti-icons',
-});
+}));
</script>
<style lang="scss" module>
diff --git a/packages/frontend/src/pages/gallery/post.vue b/packages/frontend/src/pages/gallery/post.vue
index c5c8248f8673396e85720311d6b37e2154667797..615675225d8df51518478ace5bb491db66d6635e 100644
--- a/packages/frontend/src/pages/gallery/post.vue
+++ b/packages/frontend/src/pages/gallery/post.vue
@@ -163,10 +163,12 @@ const headerActions = computed(() => [{
const headerTabs = computed(() => []);
-definePageMetadata(computed(() => post.value ? {
- title: post.value.title,
- avatar: post.value.user,
-} : null));
+definePageMetadata(() => ({
+ title: post.value ? post.value.title : i18n.ts.gallery,
+ ...post.value ? {
+ avatar: post.value.user,
+ } : {},
+}));
</script>
<style lang="scss" scoped>
diff --git a/packages/frontend/src/pages/games.vue b/packages/frontend/src/pages/games.vue
index 606d08e33b0e5ccc2bdb2e0858f02b9c7fd1bd23..afd6df1ad9f9356496d8356ec9971de3c17ffbad 100644
--- a/packages/frontend/src/pages/games.vue
+++ b/packages/frontend/src/pages/games.vue
@@ -27,8 +27,8 @@ SPDX-License-Identifier: AGPL-3.0-only
import { i18n } from '@/i18n.js';
import { definePageMetadata } from '@/scripts/page-metadata.js';
-definePageMetadata({
+definePageMetadata(() => ({
title: 'Misskey Games',
icon: 'ti ti-device-gamepad',
-});
+}));
</script>
diff --git a/packages/frontend/src/pages/install-extensions.vue b/packages/frontend/src/pages/install-extensions.vue
index 0b129435c193f428338782c1a88d6bc104ff5989..4bee437f65820c9188b830ee01b03aaa1e94689c 100644
--- a/packages/frontend/src/pages/install-extensions.vue
+++ b/packages/frontend/src/pages/install-extensions.vue
@@ -312,10 +312,10 @@ const headerActions = computed(() => []);
const headerTabs = computed(() => []);
-definePageMetadata({
+definePageMetadata(() => ({
title: i18n.ts._externalResourceInstaller.title,
icon: 'ti ti-download',
-});
+}));
</script>
<style lang="scss" module>
diff --git a/packages/frontend/src/pages/instance-info.vue b/packages/frontend/src/pages/instance-info.vue
index 49ea1c64b538e0f373c0d119bebf2afabdd5bcbd..2f1557182a3894617556d9d59e41990af84467c5 100644
--- a/packages/frontend/src/pages/instance-info.vue
+++ b/packages/frontend/src/pages/instance-info.vue
@@ -245,10 +245,10 @@ const headerTabs = computed(() => [{
icon: 'ti ti-code',
}]);
-definePageMetadata({
+definePageMetadata(() => ({
title: props.host,
icon: 'ti ti-server',
-});
+}));
</script>
<style lang="scss" scoped>
diff --git a/packages/frontend/src/pages/invite.vue b/packages/frontend/src/pages/invite.vue
index cd822ef1dbda027f6a7e1b45d8967011eece031c..25e56d2b8df3ae44336b05679d57c892a33a8d27 100644
--- a/packages/frontend/src/pages/invite.vue
+++ b/packages/frontend/src/pages/invite.vue
@@ -93,10 +93,10 @@ async function update() {
update();
-definePageMetadata({
+definePageMetadata(() => ({
title: i18n.ts.invite,
icon: 'ti ti-user-plus',
-});
+}));
</script>
<style lang="scss" module>
diff --git a/packages/frontend/src/pages/list.vue b/packages/frontend/src/pages/list.vue
index b2c178aebe644454c900400cf647efa3ff9d2260..954246ff93f943b056e8346d6be37dd412f0b723 100644
--- a/packages/frontend/src/pages/list.vue
+++ b/packages/frontend/src/pages/list.vue
@@ -101,10 +101,10 @@ const headerActions = computed(() => []);
const headerTabs = computed(() => []);
-definePageMetadata(computed(() => list.value ? {
- title: list.value.name,
+definePageMetadata(() => ({
+ title: list.value ? list.value.name : i18n.ts.lists,
icon: 'ti ti-list',
-} : null));
+}));
</script>
<style lang="scss" module>
.main {
diff --git a/packages/frontend/src/pages/miauth.vue b/packages/frontend/src/pages/miauth.vue
index a545b5267c4bf24025e41ca1420b8e6de9a4a278..ffaf739ed0f42cb3dd3a97316eaf98168dd0e8d6 100644
--- a/packages/frontend/src/pages/miauth.vue
+++ b/packages/frontend/src/pages/miauth.vue
@@ -93,10 +93,10 @@ const headerActions = computed(() => []);
const headerTabs = computed(() => []);
-definePageMetadata({
+definePageMetadata(() => ({
title: 'MiAuth',
icon: 'ti ti-apps',
-});
+}));
</script>
<style lang="scss" module>
diff --git a/packages/frontend/src/pages/my-antennas/create.vue b/packages/frontend/src/pages/my-antennas/create.vue
index 8b35699e68cf36637e26aee35984c0aa641456ae..8b3b3cfbfd40067ec0997b69322dc47d91406112 100644
--- a/packages/frontend/src/pages/my-antennas/create.vue
+++ b/packages/frontend/src/pages/my-antennas/create.vue
@@ -38,8 +38,8 @@ function onAntennaCreated() {
router.push('/my/antennas');
}
-definePageMetadata({
+definePageMetadata(() => ({
title: i18n.ts.manageAntennas,
icon: 'ti ti-antenna',
-});
+}));
</script>
diff --git a/packages/frontend/src/pages/my-antennas/edit.vue b/packages/frontend/src/pages/my-antennas/edit.vue
index acdeca4ea8ee68a135a308bb37727567d081a0ee..9471be85750d174bddf66b161adf314bd66896ce 100644
--- a/packages/frontend/src/pages/my-antennas/edit.vue
+++ b/packages/frontend/src/pages/my-antennas/edit.vue
@@ -36,8 +36,8 @@ misskeyApi('antennas/show', { antennaId: props.antennaId }).then((antennaRespons
antenna.value = antennaResponse;
});
-definePageMetadata({
+definePageMetadata(() => ({
title: i18n.ts.manageAntennas,
icon: 'ti ti-antenna',
-});
+}));
</script>
diff --git a/packages/frontend/src/pages/my-antennas/index.vue b/packages/frontend/src/pages/my-antennas/index.vue
index 2e9ea7cc93df3e6264f2bee4dc2b66b13132a0f9..21c96348f0aaec5880ff3c395fadbf1fe2c472db 100644
--- a/packages/frontend/src/pages/my-antennas/index.vue
+++ b/packages/frontend/src/pages/my-antennas/index.vue
@@ -55,10 +55,10 @@ const headerActions = computed(() => [{
const headerTabs = computed(() => []);
-definePageMetadata({
+definePageMetadata(() => ({
title: i18n.ts.manageAntennas,
icon: 'ti ti-antenna',
-});
+}));
onActivated(() => {
antennasCache.fetch();
diff --git a/packages/frontend/src/pages/my-clips/index.vue b/packages/frontend/src/pages/my-clips/index.vue
index 90ef26dbc72ca69e01446115bd75c09a25f36958..803b28899a8596fb408d4b353439da2162c7e312 100644
--- a/packages/frontend/src/pages/my-clips/index.vue
+++ b/packages/frontend/src/pages/my-clips/index.vue
@@ -104,14 +104,10 @@ const headerTabs = computed(() => [{
icon: 'ti ti-heart',
}]);
-definePageMetadata({
+definePageMetadata(() => ({
title: i18n.ts.clip,
icon: 'ti ti-paperclip',
- action: {
- icon: 'ti ti-plus',
- handler: create,
- },
-});
+}));
</script>
<style lang="scss" module>
diff --git a/packages/frontend/src/pages/my-lists/index.vue b/packages/frontend/src/pages/my-lists/index.vue
index bb56415819b4f5b581f49d3182135a165e108ccf..82fde284c16bad04178e28d6320914afb7997148 100644
--- a/packages/frontend/src/pages/my-lists/index.vue
+++ b/packages/frontend/src/pages/my-lists/index.vue
@@ -71,10 +71,10 @@ const headerActions = computed(() => [{
const headerTabs = computed(() => []);
-definePageMetadata({
+definePageMetadata(() => ({
title: i18n.ts.manageLists,
icon: 'ti ti-list',
-});
+}));
onActivated(() => {
fetch();
diff --git a/packages/frontend/src/pages/my-lists/list.vue b/packages/frontend/src/pages/my-lists/list.vue
index d7829596dbce416a28fec86fa01fe2400de990e4..7492b099ea60e31f6c2a1f549ac7d6624d56075c 100644
--- a/packages/frontend/src/pages/my-lists/list.vue
+++ b/packages/frontend/src/pages/my-lists/list.vue
@@ -186,10 +186,10 @@ const headerActions = computed(() => []);
const headerTabs = computed(() => []);
-definePageMetadata(computed(() => list.value ? {
- title: list.value.name,
+definePageMetadata(() => ({
+ title: list.value ? list.value.name : i18n.ts.lists,
icon: 'ti ti-list',
-} : null));
+}));
</script>
<style lang="scss" module>
diff --git a/packages/frontend/src/pages/not-found.vue b/packages/frontend/src/pages/not-found.vue
index 3f6d149b0484137ee78e45af6672438bf8284a2c..93a792c42f8cd41c12cae6b54fcc964f97e077a2 100644
--- a/packages/frontend/src/pages/not-found.vue
+++ b/packages/frontend/src/pages/not-found.vue
@@ -31,8 +31,8 @@ const headerActions = computed(() => []);
const headerTabs = computed(() => []);
-definePageMetadata({
+definePageMetadata(() => ({
title: i18n.ts.notFound,
icon: 'ti ti-alert-triangle',
-});
+}));
</script>
diff --git a/packages/frontend/src/pages/note.vue b/packages/frontend/src/pages/note.vue
index ae35be969ffa314c4435532c73d5782b02ad8e88..4c985b96e6af433477c4eab947e80a21bf66b916 100644
--- a/packages/frontend/src/pages/note.vue
+++ b/packages/frontend/src/pages/note.vue
@@ -141,16 +141,18 @@ const headerActions = computed(() => []);
const headerTabs = computed(() => []);
-definePageMetadata(computed(() => note.value ? {
+definePageMetadata(() => ({
title: i18n.ts.note,
- subtitle: dateString(note.value.createdAt),
- avatar: note.value.user,
- path: `/notes/${note.value.id}`,
- share: {
- title: i18n.tsx.noteOf({ user: note.value.user.name }),
- text: note.value.text,
- },
-} : null));
+ ...note.value ? {
+ subtitle: dateString(note.value.createdAt),
+ avatar: note.value.user,
+ path: `/notes/${note.value.id}`,
+ share: {
+ title: i18n.tsx.noteOf({ user: note.value.user.name }),
+ text: note.value.text,
+ },
+ } : {},
+}));
</script>
<style lang="scss" module>
diff --git a/packages/frontend/src/pages/notifications.vue b/packages/frontend/src/pages/notifications.vue
index c66af20c4d9da5b4ea6c391c48dbdce4cd6da196..7db6fa539550092027ae55d058814e0c0d3d8caf 100644
--- a/packages/frontend/src/pages/notifications.vue
+++ b/packages/frontend/src/pages/notifications.vue
@@ -94,10 +94,10 @@ const headerTabs = computed(() => [{
icon: 'ti ti-mail',
}]);
-definePageMetadata(computed(() => ({
+definePageMetadata(() => ({
title: i18n.ts.notifications,
icon: 'ti ti-bell',
-})));
+}));
</script>
<style module lang="scss">
diff --git a/packages/frontend/src/pages/oauth.vue b/packages/frontend/src/pages/oauth.vue
index f0517b743a1f34e21ca0be84ce68c70a3d6ef84a..733e34eb2cd68cb77f3c6cf8485ea1ef7b45f302 100644
--- a/packages/frontend/src/pages/oauth.vue
+++ b/packages/frontend/src/pages/oauth.vue
@@ -51,10 +51,10 @@ function onLogin(res): void {
login(res.i);
}
-definePageMetadata({
+definePageMetadata(() => ({
title: 'OAuth',
icon: 'ti ti-apps',
-});
+}));
</script>
<style lang="scss" module>
diff --git a/packages/frontend/src/pages/page-editor/page-editor.vue b/packages/frontend/src/pages/page-editor/page-editor.vue
index a26f2263e200ed4073921f73ceca417abf0b9560..af32fd227465c24c3032388706ec24d762cd4b3d 100644
--- a/packages/frontend/src/pages/page-editor/page-editor.vue
+++ b/packages/frontend/src/pages/page-editor/page-editor.vue
@@ -284,17 +284,11 @@ const headerTabs = computed(() => [{
icon: 'ti ti-note',
}]);
-definePageMetadata(computed(() => {
- let title = i18n.ts._pages.newPage;
- if (props.initPageId) {
- title = i18n.ts._pages.editPage;
- } else if (props.initPageName && props.initUser) {
- title = i18n.ts._pages.readPage;
- }
- return {
- title: title,
- icon: 'ti ti-pencil',
- };
+definePageMetadata(() => ({
+ title: props.initPageId ? i18n.ts._pages.editPage
+ : props.initPageName && props.initUser ? i18n.ts._pages.readPage
+ : i18n.ts._pages.newPage,
+ icon: 'ti ti-pencil',
}));
</script>
diff --git a/packages/frontend/src/pages/page.vue b/packages/frontend/src/pages/page.vue
index 46d4886412a4578a3971fe401e2edfac1b6d5605..bece32fc11c7a800c10755cd657c839f2f8fd95e 100644
--- a/packages/frontend/src/pages/page.vue
+++ b/packages/frontend/src/pages/page.vue
@@ -187,15 +187,17 @@ const headerActions = computed(() => []);
const headerTabs = computed(() => []);
-definePageMetadata(computed(() => page.value ? {
- title: page.value.title || page.value.name,
- avatar: page.value.user,
- path: `/@${page.value.user.username}/pages/${page.value.name}`,
- share: {
- title: page.value.title || page.value.name,
- text: page.value.summary,
- },
-} : null));
+definePageMetadata(() => ({
+ title: page.value ? page.value.title || page.value.name : i18n.ts.pages,
+ ...page.value ? {
+ avatar: page.value.user,
+ path: `/@${page.value.user.username}/pages/${page.value.name}`,
+ share: {
+ title: page.value.title || page.value.name,
+ text: page.value.summary,
+ },
+ } : {},
+}));
</script>
<style lang="scss" scoped>
diff --git a/packages/frontend/src/pages/pages.vue b/packages/frontend/src/pages/pages.vue
index 06e26ac10d8ea52e6dd38de94f8050a6db0fdf8b..4ef9d3b0917f018e9c16111be60d3c59e73561a0 100644
--- a/packages/frontend/src/pages/pages.vue
+++ b/packages/frontend/src/pages/pages.vue
@@ -88,8 +88,8 @@ const headerTabs = computed(() => [{
icon: 'ti ti-heart',
}]);
-definePageMetadata(computed(() => ({
+definePageMetadata(() => ({
title: i18n.ts.pages,
icon: 'ti ti-note',
-})));
+}));
</script>
diff --git a/packages/frontend/src/pages/registry.keys.vue b/packages/frontend/src/pages/registry.keys.vue
index fe7ed4f79ecb6b9d97afe926af44983523bf0dfe..bac1d2bb700752e7bfc2f142d9c2266acec87412 100644
--- a/packages/frontend/src/pages/registry.keys.vue
+++ b/packages/frontend/src/pages/registry.keys.vue
@@ -96,8 +96,8 @@ const headerActions = computed(() => []);
const headerTabs = computed(() => []);
-definePageMetadata({
+definePageMetadata(() => ({
title: i18n.ts.registry,
icon: 'ti ti-adjustments',
-});
+}));
</script>
diff --git a/packages/frontend/src/pages/registry.value.vue b/packages/frontend/src/pages/registry.value.vue
index 10e0892ed1a054c95706b23a46442ce31a18db7f..c40d13f664d6c2d1502917be71607ad21b5435c0 100644
--- a/packages/frontend/src/pages/registry.value.vue
+++ b/packages/frontend/src/pages/registry.value.vue
@@ -123,8 +123,8 @@ const headerActions = computed(() => []);
const headerTabs = computed(() => []);
-definePageMetadata({
+definePageMetadata(() => ({
title: i18n.ts.registry,
icon: 'ti ti-adjustments',
-});
+}));
</script>
diff --git a/packages/frontend/src/pages/registry.vue b/packages/frontend/src/pages/registry.vue
index 473687e9467a668c0b12948d4c4e6f7b15ae6d5d..c641874b17a316cee1695981cffad09eb1017729 100644
--- a/packages/frontend/src/pages/registry.vue
+++ b/packages/frontend/src/pages/registry.vue
@@ -73,8 +73,8 @@ const headerActions = computed(() => []);
const headerTabs = computed(() => []);
-definePageMetadata({
+definePageMetadata(() => ({
title: i18n.ts.registry,
icon: 'ti ti-adjustments',
-});
+}));
</script>
diff --git a/packages/frontend/src/pages/reset-password.vue b/packages/frontend/src/pages/reset-password.vue
index 88bf253f5632078cbc81938e442353472c1aa989..6b67a9cc87093ba443dd8109e84bbe033d47972a 100644
--- a/packages/frontend/src/pages/reset-password.vue
+++ b/packages/frontend/src/pages/reset-password.vue
@@ -53,8 +53,8 @@ const headerActions = computed(() => []);
const headerTabs = computed(() => []);
-definePageMetadata({
+definePageMetadata(() => ({
title: i18n.ts.resetPassword,
icon: 'ti ti-lock',
-});
+}));
</script>
diff --git a/packages/frontend/src/pages/reversi/game.vue b/packages/frontend/src/pages/reversi/game.vue
index 947420477bad9350331656f603f060cf5f99f83c..eadc51881c798ae0d4217b19c7ba8a9ea26eb42a 100644
--- a/packages/frontend/src/pages/reversi/game.vue
+++ b/packages/frontend/src/pages/reversi/game.vue
@@ -113,8 +113,8 @@ onUnmounted(() => {
}
});
-definePageMetadata(computed(() => ({
+definePageMetadata(() => ({
title: 'Reversi',
icon: 'ti ti-device-gamepad',
-})));
+}));
</script>
diff --git a/packages/frontend/src/pages/reversi/index.vue b/packages/frontend/src/pages/reversi/index.vue
index 959ce12583d308cd56b5518ebb27b0d9166051de..51a03e441801df034807441aca575e3780ed9432 100644
--- a/packages/frontend/src/pages/reversi/index.vue
+++ b/packages/frontend/src/pages/reversi/index.vue
@@ -105,7 +105,7 @@ SPDX-License-Identifier: AGPL-3.0-only
</template>
<script lang="ts" setup>
-import { computed, onDeactivated, onMounted, onUnmounted, ref } from 'vue';
+import { onDeactivated, onMounted, onUnmounted, ref } from 'vue';
import * as Misskey from 'misskey-js';
import { misskeyApi } from '@/scripts/misskey-api.js';
import { definePageMetadata } from '@/scripts/page-metadata.js';
@@ -261,10 +261,10 @@ onUnmounted(() => {
cancelMatching();
});
-definePageMetadata(computed(() => ({
+definePageMetadata(() => ({
title: 'Reversi',
icon: 'ti ti-device-gamepad',
-})));
+}));
</script>
<style lang="scss" module>
diff --git a/packages/frontend/src/pages/role.vue b/packages/frontend/src/pages/role.vue
index 7a4d9b993217ae7a221b528b66aabb8921615b05..ce80579cf9fde62750032bc174dc46bf084eee71 100644
--- a/packages/frontend/src/pages/role.vue
+++ b/packages/frontend/src/pages/role.vue
@@ -93,10 +93,10 @@ const headerTabs = computed(() => [{
title: i18n.ts.timeline,
}]);
-definePageMetadata(computed(() => ({
- title: role.value?.name,
+definePageMetadata(() => ({
+ title: role.value ? role.value.name : i18n.ts.role,
icon: 'ti ti-badge',
-})));
+}));
</script>
<style lang="scss" module>
diff --git a/packages/frontend/src/pages/scratchpad.vue b/packages/frontend/src/pages/scratchpad.vue
index 3b5990c81e51a7044cd933e94114eb45a6e8f7ca..9aaa8ff9c633cc589ec93d663a76b4ec23404ea5 100644
--- a/packages/frontend/src/pages/scratchpad.vue
+++ b/packages/frontend/src/pages/scratchpad.vue
@@ -152,10 +152,10 @@ const headerActions = computed(() => []);
const headerTabs = computed(() => []);
-definePageMetadata({
+definePageMetadata(() => ({
title: i18n.ts.scratchpad,
icon: 'ti ti-terminal-2',
-});
+}));
</script>
<style lang="scss" module>
diff --git a/packages/frontend/src/pages/search.vue b/packages/frontend/src/pages/search.vue
index 911c7d25f3b6b93033f7558e800c86c47fdbc7ae..a3dcda77beb2674b52c4bd24166350ab903e6e79 100644
--- a/packages/frontend/src/pages/search.vue
+++ b/packages/frontend/src/pages/search.vue
@@ -52,8 +52,8 @@ const headerTabs = computed(() => [{
icon: 'ti ti-users',
}]);
-definePageMetadata(computed(() => ({
+definePageMetadata(() => ({
title: i18n.ts.search,
icon: 'ti ti-search',
-})));
+}));
</script>
diff --git a/packages/frontend/src/pages/settings/accounts.vue b/packages/frontend/src/pages/settings/accounts.vue
index 8879a4d82a4c307273c9d031257e85d3dab4fc20..1182346de96fe5df7560c37b47a03b6fe4e73c8d 100644
--- a/packages/frontend/src/pages/settings/accounts.vue
+++ b/packages/frontend/src/pages/settings/accounts.vue
@@ -106,10 +106,10 @@ const headerActions = computed(() => []);
const headerTabs = computed(() => []);
-definePageMetadata({
+definePageMetadata(() => ({
title: i18n.ts.accounts,
icon: 'ti ti-users',
-});
+}));
</script>
<style lang="scss" module>
diff --git a/packages/frontend/src/pages/settings/api.vue b/packages/frontend/src/pages/settings/api.vue
index 4c69b8819824c7db8ea6819d73a07ebaf0ac6dc9..d9596b4e45ad35800873748bd1422328ce2bb81a 100644
--- a/packages/frontend/src/pages/settings/api.vue
+++ b/packages/frontend/src/pages/settings/api.vue
@@ -45,8 +45,8 @@ const headerActions = computed(() => []);
const headerTabs = computed(() => []);
-definePageMetadata({
+definePageMetadata(() => ({
title: 'API',
icon: 'ti ti-api',
-});
+}));
</script>
diff --git a/packages/frontend/src/pages/settings/apps.vue b/packages/frontend/src/pages/settings/apps.vue
index ad60b4abe1d68a8883ce99b0649052b3173f78dd..0e0c1f4c0ccd5ca0c36920c7fccc8579c04386b9 100644
--- a/packages/frontend/src/pages/settings/apps.vue
+++ b/packages/frontend/src/pages/settings/apps.vue
@@ -75,10 +75,10 @@ const headerActions = computed(() => []);
const headerTabs = computed(() => []);
-definePageMetadata({
+definePageMetadata(() => ({
title: i18n.ts.installedApps,
icon: 'ti ti-plug',
-});
+}));
</script>
<style lang="scss" module>
diff --git a/packages/frontend/src/pages/settings/avatar-decoration.vue b/packages/frontend/src/pages/settings/avatar-decoration.vue
index f0cf7cbc8ee91004400a14337d91536cbf045d7d..3cc911c01456357b1ffd8d32ffaf27c8d8283a8a 100644
--- a/packages/frontend/src/pages/settings/avatar-decoration.vue
+++ b/packages/frontend/src/pages/settings/avatar-decoration.vue
@@ -128,10 +128,10 @@ const headerActions = computed(() => []);
const headerTabs = computed(() => []);
-definePageMetadata({
+definePageMetadata(() => ({
title: i18n.ts.avatarDecorations,
icon: 'ti ti-sparkles',
-});
+}));
</script>
<style lang="scss" module>
diff --git a/packages/frontend/src/pages/settings/custom-css.vue b/packages/frontend/src/pages/settings/custom-css.vue
index e07e1a4f997e40055908f36dbfe4ed9b6c62337e..cf05e75acc5577c2cb456e4c2511d9494acf725b 100644
--- a/packages/frontend/src/pages/settings/custom-css.vue
+++ b/packages/frontend/src/pages/settings/custom-css.vue
@@ -45,8 +45,8 @@ const headerActions = computed(() => []);
const headerTabs = computed(() => []);
-definePageMetadata({
+definePageMetadata(() => ({
title: i18n.ts.customCss,
icon: 'ti ti-code',
-});
+}));
</script>
diff --git a/packages/frontend/src/pages/settings/deck.vue b/packages/frontend/src/pages/settings/deck.vue
index 44578287ee6892537db3b34d6d91c786b51b2c75..e574ec7dc06fb3eca44830ec74b2835479775902 100644
--- a/packages/frontend/src/pages/settings/deck.vue
+++ b/packages/frontend/src/pages/settings/deck.vue
@@ -36,8 +36,8 @@ const headerActions = computed(() => []);
const headerTabs = computed(() => []);
-definePageMetadata({
+definePageMetadata(() => ({
title: i18n.ts.deck,
icon: 'ti ti-columns',
-});
+}));
</script>
diff --git a/packages/frontend/src/pages/settings/drive-cleaner.vue b/packages/frontend/src/pages/settings/drive-cleaner.vue
index 753ade0dd10d30c046d4a04088c2a9abdf7bca83..b20774c4ec509ce39994eeab2c9e11a74991e09b 100644
--- a/packages/frontend/src/pages/settings/drive-cleaner.vue
+++ b/packages/frontend/src/pages/settings/drive-cleaner.vue
@@ -117,10 +117,10 @@ function onContextMenu(ev: MouseEvent, file): void {
os.contextMenu(getDriveFileMenu(file), ev);
}
-definePageMetadata({
+definePageMetadata(() => ({
title: i18n.ts.drivecleaner,
icon: 'ti ti-trash',
-});
+}));
</script>
<style lang="scss" module>
diff --git a/packages/frontend/src/pages/settings/drive.vue b/packages/frontend/src/pages/settings/drive.vue
index 6694557c0c7f49e9c338315a4c4628f0fd031b94..cd38f9850f1831106cc232570c535483c7cdaa47 100644
--- a/packages/frontend/src/pages/settings/drive.vue
+++ b/packages/frontend/src/pages/settings/drive.vue
@@ -143,10 +143,10 @@ const headerActions = computed(() => []);
const headerTabs = computed(() => []);
-definePageMetadata({
+definePageMetadata(() => ({
title: i18n.ts.drive,
icon: 'ti ti-cloud',
-});
+}));
</script>
<style lang="scss" module>
diff --git a/packages/frontend/src/pages/settings/email.vue b/packages/frontend/src/pages/settings/email.vue
index b70bb8f226276f1afb8df070a54c49b497935310..f226647569e7ea3ee7949a0f6692707187eb4d1d 100644
--- a/packages/frontend/src/pages/settings/email.vue
+++ b/packages/frontend/src/pages/settings/email.vue
@@ -113,8 +113,8 @@ const headerActions = computed(() => []);
const headerTabs = computed(() => []);
-definePageMetadata({
+definePageMetadata(() => ({
title: i18n.ts.email,
icon: 'ti ti-mail',
-});
+}));
</script>
diff --git a/packages/frontend/src/pages/settings/emoji-picker.vue b/packages/frontend/src/pages/settings/emoji-picker.vue
index 55fa35ec9f2a75116b790146f7885b4c297d5f6a..79969427ec3c79ee910e39b0ce4fab134518c6a9 100644
--- a/packages/frontend/src/pages/settings/emoji-picker.vue
+++ b/packages/frontend/src/pages/settings/emoji-picker.vue
@@ -237,10 +237,10 @@ watch(pinnedEmojis, () => {
deep: true,
});
-definePageMetadata({
+definePageMetadata(() => ({
title: i18n.ts.emojiPicker,
icon: 'ti ti-mood-happy',
-});
+}));
</script>
<style lang="scss" module>
diff --git a/packages/frontend/src/pages/settings/general.vue b/packages/frontend/src/pages/settings/general.vue
index efaffc809cbd5c21636ed26acd0f7c156eeade0e..d13b6884bdd906383881cb10254eccba43176a67 100644
--- a/packages/frontend/src/pages/settings/general.vue
+++ b/packages/frontend/src/pages/settings/general.vue
@@ -465,8 +465,8 @@ const headerActions = computed(() => []);
const headerTabs = computed(() => []);
-definePageMetadata({
+definePageMetadata(() => ({
title: i18n.ts.general,
icon: 'ti ti-adjustments',
-});
+}));
</script>
diff --git a/packages/frontend/src/pages/settings/import-export.vue b/packages/frontend/src/pages/settings/import-export.vue
index 666d0a5ef15cbdf28248e3fbfab15306b50ff56f..9bb3957a84f9c855d9ad319a202f3a1363029cb2 100644
--- a/packages/frontend/src/pages/settings/import-export.vue
+++ b/packages/frontend/src/pages/settings/import-export.vue
@@ -225,10 +225,10 @@ const headerActions = computed(() => []);
const headerTabs = computed(() => []);
-definePageMetadata({
+definePageMetadata(() => ({
title: i18n.ts.importAndExport,
icon: 'ti ti-package',
-});
+}));
</script>
<style module>
diff --git a/packages/frontend/src/pages/settings/index.vue b/packages/frontend/src/pages/settings/index.vue
index c4895c86886cedb2906de71c48c67b61362c1c06..5fc1fd1bca53e0bd63205e48cd42b9480968b04d 100644
--- a/packages/frontend/src/pages/settings/index.vue
+++ b/packages/frontend/src/pages/settings/index.vue
@@ -28,14 +28,14 @@ SPDX-License-Identifier: AGPL-3.0-only
</template>
<script setup lang="ts">
-import { ComputedRef, Ref, computed, onActivated, onMounted, onUnmounted, ref, shallowRef, watch } from 'vue';
+import { computed, onActivated, onMounted, onUnmounted, ref, shallowRef, watch } from 'vue';
import { i18n } from '@/i18n.js';
import MkInfo from '@/components/MkInfo.vue';
import MkSuperMenu from '@/components/MkSuperMenu.vue';
import { signout, $i } from '@/account.js';
import { clearCache } from '@/scripts/clear-cache.js';
import { instance } from '@/instance.js';
-import { PageMetadata, definePageMetadata, provideMetadataReceiver } from '@/scripts/page-metadata.js';
+import { PageMetadata, definePageMetadata, provideMetadataReceiver, provideReactiveMetadata } from '@/scripts/page-metadata.js';
import * as os from '@/os.js';
import { useRouter } from '@/router/supplier.js';
@@ -46,7 +46,7 @@ const indexInfo = {
};
const INFO = ref(indexInfo);
const el = shallowRef<HTMLElement | null>(null);
-const childInfo: Ref<ComputedRef<PageMetadata> | null> = ref(null);
+const childInfo = ref<null | PageMetadata>(null);
const router = useRouter();
@@ -231,20 +231,22 @@ watch(router.currentRef, (to) => {
const emailNotConfigured = computed(() => instance.enableEmail && ($i.email == null || !$i.emailVerified));
-provideMetadataReceiver((info) => {
+provideMetadataReceiver((metadataGetter) => {
+ const info = metadataGetter();
if (info == null) {
childInfo.value = null;
} else {
childInfo.value = info;
- INFO.value.needWideArea = info.value.needWideArea ?? undefined;
+ INFO.value.needWideArea = info.needWideArea ?? undefined;
}
});
+provideReactiveMetadata(INFO);
const headerActions = computed(() => []);
const headerTabs = computed(() => []);
-definePageMetadata(INFO);
+definePageMetadata(() => INFO.value);
// w 890
// h 700
</script>
diff --git a/packages/frontend/src/pages/settings/migration.vue b/packages/frontend/src/pages/settings/migration.vue
index a0619b8ddb1c84b36e19a2440f61dc3d704b9dbb..ddc23945dd58fb4ba6c646e274329d95772d37d8 100644
--- a/packages/frontend/src/pages/settings/migration.vue
+++ b/packages/frontend/src/pages/settings/migration.vue
@@ -121,10 +121,10 @@ async function save(): Promise<void> {
init();
-definePageMetadata({
+definePageMetadata(() => ({
title: i18n.ts.accountMigration,
icon: 'ti ti-plane',
-});
+}));
</script>
<style lang="scss">
diff --git a/packages/frontend/src/pages/settings/mute-block.vue b/packages/frontend/src/pages/settings/mute-block.vue
index 8824e21debf7473d985173ad7fcf3107b006ea26..f4ee7dffbf0d173f072e45d2b537923ea03d26c9 100644
--- a/packages/frontend/src/pages/settings/mute-block.vue
+++ b/packages/frontend/src/pages/settings/mute-block.vue
@@ -230,10 +230,10 @@ const headerActions = computed(() => []);
const headerTabs = computed(() => []);
-definePageMetadata({
+definePageMetadata(() => ({
title: i18n.ts.muteAndBlock,
icon: 'ti ti-ban',
-});
+}));
</script>
<style lang="scss" module>
diff --git a/packages/frontend/src/pages/settings/navbar.vue b/packages/frontend/src/pages/settings/navbar.vue
index 61347d5b84e5ce6783782a6909266582f1f0befb..7f8460e316409cf33cbc998369885ba96a36286f 100644
--- a/packages/frontend/src/pages/settings/navbar.vue
+++ b/packages/frontend/src/pages/settings/navbar.vue
@@ -118,10 +118,10 @@ const headerActions = computed(() => []);
const headerTabs = computed(() => []);
-definePageMetadata({
+definePageMetadata(() => ({
title: i18n.ts.navbar,
icon: 'ti ti-list',
-});
+}));
</script>
<style lang="scss" module>
diff --git a/packages/frontend/src/pages/settings/notifications.vue b/packages/frontend/src/pages/settings/notifications.vue
index c74ececa125efecbcf6065b2879486b5235b9652..febcfa32eddce86adba726c42d0b76152fae8f5e 100644
--- a/packages/frontend/src/pages/settings/notifications.vue
+++ b/packages/frontend/src/pages/settings/notifications.vue
@@ -117,8 +117,8 @@ const headerActions = computed(() => []);
const headerTabs = computed(() => []);
-definePageMetadata({
+definePageMetadata(() => ({
title: i18n.ts.notifications,
icon: 'ti ti-bell',
-});
+}));
</script>
diff --git a/packages/frontend/src/pages/settings/other.vue b/packages/frontend/src/pages/settings/other.vue
index 15db1209fa22ee331d305d107734d25b1e51a1f6..a1cb2ea1c42808cce8bc03122173267d7cf2acfa 100644
--- a/packages/frontend/src/pages/settings/other.vue
+++ b/packages/frontend/src/pages/settings/other.vue
@@ -162,8 +162,8 @@ const headerActions = computed(() => []);
const headerTabs = computed(() => []);
-definePageMetadata({
+definePageMetadata(() => ({
title: i18n.ts.other,
icon: 'ti ti-dots',
-});
+}));
</script>
diff --git a/packages/frontend/src/pages/settings/plugin.install.vue b/packages/frontend/src/pages/settings/plugin.install.vue
index c07635830180761ee73c114649556044ac855af9..3ab26e80d96f29c1d5ed9f77a8d49393dadd4929 100644
--- a/packages/frontend/src/pages/settings/plugin.install.vue
+++ b/packages/frontend/src/pages/settings/plugin.install.vue
@@ -53,8 +53,8 @@ const headerActions = computed(() => []);
const headerTabs = computed(() => []);
-definePageMetadata({
+definePageMetadata(() => ({
title: i18n.ts._plugin.install,
icon: 'ti ti-download',
-});
+}));
</script>
diff --git a/packages/frontend/src/pages/settings/plugin.vue b/packages/frontend/src/pages/settings/plugin.vue
index 9ee38cd949f80ed2f922db784660bffddd9357ba..0ab75b95a28cab3489c2152662070126890ea51f 100644
--- a/packages/frontend/src/pages/settings/plugin.vue
+++ b/packages/frontend/src/pages/settings/plugin.vue
@@ -125,8 +125,8 @@ const headerActions = computed(() => []);
const headerTabs = computed(() => []);
-definePageMetadata({
+definePageMetadata(() => ({
title: i18n.ts.plugins,
icon: 'ti ti-plug',
-});
+}));
</script>
diff --git a/packages/frontend/src/pages/settings/preferences-backups.vue b/packages/frontend/src/pages/settings/preferences-backups.vue
index 62ca3bfe5b7cc011b0d2ff1a299ed21ef9769cb0..676159d1b5fb267923a6c856d58e069338a47a84 100644
--- a/packages/frontend/src/pages/settings/preferences-backups.vue
+++ b/packages/frontend/src/pages/settings/preferences-backups.vue
@@ -37,7 +37,7 @@ SPDX-License-Identifier: AGPL-3.0-only
</template>
<script lang="ts" setup>
-import { computed, onMounted, onUnmounted, ref } from 'vue';
+import { onMounted, onUnmounted, ref } from 'vue';
import { v4 as uuid } from 'uuid';
import FormSection from '@/components/form/section.vue';
import MkButton from '@/components/MkButton.vue';
@@ -437,10 +437,10 @@ onUnmounted(() => {
connection?.off('registryUpdated');
});
-definePageMetadata(computed(() => ({
+definePageMetadata(() => ({
title: ts.preferencesBackups,
icon: 'ti ti-device-floppy',
-})));
+}));
</script>
<style lang="scss" module>
diff --git a/packages/frontend/src/pages/settings/privacy.vue b/packages/frontend/src/pages/settings/privacy.vue
index 0ef1154c1c14b4b9284b1bb142892269bb5fe68c..d418be624ef24026baba99ff18a08fb416c34a08 100644
--- a/packages/frontend/src/pages/settings/privacy.vue
+++ b/packages/frontend/src/pages/settings/privacy.vue
@@ -118,8 +118,8 @@ const headerActions = computed(() => []);
const headerTabs = computed(() => []);
-definePageMetadata({
+definePageMetadata(() => ({
title: i18n.ts.privacy,
icon: 'ti ti-lock-open',
-});
+}));
</script>
diff --git a/packages/frontend/src/pages/settings/profile.vue b/packages/frontend/src/pages/settings/profile.vue
index 5960fbe1dc0ca7d6373f340d861765af07f85a12..60bf9b4d3d5cf7c8ce3fb65b5816d93a3aea69b7 100644
--- a/packages/frontend/src/pages/settings/profile.vue
+++ b/packages/frontend/src/pages/settings/profile.vue
@@ -260,10 +260,10 @@ const headerActions = computed(() => []);
const headerTabs = computed(() => []);
-definePageMetadata({
+definePageMetadata(() => ({
title: i18n.ts.profile,
icon: 'ti ti-user',
-});
+}));
</script>
<style lang="scss" module>
diff --git a/packages/frontend/src/pages/settings/roles.vue b/packages/frontend/src/pages/settings/roles.vue
index 033e5eb50bdf2aa605bb32013dccf30ccf1bf91b..5346a58a7970eaea6b9d215396bba5979addc944 100644
--- a/packages/frontend/src/pages/settings/roles.vue
+++ b/packages/frontend/src/pages/settings/roles.vue
@@ -37,10 +37,10 @@ const headerActions = computed(() => []);
const headerTabs = computed(() => []);
-definePageMetadata({
+definePageMetadata(() => ({
title: i18n.ts.roles,
icon: 'ti ti-badges',
-});
+}));
</script>
<style lang="scss" module>
diff --git a/packages/frontend/src/pages/settings/security.vue b/packages/frontend/src/pages/settings/security.vue
index 95c520db91c1861f2c4b797e3072f690f60e6dfa..de0f63630edd2eae7344bc6c0a3e42a17300a5fe 100644
--- a/packages/frontend/src/pages/settings/security.vue
+++ b/packages/frontend/src/pages/settings/security.vue
@@ -103,10 +103,10 @@ const headerActions = computed(() => []);
const headerTabs = computed(() => []);
-definePageMetadata({
+definePageMetadata(() => ({
title: i18n.ts.security,
icon: 'ti ti-lock',
-});
+}));
</script>
<style lang="scss" scoped>
diff --git a/packages/frontend/src/pages/settings/sounds.vue b/packages/frontend/src/pages/settings/sounds.vue
index 962e7c87b49cb37dc38916709f3a083e0d43bfa4..090f0cf14c41ece2d239fde2e0b35830397f4bb2 100644
--- a/packages/frontend/src/pages/settings/sounds.vue
+++ b/packages/frontend/src/pages/settings/sounds.vue
@@ -94,8 +94,8 @@ const headerActions = computed(() => []);
const headerTabs = computed(() => []);
-definePageMetadata({
+definePageMetadata(() => ({
title: i18n.ts.sounds,
icon: 'ti ti-music',
-});
+}));
</script>
diff --git a/packages/frontend/src/pages/settings/statusbar.vue b/packages/frontend/src/pages/settings/statusbar.vue
index 7598befd71598b1c5a3a43fac7f90e5ec270082e..1ae3de7994c792e778f4effebba821dbbc1851f8 100644
--- a/packages/frontend/src/pages/settings/statusbar.vue
+++ b/packages/frontend/src/pages/settings/statusbar.vue
@@ -50,8 +50,8 @@ const headerActions = computed(() => []);
const headerTabs = computed(() => []);
-definePageMetadata({
+definePageMetadata(() => ({
title: i18n.ts.statusbar,
icon: 'ti ti-list',
-});
+}));
</script>
diff --git a/packages/frontend/src/pages/settings/theme.install.vue b/packages/frontend/src/pages/settings/theme.install.vue
index a3caeb387df1292f35da59161c2c166a8bbb8592..4f05d3784cc9db99a4c51acc138355a5fb277520 100644
--- a/packages/frontend/src/pages/settings/theme.install.vue
+++ b/packages/frontend/src/pages/settings/theme.install.vue
@@ -59,8 +59,8 @@ const headerActions = computed(() => []);
const headerTabs = computed(() => []);
-definePageMetadata({
+definePageMetadata(() => ({
title: i18n.ts._theme.install,
icon: 'ti ti-download',
-});
+}));
</script>
diff --git a/packages/frontend/src/pages/settings/theme.manage.vue b/packages/frontend/src/pages/settings/theme.manage.vue
index 0c2e10068293ffbf64ec30cc5fc471074df0e6bd..8a94d7388b2f3b47edbb847df600b43a22c436d0 100644
--- a/packages/frontend/src/pages/settings/theme.manage.vue
+++ b/packages/frontend/src/pages/settings/theme.manage.vue
@@ -76,8 +76,8 @@ const headerActions = computed(() => []);
const headerTabs = computed(() => []);
-definePageMetadata({
+definePageMetadata(() => ({
title: i18n.ts._theme.manage,
icon: 'ti ti-tool',
-});
+}));
</script>
diff --git a/packages/frontend/src/pages/settings/theme.vue b/packages/frontend/src/pages/settings/theme.vue
index 2e47ef25ef50a3e1c2e1d06ce72f5a60aaeb7b0f..0a4bd4b82618da2ce5142a427406b1e0eb8f6b8a 100644
--- a/packages/frontend/src/pages/settings/theme.vue
+++ b/packages/frontend/src/pages/settings/theme.vue
@@ -177,10 +177,10 @@ const headerActions = computed(() => []);
const headerTabs = computed(() => []);
-definePageMetadata({
+definePageMetadata(() => ({
title: i18n.ts.theme,
icon: 'ti ti-palette',
-});
+}));
</script>
<style lang="scss" scoped>
diff --git a/packages/frontend/src/pages/settings/webhook.edit.vue b/packages/frontend/src/pages/settings/webhook.edit.vue
index db5d0c6dfd3418297bef8ddf5b04884d20f15878..e9fb1e471e1687612c695fcb199fe1182dcd6372 100644
--- a/packages/frontend/src/pages/settings/webhook.edit.vue
+++ b/packages/frontend/src/pages/settings/webhook.edit.vue
@@ -114,8 +114,8 @@ const headerActions = computed(() => []);
const headerTabs = computed(() => []);
-definePageMetadata({
+definePageMetadata(() => ({
title: 'Edit webhook',
icon: 'ti ti-webhook',
-});
+}));
</script>
diff --git a/packages/frontend/src/pages/settings/webhook.new.vue b/packages/frontend/src/pages/settings/webhook.new.vue
index 7fbabce5497fa1787115cbe70e8e25544d960f44..5bf85e48f426372df73430117e5984d1bc1c6052 100644
--- a/packages/frontend/src/pages/settings/webhook.new.vue
+++ b/packages/frontend/src/pages/settings/webhook.new.vue
@@ -82,8 +82,8 @@ const headerActions = computed(() => []);
const headerTabs = computed(() => []);
-definePageMetadata({
+definePageMetadata(() => ({
title: 'Create new webhook',
icon: 'ti ti-webhook',
-});
+}));
</script>
diff --git a/packages/frontend/src/pages/settings/webhook.vue b/packages/frontend/src/pages/settings/webhook.vue
index 282492c62a17299441037abcc70648ffedda17d9..0d11b00c97d0510f639e99feb90f468285101027 100644
--- a/packages/frontend/src/pages/settings/webhook.vue
+++ b/packages/frontend/src/pages/settings/webhook.vue
@@ -50,8 +50,8 @@ const headerActions = computed(() => []);
const headerTabs = computed(() => []);
-definePageMetadata({
+definePageMetadata(() => ({
title: 'Webhook',
icon: 'ti ti-webhook',
-});
+}));
</script>
diff --git a/packages/frontend/src/pages/share.vue b/packages/frontend/src/pages/share.vue
index 816a1d3b58946908ac95d0bad8ff595f3cd0fee2..680934e7ce7841c7d7f14d3f108e8d32e7be1192 100644
--- a/packages/frontend/src/pages/share.vue
+++ b/packages/frontend/src/pages/share.vue
@@ -172,8 +172,8 @@ const headerActions = computed(() => []);
const headerTabs = computed(() => []);
-definePageMetadata({
+definePageMetadata(() => ({
title: i18n.ts.share,
icon: 'ti ti-share',
-});
+}));
</script>
diff --git a/packages/frontend/src/pages/tag.vue b/packages/frontend/src/pages/tag.vue
index 15814bfdd49bbafd1253c99a6215cf224d251cc7..9b77392872fbfee9ee137ee83002ae335cba9c74 100644
--- a/packages/frontend/src/pages/tag.vue
+++ b/packages/frontend/src/pages/tag.vue
@@ -55,10 +55,10 @@ const headerActions = computed(() => []);
const headerTabs = computed(() => []);
-definePageMetadata(computed(() => ({
+definePageMetadata(() => ({
title: props.tag,
icon: 'ti ti-hash',
-})));
+}));
</script>
<style lang="scss" module>
diff --git a/packages/frontend/src/pages/theme-editor.vue b/packages/frontend/src/pages/theme-editor.vue
index 250fe0d16b491c28a4334bd042bf634e0f51b310..50c3beeabc3bda98bcef06013fbde6eb67721132 100644
--- a/packages/frontend/src/pages/theme-editor.vue
+++ b/packages/frontend/src/pages/theme-editor.vue
@@ -228,10 +228,10 @@ const headerActions = computed(() => [{
const headerTabs = computed(() => []);
-definePageMetadata({
+definePageMetadata(() => ({
title: i18n.ts.themeEditor,
icon: 'ti ti-palette',
-});
+}));
</script>
<style lang="scss" scoped>
diff --git a/packages/frontend/src/pages/timeline.vue b/packages/frontend/src/pages/timeline.vue
index efe86be2f335279c63147a960b1ea57d95fe7660..48dfc1fd44fdce387807841fbc53b9e20a00ce21 100644
--- a/packages/frontend/src/pages/timeline.vue
+++ b/packages/frontend/src/pages/timeline.vue
@@ -337,10 +337,10 @@ const headerTabsWhenNotLogin = computed(() => [
}] : []),
] as Tab[]);
-definePageMetadata(computed(() => ({
+definePageMetadata(() => ({
title: i18n.ts.timeline,
icon: src.value === 'local' ? 'ti ti-planet' : src.value === 'social' ? 'ti ti-universe' : src.value === 'global' ? 'ti ti-whirl' : 'ti ti-home',
-})));
+}));
</script>
<style lang="scss" module>
diff --git a/packages/frontend/src/pages/user-list-timeline.vue b/packages/frontend/src/pages/user-list-timeline.vue
index 0eeed29363a14d318ac3b32e7f3bde628c41da78..de6737f37d82ca8c00d8b034c07839b79a84b618 100644
--- a/packages/frontend/src/pages/user-list-timeline.vue
+++ b/packages/frontend/src/pages/user-list-timeline.vue
@@ -70,10 +70,10 @@ const headerActions = computed(() => list.value ? [{
const headerTabs = computed(() => []);
-definePageMetadata(computed(() => list.value ? {
- title: list.value.name,
+definePageMetadata(() => ({
+ title: list.value ? list.value.name : i18n.ts.lists,
icon: 'ti ti-list',
-} : null));
+}));
</script>
<style lang="scss" module>
diff --git a/packages/frontend/src/pages/user-tag.vue b/packages/frontend/src/pages/user-tag.vue
index 3b31750bdd8858a13540d676cf5f2463cd875dbc..a77493fe47d6e82796164a0c6d0d87ab4dc1c726 100644
--- a/packages/frontend/src/pages/user-tag.vue
+++ b/packages/frontend/src/pages/user-tag.vue
@@ -34,9 +34,9 @@ const tagUsers = computed(() => ({
},
}));
-definePageMetadata(computed(() => ({
+definePageMetadata(() => ({
title: props.tag,
icon: 'ti ti-user-search',
-})));
+}));
</script>
diff --git a/packages/frontend/src/pages/user/followers.vue b/packages/frontend/src/pages/user/followers.vue
index 94d426aaeb72bc5384a4812beed6a9b6fa9c90be..70883242e5d5b8c77cdf581687ba4af1bfd97346 100644
--- a/packages/frontend/src/pages/user/followers.vue
+++ b/packages/frontend/src/pages/user/followers.vue
@@ -52,11 +52,14 @@ const headerActions = computed(() => []);
const headerTabs = computed(() => []);
-definePageMetadata(computed(() => user.value ? {
+definePageMetadata(() => ({
+ title: i18n.ts.user,
icon: 'ti ti-user',
- title: user.value.name ? `${user.value.name} (@${user.value.username})` : `@${user.value.username}`,
- subtitle: i18n.ts.followers,
- userName: user.value,
- avatar: user.value,
-} : null));
+ ...user.value ? {
+ title: user.value.name ? `${user.value.name} (@${user.value.username})` : `@${user.value.username}`,
+ subtitle: i18n.ts.followers,
+ userName: user.value,
+ avatar: user.value,
+ } : {},
+}));
</script>
diff --git a/packages/frontend/src/pages/user/following.vue b/packages/frontend/src/pages/user/following.vue
index b874cf16e098da6997fe7ea5a5b873b3441b259f..37b25f694f9930462f1a887fe328f0ec4c9640aa 100644
--- a/packages/frontend/src/pages/user/following.vue
+++ b/packages/frontend/src/pages/user/following.vue
@@ -52,11 +52,14 @@ const headerActions = computed(() => []);
const headerTabs = computed(() => []);
-definePageMetadata(computed(() => user.value ? {
+definePageMetadata(() => ({
+ title: i18n.ts.user,
icon: 'ti ti-user',
- title: user.value.name ? `${user.value.name} (@${user.value.username})` : `@${user.value.username}`,
- subtitle: i18n.ts.following,
- userName: user.value,
- avatar: user.value,
-} : null));
+ ...user.value ? {
+ title: user.value.name ? `${user.value.name} (@${user.value.username})` : `@${user.value.username}`,
+ subtitle: i18n.ts.following,
+ userName: user.value,
+ avatar: user.value,
+ } : {},
+}));
</script>
diff --git a/packages/frontend/src/pages/user/index.vue b/packages/frontend/src/pages/user/index.vue
index a277dc424f72a8949373fbcee408936748ddd019..a6244e2a9325469bb48bda1af078d91cecbe9a70 100644
--- a/packages/frontend/src/pages/user/index.vue
+++ b/packages/frontend/src/pages/user/index.vue
@@ -126,15 +126,18 @@ const headerTabs = computed(() => user.value ? [{
icon: 'ti ti-code',
}] : []);
-definePageMetadata(computed(() => user.value ? {
+definePageMetadata(() => ({
+ title: i18n.ts.user,
icon: 'ti ti-user',
- title: user.value.name ? `${user.value.name} (@${user.value.username})` : `@${user.value.username}`,
- subtitle: `@${getAcct(user.value)}`,
- userName: user.value,
- avatar: user.value,
- path: `/@${user.value.username}`,
- share: {
- title: user.value.name,
- },
-} : null));
+ ...user.value ? {
+ title: user.value.name ? `${user.value.name} (@${user.value.username})` : `@${user.value.username}`,
+ subtitle: `@${getAcct(user.value)}`,
+ userName: user.value,
+ avatar: user.value,
+ path: `/@${user.value.username}`,
+ share: {
+ title: user.value.name,
+ },
+ } : {},
+}));
</script>
diff --git a/packages/frontend/src/pages/welcome.vue b/packages/frontend/src/pages/welcome.vue
index 22a991784e7cd43ea58dd8fa3b6b5147237e37ab..9ba6a5885e30b065c3aa4c19067dc0fc4a2b8227 100644
--- a/packages/frontend/src/pages/welcome.vue
+++ b/packages/frontend/src/pages/welcome.vue
@@ -29,8 +29,8 @@ const headerActions = computed(() => []);
const headerTabs = computed(() => []);
-definePageMetadata(computed(() => ({
+definePageMetadata(() => ({
title: instanceName,
icon: null,
-})));
+}));
</script>
diff --git a/packages/frontend/src/scripts/page-metadata.ts b/packages/frontend/src/scripts/page-metadata.ts
index 974634c928e7686fb1c696d456175bd470e0fb65..0e3b093ecf957769b5eec28ab116dbc53acb48bb 100644
--- a/packages/frontend/src/scripts/page-metadata.ts
+++ b/packages/frontend/src/scripts/page-metadata.ts
@@ -4,10 +4,7 @@
*/
import * as Misskey from 'misskey-js';
-import { ComputedRef, inject, isRef, onActivated, onMounted, provide, ref, Ref } from 'vue';
-
-export const setPageMetadata = Symbol('setPageMetadata');
-export const pageMetadataProvider = Symbol('pageMetadataProvider');
+import { MaybeRefOrGetter, Ref, inject, isRef, onActivated, onBeforeUnmount, provide, ref, toValue, watch } from 'vue';
export type PageMetadata = {
title: string;
@@ -18,29 +15,56 @@ export type PageMetadata = {
needWideArea?: boolean;
};
-export function definePageMetadata(metadata: PageMetadata | null | Ref<PageMetadata | null> | ComputedRef<PageMetadata | null>): void {
- const _metadata = isRef(metadata) ? metadata : ref(metadata);
+type PageMetadataGetter = () => PageMetadata;
+type PageMetadataReceiver = (getter: PageMetadataGetter) => void;
- provide(pageMetadataProvider, _metadata);
+const RECEIVER_KEY = Symbol('ReceiverKey');
+const setReceiver = (v: PageMetadataReceiver): void => {
+ provide<PageMetadataReceiver>(RECEIVER_KEY, v);
+};
+const getReceiver = (): PageMetadataReceiver | undefined => {
+ return inject<PageMetadataReceiver>(RECEIVER_KEY);
+};
- const set = inject(setPageMetadata) as any;
- if (set) {
- set(_metadata);
+const METADATA_KEY = Symbol('MetadataKey');
+const setMetadata = (v: Ref<PageMetadata | null>): void => {
+ provide<Ref<PageMetadata | null>>(METADATA_KEY, v);
+};
+const getMetadata = (): Ref<PageMetadata | null> | undefined => {
+ return inject<Ref<PageMetadata | null>>(METADATA_KEY);
+};
- onMounted(() => {
- set(_metadata);
- });
+export const definePageMetadata = (maybeRefOrGetterMetadata: MaybeRefOrGetter<PageMetadata>): void => {
+ const metadataRef = ref(toValue(maybeRefOrGetterMetadata));
+ const metadataGetter = () => metadataRef.value;
+ const receiver = getReceiver();
- onActivated(() => {
- set(_metadata);
- });
- }
-}
+ // setup handler
+ receiver?.(metadataGetter);
-export function provideMetadataReceiver(callback: (info: ComputedRef<PageMetadata>) => void): void {
- provide(setPageMetadata, callback);
-}
+ // update handler
+ onBeforeUnmount(watch(
+ () => toValue(maybeRefOrGetterMetadata),
+ (metadata) => {
+ metadataRef.value = metadata;
+ receiver?.(metadataGetter);
+ },
+ { deep: true },
+ ));
+ onActivated(() => {
+ receiver?.(metadataGetter);
+ });
+};
-export function injectPageMetadata(): PageMetadata | undefined {
- return inject(pageMetadataProvider);
-}
+export const provideMetadataReceiver = (receiver: PageMetadataReceiver): void => {
+ setReceiver(receiver);
+};
+
+export const provideReactiveMetadata = (metadataRef: Ref<PageMetadata | null>): void => {
+ setMetadata(metadataRef);
+};
+
+export const injectReactiveMetadata = (): Ref<PageMetadata | null> => {
+ const metadataRef = getMetadata();
+ return isRef(metadataRef) ? metadataRef : ref(null);
+};
diff --git a/packages/frontend/src/ui/classic.vue b/packages/frontend/src/ui/classic.vue
index 6e28a86c29d4495d022b10f43e94dd3e39222034..b833e9f6be48ed1f9fe806aff33cba03da31997f 100644
--- a/packages/frontend/src/ui/classic.vue
+++ b/packages/frontend/src/ui/classic.vue
@@ -52,7 +52,7 @@ import XCommon from './_common_/common.vue';
import { instanceName } from '@/config.js';
import { StickySidebar } from '@/scripts/sticky-sidebar.js';
import * as os from '@/os.js';
-import { PageMetadata, provideMetadataReceiver } from '@/scripts/page-metadata.js';
+import { PageMetadata, provideMetadataReceiver, provideReactiveMetadata } from '@/scripts/page-metadata.js';
import { defaultStore } from '@/store.js';
import { i18n } from '@/i18n.js';
import { miLocalStorage } from '@/local-storage.js';
@@ -60,11 +60,13 @@ import { mainRouter } from '@/router/main.js';
const XHeaderMenu = defineAsyncComponent(() => import('./classic.header.vue'));
const XWidgets = defineAsyncComponent(() => import('./universal.widgets.vue'));
+const isRoot = computed(() => mainRouter.currentRoute.value.name === 'index');
+
const DESKTOP_THRESHOLD = 1100;
const isDesktop = ref(window.innerWidth >= DESKTOP_THRESHOLD);
-const pageMetadata = ref<null | PageMetadata>();
+const pageMetadata = ref<null | PageMetadata>(null);
const widgetsShowing = ref(false);
const fullView = ref(false);
const globalHeaderHeight = ref(0);
@@ -75,12 +77,18 @@ const widgetsLeft = ref<HTMLElement>();
const widgetsRight = ref<HTMLElement>();
provide('router', mainRouter);
-provideMetadataReceiver((info) => {
- pageMetadata.value = info.value;
+provideMetadataReceiver((metadataGetter) => {
+ const info = metadataGetter();
+ pageMetadata.value = info;
if (pageMetadata.value) {
- document.title = `${pageMetadata.value.title} | ${instanceName}`;
+ if (isRoot.value && pageMetadata.value.title === instanceName) {
+ document.title = pageMetadata.value.title;
+ } else {
+ document.title = `${pageMetadata.value.title} | ${instanceName}`;
+ }
}
});
+provideReactiveMetadata(pageMetadata);
provide('shouldHeaderThin', showMenuOnTop.value);
provide('forceSpacerMin', true);
diff --git a/packages/frontend/src/ui/deck/main-column.vue b/packages/frontend/src/ui/deck/main-column.vue
index b7c48e6a3ad914aad46bbd3c4151359d2c2e6a74..79c967191709a6e7fb635c4a1d31cbe490a79f37 100644
--- a/packages/frontend/src/ui/deck/main-column.vue
+++ b/packages/frontend/src/ui/deck/main-column.vue
@@ -6,9 +6,9 @@ SPDX-License-Identifier: AGPL-3.0-only
<template>
<XColumn v-if="deckStore.state.alwaysShowMainColumn || mainRouter.currentRoute.value.name !== 'index'" :column="column" :isStacked="isStacked">
<template #header>
- <template v-if="pageMetadata?.value">
- <i :class="pageMetadata?.value.icon"></i>
- {{ pageMetadata?.value.title }}
+ <template v-if="pageMetadata">
+ <i :class="pageMetadata.icon"></i>
+ {{ pageMetadata.title }}
</template>
</template>
@@ -19,12 +19,12 @@ SPDX-License-Identifier: AGPL-3.0-only
</template>
<script lang="ts" setup>
-import { ComputedRef, provide, shallowRef, ref } from 'vue';
+import { provide, shallowRef, ref } from 'vue';
import XColumn from './column.vue';
import { deckStore, Column } from '@/ui/deck/deck-store.js';
import * as os from '@/os.js';
import { i18n } from '@/i18n.js';
-import { PageMetadata, provideMetadataReceiver } from '@/scripts/page-metadata.js';
+import { PageMetadata, provideMetadataReceiver, provideReactiveMetadata } from '@/scripts/page-metadata.js';
import { useScrollPositionManager } from '@/nirax.js';
import { getScrollContainer } from '@/scripts/scroll.js';
import { mainRouter } from '@/router/main.js';
@@ -35,12 +35,14 @@ defineProps<{
}>();
const contents = shallowRef<HTMLElement>();
-const pageMetadata = ref<null | ComputedRef<PageMetadata>>();
+const pageMetadata = ref<null | PageMetadata>(null);
provide('router', mainRouter);
-provideMetadataReceiver((info) => {
+provideMetadataReceiver((metadataGetter) => {
+ const info = metadataGetter();
pageMetadata.value = info;
});
+provideReactiveMetadata(pageMetadata);
/*
function back() {
diff --git a/packages/frontend/src/ui/minimum.vue b/packages/frontend/src/ui/minimum.vue
index 67bbeb307471e711d3984178f12239a45fd8ee22..db5eb19c2079e680ce6219fac5a45489ab1c2f44 100644
--- a/packages/frontend/src/ui/minimum.vue
+++ b/packages/frontend/src/ui/minimum.vue
@@ -14,21 +14,29 @@ SPDX-License-Identifier: AGPL-3.0-only
</template>
<script lang="ts" setup>
-import { provide, ComputedRef, ref } from 'vue';
+import { computed, provide, ref } from 'vue';
import XCommon from './_common_/common.vue';
-import { PageMetadata, provideMetadataReceiver } from '@/scripts/page-metadata.js';
+import { PageMetadata, provideMetadataReceiver, provideReactiveMetadata } from '@/scripts/page-metadata.js';
import { instanceName } from '@/config.js';
import { mainRouter } from '@/router/main.js';
-const pageMetadata = ref<null | ComputedRef<PageMetadata>>();
+const isRoot = computed(() => mainRouter.currentRoute.value.name === 'index');
+
+const pageMetadata = ref<null | PageMetadata>(null);
provide('router', mainRouter);
-provideMetadataReceiver((info) => {
+provideMetadataReceiver((metadataGetter) => {
+ const info = metadataGetter();
pageMetadata.value = info;
- if (pageMetadata.value.value) {
- document.title = `${pageMetadata.value.value.title} | ${instanceName}`;
+ if (pageMetadata.value) {
+ if (isRoot.value && pageMetadata.value.title === instanceName) {
+ document.title = pageMetadata.value.title;
+ } else {
+ document.title = `${pageMetadata.value.title} | ${instanceName}`;
+ }
}
});
+provideReactiveMetadata(pageMetadata);
document.documentElement.style.overflowY = 'scroll';
</script>
diff --git a/packages/frontend/src/ui/universal.vue b/packages/frontend/src/ui/universal.vue
index 2129441d2828d1ad5f9e63768d2ce44b8cf1425a..3cb6f598a6c8dba7771704f9d7d64aba6168eec8 100644
--- a/packages/frontend/src/ui/universal.vue
+++ b/packages/frontend/src/ui/universal.vue
@@ -26,7 +26,7 @@ SPDX-License-Identifier: AGPL-3.0-only
<div v-if="isMobile" ref="navFooter" :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" class="_button" @click="mainRouter.currentRoute.value.name === 'index' ? top() : mainRouter.push('/')"><i :class="$style.navButtonIcon" class="ti ti-home"></i></button>
+ <button :class="$style.navButton" class="_button" @click="isRoot ? top() : mainRouter.push('/')"><i :class="$style.navButtonIcon" class="ti ti-home"></i></button>
<button :class="$style.navButton" class="_button" @click="mainRouter.push('/my/notifications')">
<i :class="$style.navButtonIcon" class="ti ti-bell"></i>
<span v-if="$i?.hasUnreadNotification" :class="$style.navButtonIndicator">
@@ -105,7 +105,7 @@ import { defaultStore } from '@/store.js';
import { navbarItemDef } from '@/navbar.js';
import { i18n } from '@/i18n.js';
import { $i } from '@/account.js';
-import { PageMetadata, provideMetadataReceiver } from '@/scripts/page-metadata.js';
+import { PageMetadata, provideMetadataReceiver, provideReactiveMetadata } from '@/scripts/page-metadata.js';
import { deviceKind } from '@/scripts/device-kind.js';
import { miLocalStorage } from '@/local-storage.js';
import { CURRENT_STICKY_BOTTOM } from '@/const.js';
@@ -117,6 +117,8 @@ const XSidebar = defineAsyncComponent(() => import('@/ui/_common_/navbar.vue'));
const XStatusBars = defineAsyncComponent(() => import('@/ui/_common_/statusbars.vue'));
const XAnnouncements = defineAsyncComponent(() => import('@/ui/_common_/announcements.vue'));
+const isRoot = computed(() => mainRouter.currentRoute.value.name === 'index');
+
const DESKTOP_THRESHOLD = 1100;
const MOBILE_THRESHOLD = 500;
@@ -127,18 +129,24 @@ window.addEventListener('resize', () => {
isMobile.value = deviceKind === 'smartphone' || window.innerWidth <= MOBILE_THRESHOLD;
});
-const pageMetadata = ref<null | PageMetadata>();
+const pageMetadata = ref<null | PageMetadata>(null);
const widgetsShowing = ref(false);
const navFooter = shallowRef<HTMLElement>();
const contents = shallowRef<InstanceType<typeof MkStickyContainer>>();
provide('router', mainRouter);
-provideMetadataReceiver((info) => {
- pageMetadata.value = info.value;
+provideMetadataReceiver((metadataGetter) => {
+ const info = metadataGetter();
+ pageMetadata.value = info;
if (pageMetadata.value) {
- document.title = `${pageMetadata.value.title} | ${instanceName}`;
+ if (isRoot.value && pageMetadata.value.title === instanceName) {
+ document.title = pageMetadata.value.title;
+ } else {
+ document.title = `${pageMetadata.value.title} | ${instanceName}`;
+ }
}
});
+provideReactiveMetadata(pageMetadata);
const menuIndicated = computed(() => {
for (const def in navbarItemDef) {
diff --git a/packages/frontend/src/ui/visitor.vue b/packages/frontend/src/ui/visitor.vue
index 05c73efe28732acb805229872f57c499712edaaf..29b305d9bc4d4b1a6dda22084f1bd92ba452d086 100644
--- a/packages/frontend/src/ui/visitor.vue
+++ b/packages/frontend/src/ui/visitor.vue
@@ -5,9 +5,9 @@ SPDX-License-Identifier: AGPL-3.0-only
<template>
<div class="mk-app">
- <a v-if="root" href="https://github.com/misskey-dev/misskey" target="_blank" class="github-corner" aria-label="View source on GitHub"><svg width="80" height="80" viewBox="0 0 250 250" style="fill:var(--panel); color:var(--fg); position: fixed; z-index: 10; top: 0; border: 0; right: 0;" aria-hidden="true"><path d="M0,0 L115,115 L130,115 L142,142 L250,250 L250,0 Z"></path><path d="M128.3,109.0 C113.8,99.7 119.0,89.6 119.0,89.6 C122.0,82.7 120.5,78.6 120.5,78.6 C119.2,72.0 123.4,76.3 123.4,76.3 C127.3,80.9 125.5,87.3 125.5,87.3 C122.9,97.6 130.6,101.9 134.4,103.2" fill="currentColor" style="transform-origin: 130px 106px;" class="octo-arm"></path><path d="M115.0,115.0 C114.9,115.1 118.7,116.5 119.8,115.4 L133.7,101.6 C136.9,99.2 139.9,98.4 142.2,98.6 C133.8,88.0 127.5,74.4 143.8,58.0 C148.5,53.4 154.0,51.2 159.7,51.0 C160.3,49.4 163.2,43.6 171.4,40.1 C171.4,40.1 176.1,42.5 178.8,56.2 C183.1,58.6 187.2,61.8 190.9,65.4 C194.5,69.0 197.7,73.2 200.1,77.6 C213.8,80.2 216.3,84.9 216.3,84.9 C212.7,93.1 206.9,96.0 205.4,96.6 C205.1,102.4 203.0,107.8 198.3,112.5 C181.9,128.9 168.3,122.5 157.7,114.1 C157.9,116.9 156.7,120.9 152.7,124.9 L141.0,136.5 C139.8,137.7 141.6,141.9 141.8,141.8 Z" fill="currentColor" class="octo-body"></path></svg></a>
+ <a v-if="isRoot" href="https://github.com/misskey-dev/misskey" target="_blank" class="github-corner" aria-label="View source on GitHub"><svg width="80" height="80" viewBox="0 0 250 250" style="fill:var(--panel); color:var(--fg); position: fixed; z-index: 10; top: 0; border: 0; right: 0;" aria-hidden="true"><path d="M0,0 L115,115 L130,115 L142,142 L250,250 L250,0 Z"></path><path d="M128.3,109.0 C113.8,99.7 119.0,89.6 119.0,89.6 C122.0,82.7 120.5,78.6 120.5,78.6 C119.2,72.0 123.4,76.3 123.4,76.3 C127.3,80.9 125.5,87.3 125.5,87.3 C122.9,97.6 130.6,101.9 134.4,103.2" fill="currentColor" style="transform-origin: 130px 106px;" class="octo-arm"></path><path d="M115.0,115.0 C114.9,115.1 118.7,116.5 119.8,115.4 L133.7,101.6 C136.9,99.2 139.9,98.4 142.2,98.6 C133.8,88.0 127.5,74.4 143.8,58.0 C148.5,53.4 154.0,51.2 159.7,51.0 C160.3,49.4 163.2,43.6 171.4,40.1 C171.4,40.1 176.1,42.5 178.8,56.2 C183.1,58.6 187.2,61.8 190.9,65.4 C194.5,69.0 197.7,73.2 200.1,77.6 C213.8,80.2 216.3,84.9 216.3,84.9 C212.7,93.1 206.9,96.0 205.4,96.6 C205.1,102.4 203.0,107.8 198.3,112.5 C181.9,128.9 168.3,122.5 157.7,114.1 C157.9,116.9 156.7,120.9 152.7,124.9 L141.0,136.5 C139.8,137.7 141.6,141.9 141.8,141.8 Z" fill="currentColor" class="octo-body"></path></svg></a>
- <div v-if="!narrow && !root" class="side">
+ <div v-if="!narrow && !isRoot" class="side">
<div class="banner" :style="{ backgroundImage: instance.backgroundImageUrl ? `url(${ instance.backgroundImageUrl })` : 'none' }"></div>
<div class="dashboard">
<MkVisitorDashboard/>
@@ -15,7 +15,7 @@ SPDX-License-Identifier: AGPL-3.0-only
</div>
<div class="main">
- <div v-if="!root" class="header">
+ <div v-if="!isRoot" class="header">
<div v-if="narrow === false" class="wide">
<MkA to="/" class="link" activeClass="active"><i class="ti ti-home icon"></i> {{ i18n.ts.home }}</MkA>
<MkA v-if="isTimelineAvailable" to="/timeline" class="link" activeClass="active"><i class="ti ti-message icon"></i> {{ i18n.ts.timeline }}</MkA>
@@ -29,7 +29,7 @@ SPDX-License-Identifier: AGPL-3.0-only
</div>
</div>
<div class="contents">
- <main v-if="!root" style="container-type: inline-size;">
+ <main v-if="!isRoot" style="container-type: inline-size;">
<RouterView/>
</main>
<main v-else>
@@ -69,7 +69,7 @@ SPDX-License-Identifier: AGPL-3.0-only
</template>
<script lang="ts" setup>
-import { ComputedRef, onMounted, provide, ref, computed } from 'vue';
+import { onMounted, provide, ref, computed } from 'vue';
import * as Misskey from 'misskey-js';
import XCommon from './_common_/common.vue';
import { instanceName } from '@/config.js';
@@ -79,22 +79,30 @@ import { instance } from '@/instance.js';
import XSigninDialog from '@/components/MkSigninDialog.vue';
import XSignupDialog from '@/components/MkSignupDialog.vue';
import { ColdDeviceStorage, defaultStore } from '@/store.js';
-import { PageMetadata, provideMetadataReceiver } from '@/scripts/page-metadata.js';
+import { PageMetadata, provideMetadataReceiver, provideReactiveMetadata } from '@/scripts/page-metadata.js';
import { i18n } from '@/i18n.js';
import MkVisitorDashboard from '@/components/MkVisitorDashboard.vue';
import { mainRouter } from '@/router/main.js';
+const isRoot = computed(() => mainRouter.currentRoute.value.name === 'index');
+
const DESKTOP_THRESHOLD = 1100;
-const pageMetadata = ref<null | ComputedRef<PageMetadata>>();
+const pageMetadata = ref<null | PageMetadata>(null);
provide('router', mainRouter);
-provideMetadataReceiver((info) => {
+provideMetadataReceiver((metadataGetter) => {
+ const info = metadataGetter();
pageMetadata.value = info;
- if (pageMetadata.value.value) {
- document.title = `${pageMetadata.value.value.title} | ${instanceName}`;
+ if (pageMetadata.value) {
+ if (isRoot.value && pageMetadata.value.title === instanceName) {
+ document.title = pageMetadata.value.title;
+ } else {
+ document.title = `${pageMetadata.value.title} | ${instanceName}`;
+ }
}
});
+provideReactiveMetadata(pageMetadata);
const announcements = {
endpoint: 'announcements',
@@ -120,8 +128,6 @@ const keymap = computed(() => {
};
});
-const root = computed(() => mainRouter.currentRoute.value.name === 'index');
-
misskeyApi('meta', { detail: true }).then(res => {
meta.value = res;
});
diff --git a/packages/frontend/src/ui/zen.vue b/packages/frontend/src/ui/zen.vue
index 6e68abf771ea8e818cfd5fad7f7150272ea840e4..bb8cffaf5206e0837de4c5e2c987c0c66b6e868a 100644
--- a/packages/frontend/src/ui/zen.vue
+++ b/packages/frontend/src/ui/zen.vue
@@ -22,24 +22,32 @@ SPDX-License-Identifier: AGPL-3.0-only
</template>
<script lang="ts" setup>
-import { provide, ComputedRef, ref } from 'vue';
+import { computed, provide, ref } from 'vue';
import XCommon from './_common_/common.vue';
-import { PageMetadata, provideMetadataReceiver } from '@/scripts/page-metadata.js';
+import { PageMetadata, provideMetadataReceiver, provideReactiveMetadata } from '@/scripts/page-metadata.js';
import { instanceName, ui } from '@/config.js';
import { i18n } from '@/i18n.js';
import { mainRouter } from '@/router/main.js';
-const pageMetadata = ref<null | ComputedRef<PageMetadata>>();
+const isRoot = computed(() => mainRouter.currentRoute.value.name === 'index');
+
+const pageMetadata = ref<null | PageMetadata>(null);
const showBottom = !(new URLSearchParams(location.search)).has('zen') && ui === 'deck';
provide('router', mainRouter);
-provideMetadataReceiver((info) => {
+provideMetadataReceiver((metadataGetter) => {
+ const info = metadataGetter();
pageMetadata.value = info;
- if (pageMetadata.value.value) {
- document.title = `${pageMetadata.value.value.title} | ${instanceName}`;
+ if (pageMetadata.value) {
+ if (isRoot.value && pageMetadata.value.title === instanceName) {
+ document.title = pageMetadata.value.title;
+ } else {
+ document.title = `${pageMetadata.value.title} | ${instanceName}`;
+ }
}
});
+provideReactiveMetadata(pageMetadata);
function goToMisskey() {
window.location.href = '/';