diff --git a/packages/client/src/pages/timeline.vue b/packages/client/src/pages/timeline.vue index b2266d22c..79f00c4b4 100644 --- a/packages/client/src/pages/timeline.vue +++ b/packages/client/src/pages/timeline.vue @@ -46,8 +46,10 @@ const keymap = { const tlComponent = $ref>(); const rootEl = $ref(); -let src = $ref<'home' | 'local' | 'social' | 'global'>(defaultStore.state.tl.src); let queue = $ref(0); +const src = $computed(() => defaultStore.reactiveState.tl.value.src); + +watch ($$(src), () => queue = 0); function queueUpdated(q: number): void { queue = q; @@ -60,7 +62,7 @@ function top(): void { async function chooseList(ev: MouseEvent): Promise { const lists = await os.api('users/lists/list'); const items = lists.map(list => ({ - type: 'link', + type: 'link' as const, text: list.name, to: `/timeline/list/${list.id}`, })); @@ -70,7 +72,7 @@ async function chooseList(ev: MouseEvent): Promise { async function chooseAntenna(ev: MouseEvent): Promise { const antennas = await os.api('antennas/list'); const items = antennas.map(antenna => ({ - type: 'link', + type: 'link' as const, text: antenna.name, indicate: antenna.hasUnreadNote, to: `/timeline/antenna/${antenna.id}`, @@ -81,7 +83,7 @@ async function chooseAntenna(ev: MouseEvent): Promise { async function chooseChannel(ev: MouseEvent): Promise { const channels = await os.api('channels/followed'); const items = channels.map(channel => ({ - type: 'link', + type: 'link' as const, text: channel.name, indicate: channel.hasUnreadNote, to: `/channels/${channel.id}`, @@ -89,9 +91,10 @@ async function chooseChannel(ev: MouseEvent): Promise { os.popupMenu(items, ev.currentTarget ?? ev.target); } -function saveSrc(): void { +function saveSrc(newSrc: 'home' | 'local' | 'social' | 'global'): void { defaultStore.set('tl', { - src: src, + ...defaultStore.state.tl, + src: newSrc, }); } @@ -135,25 +138,25 @@ defineExpose({ title: i18n.ts._timelines.home, icon: 'fas fa-home', iconOnly: true, - onClick: () => { src = 'home'; saveSrc(); }, + onClick: () => { saveSrc('home'); }, }, ...(isLocalTimelineAvailable ? [{ active: src === 'local', title: i18n.ts._timelines.local, icon: 'fas fa-comments', iconOnly: true, - onClick: () => { src = 'local'; saveSrc(); }, + onClick: () => { saveSrc('local'); }, }, { active: src === 'social', title: i18n.ts._timelines.social, icon: 'fas fa-share-alt', iconOnly: true, - onClick: () => { src = 'social'; saveSrc(); }, + onClick: () => { saveSrc('social'); }, }] : []), ...(isGlobalTimelineAvailable ? [{ active: src === 'global', title: i18n.ts._timelines.global, icon: 'fas fa-globe', iconOnly: true, - onClick: () => { src = 'global'; saveSrc(); }, + onClick: () => { saveSrc('global'); }, }] : [])], })), });