"use client"

import { useLayoutEffect } from "react"
import { useQueryClient } from "@tanstack/react-query"
import { useAgendaSettingsStore } from "@/lib/agenda/agenda-store"
import { useSessionGuardStore } from "@/lib/auth/session-guard-store"
import {
  DEMO_AGENDA_VISIBLE_HOURS_END,
  DEMO_AGENDA_VISIBLE_HOURS_START,
} from "@/lib/demo/demo-agenda-settings"
import { useDemoAgendaStore } from "@/lib/demo/demo-agenda-store"

export const DEMO_AGENDA_QUERY_ROOT = ["demo", "agenda"] as const

export function DemoAgendaBootstrap() {
  const queryClient = useQueryClient()

  useLayoutEffect(() => {
    useSessionGuardStore.getState().clear()
    useDemoAgendaStore.getState().reset()

    const agendaSettings = useAgendaSettingsStore.getState()
    agendaSettings.setVisibleHoursStart(DEMO_AGENDA_VISIBLE_HOURS_START)
    agendaSettings.setVisibleHoursEnd(DEMO_AGENDA_VISIBLE_HOURS_END)

    queryClient.removeQueries({ queryKey: DEMO_AGENDA_QUERY_ROOT })
  }, [queryClient])

  return null
}