import { InjectionKey } from 'vue'
import {
  createStore,
  createLogger,
  Store as VuexStore,
  useStore as baseUseStore,
} from 'vuex'

import {
  app_data,
  AppDataState,
  app_check,
  AppCheckState,
  app_defs,
  AppDefsState,
  app_profile,
  AppProfileState,
  AppLangState,
  app_lang,
} from './modules'

import { Store as AppDataStore } from './modules/app/data'
import { Store as AppCheckStore } from './modules/app/check'
import { Store as AppDefsStore } from './modules/app/defs'
import { Store as AppProfileStore } from './modules/app/profile'
import { Store as AppLangStore } from './modules/app/lang'

export interface RootState {
  data: AppDataState
  check: AppCheckState
  defs: AppDefsState
  profile: AppProfileState
  lang: AppLangState
}

export type RootStore = AppDataStore<Pick<RootState, 'data'>>
& AppCheckStore<Pick<RootState, 'check'>>
& AppDefsStore<Pick<RootState, 'defs'>>
& AppProfileStore<Pick<RootState, 'profile'>>
& AppLangStore<Pick<RootState, 'lang'>>

// eslint-disable-next-line symbol-description
export const key: InjectionKey<VuexStore<RootState>> = Symbol()

const debug = process.env.NODE_ENV !== 'production'

export default createStore<RootState>({
  modules: {
    app_data,
    app_check,
    app_defs,
    app_profile,
    app_lang,
  },
  strict: debug,
  plugins: debug ? [createLogger()] : [],
})

// export const useStore = (): RootStore => {
//   return baseUseStore(key)
// }
