import { acceptHMRUpdate, defineStore } from 'pinia'
import { ComputedRef } from 'vue'

export interface Experiment {
  title: string
  path: string
  media: string
  description: string
  tags: Array<string>
}
export const useExperimentsStore = defineStore('experiments', () => {
  const filter = ref('')
  const router = useRouter()

  const [, ...routes] = router.getRoutes()
  console.log(routes)
  const experiments: ComputedRef<Array<Experiment>> = computed(() =>
    routes
      .reduce((acc, route) => {
        const { path } = route
        if (route.children.length > 0) {
          acc = [...acc, ...route.children.map(route => ({ ...route, path }))]
        }
        return acc
      }, [])
      .filter(route => route?.meta?.layout === 'experiment')
      .map(({ meta, path }) => ({
        title: meta.title,
        path,
        /*     path: name.replaceAll('-', '/').toLowerCase(), */
        description: meta.description,
        media: meta.media,
        tags: meta.tags,
        status: meta.status,
      }))
      .filter(({ status }) => (import.meta.env.DEV ? true : status === 'published')),
  )

  return {
    filter,
    experiments,
  }
})

if (import.meta.hot) import.meta.hot.accept(acceptHMRUpdate(useExperimentsStore, import.meta.hot))