import { computed } from 'vue'
import { COPY, type Lang } from '~/utils/landingCopy'
import { makeTheme } from '~/utils/landingTokens'

// Shared landing state. `lang` is a real production toggle (da/en, both fully
// translated). `dark` is kept as machinery from the design's Tweaks panel but
// defaults to light — the primary theme the user landed on — and no toggle is
// surfaced. Flip the default (or add a control) to enable dark later.
export const useLang = () => useState<Lang>('dz-lang', () => 'da')
export const useDark = () => useState<boolean>('dz-dark', () => false)

export const useTheme = () => {
  const dark = useDark()
  return computed(() => makeTheme(dark.value))
}

export const useCopy = () => {
  const lang = useLang()
  return computed(() => COPY[lang.value === 'en' ? 'en' : 'da'])
}

export function toggleLang() {
  const lang = useLang()
  lang.value = lang.value === 'da' ? 'en' : 'da'
}

// Smooth-scroll to an in-page anchor, accounting for the sticky 72px nav.
// Non-anchor / placeholder links (#) are ignored.
export function scrollToAnchor(hash: string) {
  if (!hash || hash === '#' || !hash.startsWith('#')) return
  const el = document.getElementById(hash.slice(1))
  if (!el) return
  const top = el.getBoundingClientRect().top + window.scrollY - 72
  window.scrollTo({ top, behavior: 'smooth' })
  history.replaceState(null, '', hash)
}

// Navigate to a homepage section from anywhere. Footer/Nav links use the form
// "/#suite": when already on the homepage we smooth-scroll in place; from a
// sub-page we route home and index.vue scrolls to the hash on mount. Accepts
// either "/#suite" or "#suite". Returns true if it handled the click (so the
// caller can preventDefault), false to let normal navigation proceed.
export function goToSection(href: string, currentPath: string): boolean {
  const hash = href.slice(href.indexOf('#'))
  if (currentPath === '/') {
    scrollToAnchor(hash)
    return true
  }
  navigateTo(`/${hash}`)
  return true
}