import { useEffect, useState } from 'react'

import { CloseEvent } from './tutorial.types'

export const useTutorial = (tutorialId: string) => {
  const [isVisible, setIsVisible] = useState<boolean>(false)
  const localStorageId = `vuiTutorial-${tutorialId}`

  useEffect(() => {
    setIsVisible(!window.localStorage.getItem(localStorageId))
  }, [])

  const saveDisplayed = (e: CloseEvent) => window.localStorage.setItem(localStorageId, e)

  return { isVisible, setIsVisible, saveDisplayed }
}
