import { computed, ref, watchPostEffect } from 'vue'
import { autoSetModeCallback, unSetModelUpdate } from './sys'
import { showModelsMapStack, custom } from '@/env'
import { 
  fetchModels, 
  ModelType, 
  postAddModel, 
  postDeleteModel,
  postUpdateModels
} from '@/api'
import { 
  deleteStoreItem, 
  addStoreItem, 
  updateStoreItem, 
  fetchStoreItems,
  saveStoreItems,
  recoverStoreItems
} from '@/utils'

import type { Model as SModel } from '@/api'

export type Model = SModel & { loaded: boolean, error: boolean, progress: number }
export type Models = Model[]

export const models = ref<Models>([])

export const getModel = (modelId: Model['id']) => models.value.find(model => model.id === modelId)
export const getModelShowVariable = (model: Model) => 
  computed({
    get: () => custom.modelsChangeStore 
      ? model.show 
      : custom.showModelsMap.get(model) || false,
    set: (show: boolean) => {
      if (custom.modelsChangeStore) {
        model.show = show
      } else {
        custom.showModelsMap.set(model, show)
      }
    }
  })
  
export const modelsLoaded = ref(false)
watchPostEffect(() => {
  const loaded = models.value.every(model => model.loaded || model.error)
  modelsLoaded.value = loaded
})
const stopSelectModelWatch = watchPostEffect(() => {
  if (modelsLoaded.value && !custom.currentModel) {
    const defaultModel = models.value.find(model => model.type === ModelType.SWSS)
    if (defaultModel) {
      custom.currentModel = defaultModel
      stopSelectModelWatch()
    }
  }
})


let bcModels: Models = []
export const getBackupModels = () => bcModels
export const backupModels = () => {
  bcModels = models.value.map(model => ({
    ...model,
    rotation: {...model.rotation},
    position: {...model.position},
  }))
}

const serviceToLocal = (model: SModel): Model => ({
  ...model, 
  error: false,
  loaded: false, 
  progress: 0,
})

export const recoverModels = recoverStoreItems(models, getBackupModels)
export const addModel = async (file: File) => {
  const model = await postAddModel(file)
  unSetModelUpdate(() => models.value.push(serviceToLocal(model)))
  backupModels()
}
export const updateModel = updateStoreItem(models, postUpdateModels)
export const deleteModel = deleteStoreItem(models, model => postDeleteModel(model.id))
export const initialModels = fetchStoreItems(
  models, 
  fetchModels, 
  () => {
    const showModelsMap = new Map<Model, boolean>()
    for (const model of models.value) {
      showModelsMap.set(model, model.show)
    }
    showModelsMapStack.push(ref(showModelsMap))
    backupModels()
  }, 
  smodels => smodels.map(serviceToLocal),
)
export const saveModels = saveStoreItems(
  models,
  getBackupModels,
  {
    update: updateModel,
    delete: deleteModel,
  }
)


export const autoSaveModels = autoSetModeCallback(models, {
  backup: backupModels,
  recovery: recoverModels,
  save: saveModels,
  isUpdate: () => modelsLoaded.value,
})

export { ModelType, ModelTypeDesc } from '@/api'
export type { ModelAttrs } from '@/api'