import { createElement, Fragment, type ReactNode, useRef } from 'react'
import { Effect, Option, Record as Rec, Schema } from 'effect'
import { type MadeView, Ui, type UiContract, UiViewContract, type ViewImpl } from '@playfast/reform'
import {
  type AnyMadeView,
  type AnyUi,
  type UiReflection,
  type WiredUiManifest,
  Wire,
  type WireNode,
  type WireTree,
} from '@playfast/reform/internal'

export interface SlotPropsExternalApi {
  readonly slotKey?: string
}

export type RemoteView = (
  props: Record<string, unknown>,
  slots: Record<string, (slotProps?: SlotPropsExternalApi) => ReactNode>,
  events: Record<string, (payload: unknown) => void>,
) => ReactNode

export interface RegisteredRemoteView {
  readonly name: string
  readonly view: RemoteView
}

type ViewRegistry = Readonly<Record<string, RegisteredRemoteView>>

const ViewSetContract: unique symbol = Symbol.for('reform-remote/view-set-contract')

export type RemoteViewSet<C extends RemoteContract> = ViewRegistry & {
  readonly [ViewSetContract]: (contract: C) => C
}

type RemoteUi = UiReflection<UiContract, string> & AnyUi & { readonly manifest: WiredUiManifest }
export type RemoteContract = Readonly<Record<string, RemoteUi>>

export const remoteContract = <const C extends RemoteContract>(contract: C): C => contract

type RemoteViewFor<U extends RemoteUi> =
  U extends UiReflection<infer Contract, infer Name> ? MadeView<Contract, Name, U> : never
export type RemoteViews<C extends RemoteContract> = {
  readonly [K in keyof C]: RemoteViewFor<C[K]>
}

type RemoteSlots = Record<string, (slotProps?: SlotPropsExternalApi) => ReactNode>
type RemoteEvents = Record<string, (payload: unknown) => void>

function bindSlots<C extends Ui.UiContract>(slots: RemoteSlots): Parameters<ViewImpl<C>>[1]
function bindSlots(slots: RemoteSlots): unknown {
  return slots
}

function bindEvents<C extends Ui.UiContract>(events: RemoteEvents): Parameters<ViewImpl<C>>[2]
function bindEvents(events: RemoteEvents): unknown {
  return events
}

const registerView = (view: AnyMadeView): RegisteredRemoteView =>
  view.capture(
    <C extends Ui.UiContract, N extends string, U extends Ui.AnyUi>(exact: MadeView<C, N, U>) => {
      const contract = exact[UiViewContract]
      const propsReflection = contract.manifest.props
      if (propsReflection === undefined) {
        return Effect.runSync(
          Effect.dieMessage(
            `reform-remote: view ${contract.manifest.name} needs a wire props schema`,
          ),
        )
      }
      const propsSchema = Schema.make<C['props'], unknown>(propsReflection.ast)
      const decodeProps = Schema.decodeUnknownOption(propsSchema)
      return {
        name: contract.manifest.name,
        // Props off the wire are untrusted — the envelope types a data prop as
        // `Schema.Unknown`, so version skew against a differently-shaped server first
        // shows up here, inside React's render phase. A throw would take the whole tree
        // down; this node costs itself, which is what an unregistered node name already
        // does one level up.
        view: (encoded, slots, events) =>
          Option.match(decodeProps(encoded), {
            onNone: () => {
              Effect.runSync(
                Effect.logWarning(
                  `reform-remote: dropped node '${contract.manifest.name}' — props do not match its wire schema`,
                ),
              )
              return null
            },
            onSome: (props) => exact(props, bindSlots<C>(slots), bindEvents<C>(events)),
          }),
      }
    },
  )

export const remoteViews = <C extends RemoteContract>(views: RemoteViews<C>): RemoteViewSet<C> => {
  const madeViews: ReadonlyArray<AnyMadeView> = Object.values(views)
  const byName: ViewRegistry = Rec.fromEntries(
    madeViews.map((view): readonly [string, RegisteredRemoteView] => {
      const entry = registerView(view)
      return [entry.name, entry]
    }),
  )
  return { ...byName, [ViewSetContract]: (contract: C): C => contract }
}

export interface ClientConfig<C extends RemoteContract> {
  readonly views: RemoteViewSet<C>
  readonly invoke: (handle: string, payload: unknown) => void
}

interface RenderConfig {
  readonly views: ViewRegistry
  readonly invoke: (handle: string, payload: unknown) => void
}

interface WireNodeViewProps {
  readonly node: WireNode
  readonly tree: WireTree
  readonly config: RenderConfig
}

const WireNodeView = ({ node, tree, config }: WireNodeViewProps): ReactNode => {
  // Stable slot closures read current inputs through this ref.
  const latest = useRef({ node, tree, config })
  latest.current = { node, tree, config }
  // Fresh slot component types remount descendants and reset their hooks.
  const slotCache = useRef<Record<string, () => ReactNode>>({})

  const registered = config.views[node.name]
  if (registered === undefined) {
    return null
  }

  const encoded: Record<string, unknown> = Rec.fromEntries(
    node.props.flatMap((prop): ReadonlyArray<readonly [string, unknown]> =>
      prop._tag === 'Data' ? [[prop.name, prop.value]] : [],
    ),
  )
  const eventEntries = node.props.flatMap(
    (prop): ReadonlyArray<readonly [string, (payload: unknown) => void]> => {
      if (prop._tag !== 'Event') {
        return []
      }
      return [[prop.name, (payload: unknown) => config.invoke(prop.handle, payload)]]
    },
  )
  const events: Record<string, (payload: unknown) => void> = Rec.fromEntries(eventEntries)

  // slotKey selects one wire child; omitting it renders every child in the slot.
  const slotFor = (slotName: string): ((slotProps?: SlotPropsExternalApi) => ReactNode) => {
    const cached = slotCache.current[slotName]
    if (cached !== undefined) {
      return cached
    }
    const stable = (slotProps?: SlotPropsExternalApi): ReactNode => {
      const { node: currentNode, tree: currentTree, config: currentConfig } = latest.current
      const requestedKey = slotProps?.slotKey
      return createElement(
        Fragment,
        null,
        ...Wire.childrenOf(currentTree, currentNode.id)
          .filter((child) => child.slot === slotName)
          .filter((child) => requestedKey === undefined || child.key === requestedKey)
          .map((child) =>
            createElement(WireNodeView, {
              // Reconcile on the semantic key when the server sent one: node ids are
              // positional, so a reorder would otherwise slide item state between rows.
              // Matches the local host, which keys by `placement.key`.
              // The node id, not the app's key: ids are derived from the key and so are
              // stable across a reorder, but unlike a key they are unique by construction.
              key: child.id,
              node: child,
              tree: currentTree,
              config: currentConfig,
            }),
          ),
      )
    }
    slotCache.current[slotName] = stable
    return stable
  }

  // Empty slots must still produce a callable component, not an invalid undefined element type.
  const slots: Record<string, (slotProps?: SlotPropsExternalApi) => ReactNode> = new Proxy(
    Object.create(null),
    {
      get: (_target, key) => (typeof key === 'string' ? slotFor(key) : undefined),
    },
  )

  return registered.view(encoded, slots, events)
}

export const renderWireTree = <C extends RemoteContract>(
  tree: WireTree,
  config: ClientConfig<C>,
): ReactNode =>
  createElement(
    Fragment,
    null,
    ...Wire.roots(tree).map((node) =>
      createElement(WireNodeView, { key: node.id, node, tree, config }),
    ),
  )