import { useEffect, useRef, useState, useSyncExternalStore } from "react";
import { useFrame } from "@react-three/fiber";
import { DoubleSide, Group } from "three";
import { subscribeContentManager } from "../content/contentManager";
import { combatMediaPackReady } from "../game/combatMediaPack";
import { type CombatSummon, useCombatStore } from "../game/combatStore";
import { getMobPosition } from "../game/mobRuntimeRegistry";
import { OriginalWowModel } from "./OriginalWowModel";
import { getPreparedShadowfiendMedia, preloadShadowfiendMedia } from "./shadowfiendMedia";

const SHADOWFIEND_CREATURE_ID = 19668;

function ShadowfiendFallback() {
  return <group name="shadowfiend-fallback">
    <mesh position={[0, 0.66, 0]} scale={[0.56, 0.77, 0.46]}>
      <icosahedronGeometry args={[1, 1]} />
      <meshStandardMaterial color="#241335" emissive="#492269" emissiveIntensity={0.7} roughness={0.85} />
    </mesh>
    {[-1, 1].map((side) => <group key={side} position={[side * 0.55, 0.9, 0]} rotation={[0, 0, side * -0.42]}>
      <mesh position={[0, -0.37, 0]}><coneGeometry args={[0.18, 0.88, 5]} />
        <meshStandardMaterial color="#2c1741" emissive="#371456" emissiveIntensity={0.5} />
      </mesh>
      <mesh position={[0, -0.83, 0.1]}><coneGeometry args={[0.12, 0.4, 5]} />
        <meshStandardMaterial color="#a352dd" emissive="#8d35cc" emissiveIntensity={1.4} />
      </mesh>
    </group>)}
    {[-1, 1].map((side) => <mesh key={side} position={[0.49, 0.87, side * 0.18]}>
      <sphereGeometry args={[0.075, 8, 8]} />
      <meshBasicMaterial color="#d68cff" />
    </mesh>)}
    <pointLight color="#7739b8" intensity={0.7} distance={2.5} />
  </group>;
}

function ShadowfiendMember({ summon, active }: { readonly summon: CombatSummon; readonly active: boolean }) {
  const [media, setMedia] = useState(getPreparedShadowfiendMedia);
  const mediaReady = useSyncExternalStore(subscribeContentManager, combatMediaPackReady, () => false);
  const group = useRef<Group>(null);
  const playback = useRef({ elapsedMs: 0, decaying: false });

  useEffect(() => {
    if (!mediaReady) {
      setMedia(null);
      return;
    }
    let cancelled = false;
    void preloadShadowfiendMedia().then((ready) => {
      if (!cancelled) setMedia(ready);
    }).catch(() => { if (!cancelled) setMedia(null); });
    return () => {
      cancelled = true;
    };
  }, [mediaReady]);

  useFrame((_, delta) => {
    if (!group.current) return;
    const live = useCombatStore.getState().summons.find((candidate) => candidate.id === summon.id);
    if (!live) return;
    const goal = live.position;
    const blend = Math.min(1, delta * 9);
    group.current.position.x += (goal[0] - group.current.position.x) * blend;
    group.current.position.y += (goal[1] + 0.13 - group.current.position.y) * blend;
    group.current.position.z += (goal[2] - group.current.position.z) * blend;
    const target = live.targetId ? getMobPosition(live.targetId) : null;
    if (target) group.current.rotation.y = Math.atan2(goal[2] - target[2], target[0] - goal[0]);
    if (active) playback.current.elapsedMs += Math.min(delta, 0.1) * 1_000;
  });

  return <group ref={group} name={`combat-summon:${summon.id}`}
    position={[summon.position[0], summon.position[1] + 0.13, summon.position[2]]}>
    <mesh name="shadowfiend-ground-aura" rotation={[-Math.PI / 2, 0, 0]} position={[0, -0.1, 0]}>
      <ringGeometry args={[0.38, 0.76, 28]} />
      <meshBasicMaterial color="#8a46be" transparent opacity={0.38} depthWrite={false} side={DoubleSide} />
    </mesh>
    {media
      ? <group position={[0, 1.3, 0]} scale={0.65}><OriginalWowModel graph={media.graph} textures={media.textures}
          active={active} playbackRef={playback} loop /></group>
      : <ShadowfiendFallback />}
  </group>;
}

/** Player and companion combat summons live outside the static dungeon population. */
export function CombatSummonPopulation({ active }: { readonly active: boolean }) {
  const summons = useCombatStore((state) => state.summons);
  return <group name="combat-summon-population">
    {summons.filter((summon) => summon.creatureId === SHADOWFIEND_CREATURE_ID && summon.health > 0)
      .map((summon) => <ShadowfiendMember key={summon.id} summon={summon} active={active} />)}
  </group>;
}