import { defineStore } from 'pinia'
import { ref, watch } from 'vue'
import { useRouter } from 'vue-router'
import { useLogger } from '@/composables/useLogger'

interface MenuRoute {
  name: string
  icon: string
  action: () => void
}

export const useHeader = defineStore('useHeader', () => {
  const log = useLogger('headerStore')
  const menu = ref<[] | MenuRoute[]>([])
  const router = useRouter()

  function setAdditionalMenu(params: MenuRoute[]) {
    setTimeout(() => {
      log.info(params)
      menu.value = params
    }, 300)
  }

  watch(() => router.currentRoute.value, () => {
    menu.value = []
  })

  return { menu, setAdditionalMenu }
})
