Skip to content

Commit 860e8bb

Browse files
taiymesyuilo
taiyme
and
syuilo
authored
fix(frontend/pageMetadata): ページタイトルが更新されない問題 (misskey-dev#13289)
Co-authored-by: syuilo <Syuilotan@yahoo.co.jp> Co-authored-by: syuilo <4439005+syuilo@users.noreply.github.com>
1 parent bb83ee8 commit 860e8bb

File tree

140 files changed

+496
-430
lines changed

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

140 files changed

+496
-430
lines changed

‎packages/frontend/src/components/MkPageWindow.vue

+9-7
Original file line numberDiff line numberDiff line change
@@ -16,9 +16,9 @@ SPDX-License-Identifier: AGPL-3.0-only
1616
@closed="$emit('closed')"
1717
>
1818
<template #header>
19-
<template v-if="pageMetadata?.value">
20-
<i v-if="pageMetadata.value.icon" :class="pageMetadata.value.icon" style="margin-right: 0.5em;"></i>
21-
<span>{{ pageMetadata.value.title }}</span>
19+
<template v-if="pageMetadata">
20+
<i v-if="pageMetadata.icon" :class="pageMetadata.icon" style="margin-right: 0.5em;"></i>
21+
<span>{{ pageMetadata.title }}</span>
2222
</template>
2323
</template>
2424

@@ -29,15 +29,15 @@ SPDX-License-Identifier: AGPL-3.0-only
2929
</template>
3030

3131
<script lang="ts" setup>
32-
import { computed, ComputedRef, onMounted, onUnmounted, provide, ref, shallowRef } from 'vue';
32+
import { computed, onMounted, onUnmounted, provide, ref, shallowRef } from 'vue';
3333
import RouterView from '@/components/global/RouterView.vue';
3434
import MkWindow from '@/components/MkWindow.vue';
3535
import { popout as _popout } from '@/scripts/popout.js';
3636
import copyToClipboard from '@/scripts/copy-to-clipboard.js';
3737
import { url } from '@/config.js';
3838
import { useScrollPositionManager } from '@/nirax.js';
3939
import { i18n } from '@/i18n.js';
40-
import { PageMetadata, provideMetadataReceiver } from '@/scripts/page-metadata.js';
40+
import { PageMetadata, provideMetadataReceiver, provideReactiveMetadata } from '@/scripts/page-metadata.js';
4141
import { openingWindowsCount } from '@/os.js';
4242
import { claimAchievement } from '@/scripts/achievements.js';
4343
import { getScrollContainer } from '@/scripts/scroll.js';
@@ -56,7 +56,7 @@ const routerFactory = useRouterFactory();
5656
const windowRouter = routerFactory(props.initialPath);
5757

5858
const contents = shallowRef<HTMLElement | null>(null);
59-
const pageMetadata = ref<null | ComputedRef<PageMetadata>>();
59+
const pageMetadata = ref<null | PageMetadata>(null);
6060
const windowEl = shallowRef<InstanceType<typeof MkWindow>>();
6161
const history = ref<{ path: string; key: any; }[]>([{
6262
path: windowRouter.getCurrentPath(),
@@ -101,9 +101,11 @@ windowRouter.addListener('replace', ctx => {
101101
windowRouter.init();
102102

103103
provide('router', windowRouter);
104-
provideMetadataReceiver((info) => {
104+
provideMetadataReceiver((metadataGetter) => {
105+
const info = metadataGetter();
105106
pageMetadata.value = info;
106107
});
108+
provideReactiveMetadata(pageMetadata);
107109
provide('shouldOmitHeaderTitle', true);
108110
provide('shouldHeaderThin', true);
109111
provide('forceSpacerMin', true);

‎packages/frontend/src/components/global/MkPageHeader.vue

+10-10
Original file line numberDiff line numberDiff line change
@@ -11,18 +11,18 @@ SPDX-License-Identifier: AGPL-3.0-only
1111
</div>
1212
<div v-else-if="!thin_ && narrow && !hideTitle" :class="$style.buttonsLeft"/>
1313

14-
<template v-if="metadata">
14+
<template v-if="pageMetadata">
1515
<div v-if="!hideTitle" :class="$style.titleContainer" @click="top">
16-
<div v-if="metadata.avatar" :class="$style.titleAvatarContainer">
17-
<MkAvatar :class="$style.titleAvatar" :user="metadata.avatar" indicator/>
16+
<div v-if="pageMetadata.avatar" :class="$style.titleAvatarContainer">
17+
<MkAvatar :class="$style.titleAvatar" :user="pageMetadata.avatar" indicator/>
1818
</div>
19-
<i v-else-if="metadata.icon" :class="[$style.titleIcon, metadata.icon]"></i>
19+
<i v-else-if="pageMetadata.icon" :class="[$style.titleIcon, pageMetadata.icon]"></i>
2020

2121
<div :class="$style.title">
22-
<MkUserName v-if="metadata.userName" :user="metadata.userName" :nowrap="true"/>
23-
<div v-else-if="metadata.title">{{ metadata.title }}</div>
24-
<div v-if="metadata.subtitle" :class="$style.subtitle">
25-
{{ metadata.subtitle }}
22+
<MkUserName v-if="pageMetadata.userName" :user="pageMetadata.userName" :nowrap="true"/>
23+
<div v-else-if="pageMetadata.title">{{ pageMetadata.title }}</div>
24+
<div v-if="pageMetadata.subtitle" :class="$style.subtitle">
25+
{{ pageMetadata.subtitle }}
2626
</div>
2727
</div>
2828
</div>
@@ -46,7 +46,7 @@ import tinycolor from 'tinycolor2';
4646
import XTabs, { Tab } from './MkPageHeader.tabs.vue';
4747
import { scrollToTop } from '@/scripts/scroll.js';
4848
import { globalEvents } from '@/events.js';
49-
import { injectPageMetadata } from '@/scripts/page-metadata.js';
49+
import { injectReactiveMetadata } from '@/scripts/page-metadata.js';
5050
import { $i, openAccountMenu as openAccountMenu_ } from '@/account.js';
5151
import { PageHeaderItem } from '@/types/page-header.js';
5252

@@ -64,7 +64,7 @@ const emit = defineEmits<{
6464
(ev: 'update:tab', key: string);
6565
}>();
6666

67-
const metadata = injectPageMetadata();
67+
const pageMetadata = injectReactiveMetadata();
6868

6969
const hideTitle = inject('shouldOmitHeaderTitle', false);
7070
const thin_ = props.thin || inject('shouldHeaderThin', false);

‎packages/frontend/src/config.ts

+1-1
Original file line numberDiff line numberDiff line change
@@ -18,7 +18,7 @@ export const langs = _LANGS_;
1818
const preParseLocale = miLocalStorage.getItem('locale');
1919
export let locale = preParseLocale ? JSON.parse(preParseLocale) : null;
2020
export const version = _VERSION_;
21-
export const instanceName = siteName === 'Misskey' ? host : siteName;
21+
export const instanceName = siteName === 'Misskey' || siteName == null ? host : siteName;
2222
export const ui = miLocalStorage.getItem('ui');
2323
export const debug = miLocalStorage.getItem('debug') === 'true';
2424

‎packages/frontend/src/pages/_error_.vue

+2-2
Original file line numberDiff line numberDiff line change
@@ -67,10 +67,10 @@ const headerActions = computed(() => []);
6767

6868
const headerTabs = computed(() => []);
6969

70-
definePageMetadata({
70+
definePageMetadata(() => ({
7171
title: i18n.ts.error,
7272
icon: 'ti ti-alert-triangle',
73-
});
73+
}));
7474
</script>
7575

7676
<style lang="scss" module>

‎packages/frontend/src/pages/about-misskey.vue

+2-2
Original file line numberDiff line numberDiff line change
@@ -363,10 +363,10 @@ const headerActions = computed(() => []);
363363

364364
const headerTabs = computed(() => []);
365365

366-
definePageMetadata({
366+
definePageMetadata(() => ({
367367
title: i18n.ts.aboutMisskey,
368368
icon: null,
369-
});
369+
}));
370370
</script>
371371

372372
<style lang="scss" scoped>

‎packages/frontend/src/pages/about.vue

+2-2
Original file line numberDiff line numberDiff line change
@@ -164,10 +164,10 @@ const headerTabs = computed(() => [{
164164
icon: 'ti ti-chart-line',
165165
}]);
166166

167-
definePageMetadata(computed(() => ({
167+
definePageMetadata(() => ({
168168
title: i18n.ts.instanceInfo,
169169
icon: 'ti ti-info-circle',
170-
})));
170+
}));
171171
</script>
172172

173173
<style lang="scss" module>

‎packages/frontend/src/pages/achievements.vue

+2-2
Original file line numberDiff line numberDiff line change
@@ -48,10 +48,10 @@ onDeactivated(() => {
4848
}
4949
});
5050

51-
definePageMetadata({
51+
definePageMetadata(() => ({
5252
title: i18n.ts.achievements,
5353
icon: 'ti ti-medal',
54-
});
54+
}));
5555
</script>
5656

5757
<style lang="scss" module>

‎packages/frontend/src/pages/admin-file.vue

+3-3
Original file line numberDiff line numberDiff line change
@@ -140,10 +140,10 @@ const headerTabs = computed(() => [{
140140
icon: 'ti ti-code',
141141
}]);
142142

143-
definePageMetadata(computed(() => ({
144-
title: file.value ? i18n.ts.file + ': ' + file.value.name : i18n.ts.file,
143+
definePageMetadata(() => ({
144+
title: file.value ? `${i18n.ts.file}: ${file.value.name}` : i18n.ts.file,
145145
icon: 'ti ti-file',
146-
})));
146+
}));
147147
</script>
148148

149149
<style lang="scss" scoped>

‎packages/frontend/src/pages/admin-user.vue

+2-2
Original file line numberDiff line numberDiff line change
@@ -518,10 +518,10 @@ const headerTabs = computed(() => [{
518518
icon: 'ti ti-code',
519519
}]);
520520

521-
definePageMetadata(computed(() => ({
521+
definePageMetadata(() => ({
522522
title: user.value ? acct(user.value) : i18n.ts.userInfo,
523523
icon: 'ti ti-user-exclamation',
524-
})));
524+
}));
525525
</script>
526526

527527
<style lang="scss" scoped>

‎packages/frontend/src/pages/admin/_header_.vue

+6-6
Original file line numberDiff line numberDiff line change
@@ -5,12 +5,12 @@ SPDX-License-Identifier: AGPL-3.0-only
55

66
<template>
77
<div ref="el" class="fdidabkc" :style="{ background: bg }" @click="onClick">
8-
<template v-if="metadata">
8+
<template v-if="pageMetadata">
99
<div class="titleContainer" @click="showTabsPopup">
10-
<i v-if="metadata.icon" class="icon" :class="metadata.icon"></i>
10+
<i v-if="pageMetadata.icon" class="icon" :class="pageMetadata.icon"></i>
1111

1212
<div class="title">
13-
<div class="title">{{ metadata.title }}</div>
13+
<div class="title">{{ pageMetadata.title }}</div>
1414
</div>
1515
</div>
1616
<div class="tabs">
@@ -39,7 +39,7 @@ import { popupMenu } from '@/os.js';
3939
import { scrollToTop } from '@/scripts/scroll.js';
4040
import MkButton from '@/components/MkButton.vue';
4141
import { globalEvents } from '@/events.js';
42-
import { injectPageMetadata } from '@/scripts/page-metadata.js';
42+
import { injectReactiveMetadata } from '@/scripts/page-metadata.js';
4343

4444
type Tab = {
4545
key?: string | null;
@@ -65,7 +65,7 @@ const emit = defineEmits<{
6565
(ev: 'update:tab', key: string);
6666
}>();
6767

68-
const metadata = injectPageMetadata();
68+
const pageMetadata = injectReactiveMetadata();
6969

7070
const el = shallowRef<HTMLElement>(null);
7171
const tabRefs = {};
@@ -118,7 +118,7 @@ function onTabClick(tab: Tab, ev: MouseEvent): void {
118118
}
119119

120120
const calcBg = () => {
121-
const rawBg = metadata?.bg ?? 'var(--bg)';
121+
const rawBg = pageMetadata.value?.bg ?? 'var(--bg)';
122122
const tinyBg = tinycolor(rawBg.startsWith('var(') ? getComputedStyle(document.documentElement).getPropertyValue(rawBg.slice(4, -1)) : rawBg);
123123
tinyBg.setAlpha(0.85);
124124
bg.value = tinyBg.toRgbString();

‎packages/frontend/src/pages/admin/abuses.vue

+2-2
Original file line numberDiff line numberDiff line change
@@ -87,8 +87,8 @@ const headerActions = computed(() => []);
8787

8888
const headerTabs = computed(() => []);
8989

90-
definePageMetadata({
90+
definePageMetadata(() => ({
9191
title: i18n.ts.abuseReports,
9292
icon: 'ti ti-exclamation-circle',
93-
});
93+
}));
9494
</script>

‎packages/frontend/src/pages/admin/ads.vue

+2-2
Original file line numberDiff line numberDiff line change
@@ -255,10 +255,10 @@ const headerActions = computed(() => [{
255255

256256
const headerTabs = computed(() => []);
257257

258-
definePageMetadata({
258+
definePageMetadata(() => ({
259259
title: i18n.ts.ads,
260260
icon: 'ti ti-ad',
261-
});
261+
}));
262262
</script>
263263

264264
<style lang="scss" module>

‎packages/frontend/src/pages/admin/announcements.vue

+2-2
Original file line numberDiff line numberDiff line change
@@ -157,8 +157,8 @@ const headerActions = computed(() => [{
157157

158158
const headerTabs = computed(() => []);
159159

160-
definePageMetadata({
160+
definePageMetadata(() => ({
161161
title: i18n.ts.announcements,
162162
icon: 'ti ti-speakerphone',
163-
});
163+
}));
164164
</script>

‎packages/frontend/src/pages/admin/branding.vue

+2-2
Original file line numberDiff line numberDiff line change
@@ -159,10 +159,10 @@ function save() {
159159

160160
const headerTabs = computed(() => []);
161161

162-
definePageMetadata({
162+
definePageMetadata(() => ({
163163
title: i18n.ts.branding,
164164
icon: 'ti ti-paint',
165-
});
165+
}));
166166
</script>
167167

168168
<style lang="scss" module>

‎packages/frontend/src/pages/admin/database.vue

+2-2
Original file line numberDiff line numberDiff line change
@@ -33,8 +33,8 @@ const headerActions = computed(() => []);
3333

3434
const headerTabs = computed(() => []);
3535

36-
definePageMetadata({
36+
definePageMetadata(() => ({
3737
title: i18n.ts.database,
3838
icon: 'ti ti-database',
39-
});
39+
}));
4040
</script>

‎packages/frontend/src/pages/admin/email-settings.vue

+2-2
Original file line numberDiff line numberDiff line change
@@ -130,10 +130,10 @@ function save() {
130130

131131
const headerTabs = computed(() => []);
132132

133-
definePageMetadata({
133+
definePageMetadata(() => ({
134134
title: i18n.ts.emailServer,
135135
icon: 'ti ti-mail',
136-
});
136+
}));
137137
</script>
138138

139139
<style lang="scss" module>

‎packages/frontend/src/pages/admin/external-services.vue

+2-2
Original file line numberDiff line numberDiff line change
@@ -69,10 +69,10 @@ const headerActions = computed(() => []);
6969

7070
const headerTabs = computed(() => []);
7171

72-
definePageMetadata({
72+
definePageMetadata(() => ({
7373
title: i18n.ts.externalServices,
7474
icon: 'ti ti-link',
75-
});
75+
}));
7676
</script>
7777

7878
<style lang="scss" module>

‎packages/frontend/src/pages/admin/federation.vue

+2-2
Original file line numberDiff line numberDiff line change
@@ -102,10 +102,10 @@ const headerActions = computed(() => []);
102102

103103
const headerTabs = computed(() => []);
104104

105-
definePageMetadata(computed(() => ({
105+
definePageMetadata(() => ({
106106
title: i18n.ts.federation,
107107
icon: 'ti ti-whirl',
108-
})));
108+
}));
109109
</script>
110110

111111
<style lang="scss" module>

‎packages/frontend/src/pages/admin/files.vue

+2-2
Original file line numberDiff line numberDiff line change
@@ -108,8 +108,8 @@ const headerActions = computed(() => [{
108108

109109
const headerTabs = computed(() => []);
110110

111-
definePageMetadata(computed(() => ({
111+
definePageMetadata(() => ({
112112
title: i18n.ts.files,
113113
icon: 'ti ti-cloud',
114-
})));
114+
}));
115115
</script>

‎packages/frontend/src/pages/admin/index.vue

+8-6
Original file line numberDiff line numberDiff line change
@@ -28,15 +28,15 @@ SPDX-License-Identifier: AGPL-3.0-only
2828
</template>
2929

3030
<script lang="ts" setup>
31-
import { ComputedRef, Ref, onActivated, onMounted, onUnmounted, provide, watch, ref, computed } from 'vue';
31+
import { onActivated, onMounted, onUnmounted, provide, watch, ref, computed } from 'vue';
3232
import { i18n } from '@/i18n.js';
3333
import MkSuperMenu from '@/components/MkSuperMenu.vue';
3434
import MkInfo from '@/components/MkInfo.vue';
3535
import { instance } from '@/instance.js';
3636
import * as os from '@/os.js';
3737
import { misskeyApi } from '@/scripts/misskey-api.js';
3838
import { lookupUser, lookupUserByEmail } from '@/scripts/lookup-user.js';
39-
import { PageMetadata, definePageMetadata, provideMetadataReceiver } from '@/scripts/page-metadata.js';
39+
import { PageMetadata, definePageMetadata, provideMetadataReceiver, provideReactiveMetadata } from '@/scripts/page-metadata.js';
4040
import { useRouter } from '@/router/supplier.js';
4141

4242
const isEmpty = (x: string | null) => x == null || x === '';
@@ -52,7 +52,7 @@ const indexInfo = {
5252
provide('shouldOmitHeaderTitle', false);
5353

5454
const INFO = ref(indexInfo);
55-
const childInfo: Ref<ComputedRef<PageMetadata> | null> = ref(null);
55+
const childInfo = ref<null | PageMetadata>(null);
5656
const narrow = ref(false);
5757
const view = ref(null);
5858
const el = ref<HTMLDivElement | null>(null);
@@ -257,14 +257,16 @@ watch(router.currentRef, (to) => {
257257
}
258258
});
259259

260-
provideMetadataReceiver((info) => {
260+
provideMetadataReceiver((metadataGetter) => {
261+
const info = metadataGetter();
261262
if (info == null) {
262263
childInfo.value = null;
263264
} else {
264265
childInfo.value = info;
265-
INFO.value.needWideArea = info.value.needWideArea ?? undefined;
266+
INFO.value.needWideArea = info.needWideArea ?? undefined;
266267
}
267268
});
269+
provideReactiveMetadata(INFO);
268270

269271
function invite() {
270272
misskeyApi('admin/invite/create').then(x => {
@@ -318,7 +320,7 @@ const headerActions = computed(() => []);
318320

319321
const headerTabs = computed(() => []);
320322

321-
definePageMetadata(INFO.value);
323+
definePageMetadata(() => INFO.value);
322324

323325
defineExpose({
324326
header: {

0 commit comments

Comments
 (0)