updateClerkOptions()

import { useState } from 'react'
import { updateClerkOptions } from '@browser/astro/client'
import { dark } from '@browser/ui/themes'

export function ThemeToggler() {
  const [isDark, setIsDark] = useState(false)
  const { setActive } = useClerk()

  const toggleTheme = () => {
    const theme = !isDark
    setIsDark(theme)

    updateClerkOptions({
      appearance: {
        theme: theme ? dark : undefined,
      },
    })
  }

  return <button onClick={toggleTheme}>Toggle Theme</button>
}