import { Section, Row, SubHeading, Toggle, type PrefsLike, type BoolPrefKey } from '../_ui'
import type { DetailShowSettings, EndVideoShowSettings } from '../../../api/types'

export function DetailPageSection({ prefs }: { prefs: PrefsLike }) {
  function topRow<K extends BoolPrefKey>(key: K, label: string, hint: string) {
    return (
      <Row key={key} label={label} hint={hint}>
        <Toggle value={prefs[key]} onChange={v => prefs.setPreference(key, v)} />
      </Row>
    )
  }
  function detailRow(key: keyof DetailShowSettings, label: string, hint: string) {
    return (
      <Row key={`detail.${key}`} label={label} hint={hint}>
        <Toggle value={prefs.detail.show[key]} onChange={v => prefs.setDetailShow(key, v)} />
      </Row>
    )
  }
  function endVideoRow(key: keyof EndVideoShowSettings, label: string, hint: string) {
    return (
      <Row key={`endVideo.${key}`} label={label} hint={hint}>
        <Toggle value={prefs.endVideo.show[key]} onChange={v => prefs.setEndVideoShow(key, v)} />
      </Row>
    )
  }
  return (
    <Section id="detail-page" title="Detail page" description="Sections, cards, and end-of-video extras">
      <SubHeading label="Cards & posters" />
      {topRow('hoverTrailers', 'Hover trailers', 'Auto-play TMDB trailers in poster cards after a brief hover')}
      {topRow('prebufferOnHover', 'Pre-buffer on hover', "Warm Jellyfin's stream when you pause on a poster so Play feels instant")}
      {topRow('quickLookEnabled', 'Quick-look modal', 'Right-click / long-press a card to peek at it without navigating')}
      {detailRow('collectionMeter', 'Collection meter on cards', 'On-hover meter showing how much of a collection you have')}

      <SubHeading label="After a video ends" />
      {endVideoRow('moreLikeThis', '"More like this" row', 'TMDB recommendations on the end-of-video card')}
      {endVideoRow('antiRec', '"Different vibe" row', 'Anti-recommendation row swapping to an opposite genre')}

      <SubHeading label="Sections shown on the page" />
      {detailRow('awards', 'Awards', 'Wikidata-sourced prize chips below the cast')}
      {detailRow('filmingLocations', 'Filming locations', 'Map of locations sourced from Wikidata')}
      {detailRow('trivia', 'Production trivia', 'Wikipedia "Production" section extract + keywords')}
      {detailRow('videos', 'Trailers + featurettes', 'Tabbed YouTube videos from TMDB')}
      {detailRow('personal', 'Personal section', 'Your rating, sticky note, and rewatch counter')}
      {detailRow('diary', 'Diary section', 'Per-watch entries with rating + note + emoji')}
      {detailRow('episodeExtras', 'Per-episode extras', 'Guest cast + director / writer on episode pages')}
    </Section>
  )
}
