import type { GameDataValue } from '#layers/types/api/gameData'

export const useGameDataStore = defineStore('gameData', () => {
  const getInitialState = () => ({
    gameData: null as GameDataValue | null,
    gameId: null as GameDataValue['game_id'] | null,
    gameCode: null as GameDataValue['game_code'] | null,
    gameName: null as GameDataValue['game_name'] | null,
    stoveGnbJson: null as GameDataValue['stove_gnb_json'] | null,
    langCodes: null as GameDataValue['lang_codes'] | null,
    defaultLangCode: null as GameDataValue['default_lang_code'] | null,
    currentLangCode: null as string | null,
    gaCode: null as GameDataValue['ga_code'] | null,
    platformType: null as GameDataValue['platform_type'] | null,
    osType: null as GameDataValue['os_type'] | null,
    gameTheme: null as 'light' | 'dark' | null,
    gameMetaTag: null as GameDataValue['meta_tag_json'] | null,
    intro: null as GameDataValue['intro'] | null,
    imgJson: null as GameDataValue['img_json'] | null,
    snsJson: null as GameDataValue['sns_json'] | null,
    urlJson: null as GameDataValue['url_json'] | null,
    marketJson: null as GameDataValue['market_json'] | null,
    faviconJson: null as GameDataValue['favicon_json'] | null,
    gameFontJson: null as GameDataValue['game_font_json'] | null,
    fontFamily: null as GameDataValue['game_font_json']['font_family'] | null,
    keyColorJson: null as GameDataValue['key_color_json'] | null,
    gnb: null as GameDataValue['gnb'] | null,
    eventBanner: null as GameDataValue['event_banner'] | null,
  })

  const state = reactive(getInitialState())

  const setGameData = (data: GameDataValue) => {
    state.gameData = data
    state.gameId = data?.game_id
    state.gameCode = data?.game_code
    state.gameName = data?.game_name
    state.stoveGnbJson = data?.stove_gnb_json
    state.langCodes = data?.lang_codes
    state.defaultLangCode = data?.default_lang_code
    state.gaCode = data?.ga_code
    state.platformType = data?.platform_type
    state.osType = data?.os_type
    state.gameTheme = data?.design_theme === 1 ? 'light' : 'dark'
    state.gameMetaTag = data?.meta_tag_json
    state.intro = data?.intro
    state.imgJson = data?.img_json
    state.snsJson = data?.sns_json
    state.urlJson = data?.url_json
    state.marketJson = data?.market_json
    state.faviconJson = data?.favicon_json
    state.gameFontJson = data?.game_font_json
    state.fontFamily = data?.game_font_json?.font_family
    state.keyColorJson = data?.key_color_json
    state.gnb = data?.gnb
    state.eventBanner = data?.event_banner
  }

  const setCurrentLangCode = (langCode: string | null) => {
    state.currentLangCode = langCode ? `${langCode}`.toLowerCase() : null
  }

  const clearGameData = () => {
    Object.assign(state, getInitialState())
  }

  return {
    ...toRefs(state),
    setGameData,
    setCurrentLangCode,
    clearGameData,
  }
})