diff --git a/src/store/app/featureFlagSettings.ts b/src/store/app/featureFlagSettings.ts index 13a1766020..9691516512 100644 --- a/src/store/app/featureFlagSettings.ts +++ b/src/store/app/featureFlagSettings.ts @@ -41,6 +41,12 @@ export const featureFlagDescriptions = { 'お気に入りチャンネル一覧を、お気に入りに登録されたチャンネルのみの木構造で表示します。', defaultValue: false, endAt: new Date('2025-12-31T23:59') + }, + does_save_sidebar_expansion_state: { + title: 'サイドバーの展開状態を保持', + description: 'サイドバーが展開されているかどうかを保持します。', + defaultValue: false, + endAt: new Date('2025-12-31T23:59') } } as const satisfies Record diff --git a/src/store/ui/mainView.ts b/src/store/ui/mainView.ts index cd6a0d000f..86e37967c5 100644 --- a/src/store/ui/mainView.ts +++ b/src/store/ui/mainView.ts @@ -11,10 +11,19 @@ import type { import { useBrowserSettings } from '/@/store/app/browserSettings' import { useChannelsStore } from '/@/store/entities/channels' import { useUsersStore } from '/@/store/entities/users' +import useIndexedDbValue from '/@/composables/utils/useIndexedDbValue' +import { watch } from 'vue' +import { useResponsiveStore } from './responsive' +import { useFeatureFlagSettings } from '../app/featureFlagSettings' interface ViewInformationBase { type: string } + +type State = { + currentMainViewComponentState: MainViewComponentState +} + export type PrimaryViewInformation = ChannelView | ClipsView | DMView export type SecondaryViewInformation = QallView export type ViewInformation = ChannelView | QallView | ClipsView | DMView @@ -66,13 +75,38 @@ export enum MainViewComponentState { export type HeaderStyle = 'default' | 'dark' const useMainViewStorePinia = defineStore('ui/mainView', () => { + const initialValue: State = { + currentMainViewComponentState: MainViewComponentState.Hidden + } + + const [state, _restoring, restoringPromise] = useIndexedDbValue( + 'store/ui/mainView', + 1, + {}, + initialValue + ) const { lastOpenChannelName } = useBrowserSettings() + const { featureFlags } = useFeatureFlagSettings() + const { isMobile } = useResponsiveStore() const channelsStore = useChannelsStore() const usersStore = useUsersStore() const layout = ref('single') const currentMainViewComponentState = ref(MainViewComponentState.Hidden) + + watch( + () => featureFlags.value.does_save_sidebar_expansion_state.enabled, + async enabled => { + if (!isMobile.value && enabled) { + await restoringPromise.value + currentMainViewComponentState.value = + state.currentMainViewComponentState + } + }, + { immediate: true } + ) + const isSidebarOpen = computed( () => currentMainViewComponentState.value === @@ -86,6 +120,10 @@ const useMainViewStorePinia = defineStore('ui/mainView', () => { () => currentMainViewComponentState.value === MainViewComponentState.Hidden ) + watch(currentMainViewComponentState, newState => { + state.currentMainViewComponentState = newState + }) + const lastScrollPosition = ref(0) const primaryView = ref({ type: 'channel',