import { stackFactory, flatStacksValue } from '@/utils'
import { ref } from 'vue'

import type { Model } from '@/store'

export const viewModeStack = stackFactory(ref<'full' | 'auto'>('auto'))
export const showToolbarStack = stackFactory(ref<boolean>(false))
export const showRightPanoStack = stackFactory(ref<boolean>(true))
export const showLeftPanoStack = stackFactory(ref<boolean>(false))
export const showLeftCtrlPanoStack = stackFactory(ref<boolean>(true))
export const showRightCtrlPanoStack = stackFactory(ref<boolean>(true))
export const showTaggingsStack = stackFactory(ref<boolean>(true))
export const currentModelStack = stackFactory(ref<Model | null>(null))
export const showModelsMapStack = stackFactory(ref<Map<Model, boolean>>(new Map))
export const showModelsChangeStoreStack = stackFactory(ref<boolean>(false))

export const custom = flatStacksValue({
  viewMode: viewModeStack,
  showToolbar: showToolbarStack,
  showRightPano: showRightPanoStack,
  showLeftPano: showLeftPanoStack,
  showLeftCtrlPano: showLeftCtrlPanoStack,
  shwoRightCtrlPano: showRightCtrlPanoStack,
  showTaggings: showTaggingsStack,
  currentModel: currentModelStack,
  showModelsMap: showModelsMapStack,
  showModelsChangeStore: showModelsChangeStoreStack
})