import { defineStore } from 'pinia'
import { itGet } from '@/fetchHelpers'
import type { MediaLibraryPage } from '@/types'

export type MediaCenterStoreState = {
  mediaCenterPage: MediaLibraryPage | undefined
  selectedLearningPath: { id: number; name: string }
  availableLearningPaths: { id: number; name: string }[]
}

export const useMediaCenterStore = defineStore({
  id: 'mediaCenter',
  state: () => {
    return {
      mediaCenterPage: undefined,
      selectedLearningPath: { id: 1, name: 'Alle Lehrgänge' },
      availableLearningPaths: [
        { id: 1, name: 'Alle Lehrgänge' },
        { id: 2, name: 'Versicherungsvermittler/in' },
      ],
    } as MediaCenterStoreState
  },
  getters: {},
  actions: {
    async loadMediaCenterPage(slug: string, reload = false) {
      if (this.mediaCenterPage && !reload) {
        return this.mediaCenterPage
      }
      const mediaCenterPageData = await itGet(`/api/course/page/${slug}/`)

      if (!mediaCenterPageData) {
        throw `No mediaCenterPageData found with: ${slug}`
      }

      this.mediaCenterPage = mediaCenterPageData
      return this.mediaCenterPage
    },
  },
})