import { Navigate, Outlet } from 'react-router-dom'
import { useEffect, useState } from 'react'
import { ModeAreaShell } from '../../components/ModeAreaShell.jsx'
import { ModeAreaNav } from '../../components/ModeAreaNav.jsx'
import { ModeShell } from '../../components/ModeShell.jsx'
import { WORK_NAV_ITEMS, resolveWorkNavActiveKey } from '../../config/workNav.js'
import { useProgramScope } from '../../context/ProgramScopeContext.jsx'
import { getActiveWorkCycle } from '../../api/workCycles.js'
import { getInitiative } from '../../api/initiatives.js'

export function WorkLayout() {
  return (
    <div className="app-page">
      <ModeShell modeKey="work" />
      <ModeAreaShell
        nav={
          <ModeAreaNav
            modeLabel="Ausführen"
            items={WORK_NAV_ITEMS}
            resolveActiveKey={resolveWorkNavActiveKey}
          />
        }
      >
        <Outlet />
      </ModeAreaShell>
    </div>
  )
}

export function WorkIndexRedirect() {
  const { initiativeId } = useProgramScope()
  const [target, setTarget] = useState('/work/today')

  useEffect(() => {
    if (!initiativeId) {
      setTarget('/work/today')
      return undefined
    }
    let cancelled = false
    Promise.all([getInitiative(initiativeId), getActiveWorkCycle(initiativeId)])
      .then(([initiative, activeCycle]) => {
        if (cancelled) return
        if (
          initiative?.archetype_key === 'initiative.product' &&
          activeCycle?.id
        ) {
          setTarget(`/work/sprint?initiative=${initiativeId}`)
        } else {
          setTarget(`/work/today?initiative=${initiativeId}`)
        }
      })
      .catch(() => {
        if (!cancelled) setTarget('/work/today')
      })
    return () => {
      cancelled = true
    }
  }, [initiativeId])

  return <Navigate to={target} replace />
}