import { useEffect, useState, type RefObject } from "react";
import type { AppStore } from "@editor/store";
import { isPanInteractionMode } from "@editor/tools";
import type { GlobalKeybindConsumer, GlobalPointerConsumer, GlobalWheelConsumer } from "@input/index";
import {
  createViewportPanInputController,
  handleViewportWheel,
  keybindEventFromKeyboardEvent,
  pointerInputEventFromPointerEvent,
  wheelInputEventFromWheelEvent,
} from "@input/index";

export type CanvasInputOptions = {
  globalKeybindConsumer: GlobalKeybindConsumer;
  globalPointerConsumer: GlobalPointerConsumer;
  globalWheelConsumer: GlobalWheelConsumer;
};

export type CanvasInputState = {
  isPanning: boolean;
};

export function useCanvasInput(
  canvasRef: RefObject<HTMLCanvasElement | null>,
  store: AppStore,
  options: CanvasInputOptions,
): CanvasInputState {
  const [isPanning, setIsPanning] = useState(false);

  useEffect(() => {
    const canvas = canvasRef.current;
    if (!canvas) return;

    const panHandler = createViewportPanInputController({
      globalKeyConsumer: options.globalKeybindConsumer,
      globalPointerConsumer: options.globalPointerConsumer,
      dispatch: store.dispatch,
      getCurrentZoom: () => store.getState().editor.viewport.zoom,
      isPanMode: () => isPanInteractionMode(store.getState().editor.tools.interactionMode),
    });

    const handleKeyDown = (event: KeyboardEvent) => {
      const consumed = panHandler.keyDown(keybindEventFromKeyboardEvent(event));
      if (consumed) event.preventDefault();
    };

    const handleKeyUp = (event: KeyboardEvent) => {
      const consumed = panHandler.keyUp(keybindEventFromKeyboardEvent(event));
      if (consumed) event.preventDefault();
    };

    const handlePointerDown = (event: PointerEvent) => {
      const consumed = panHandler.pointerDown(pointerInputEventFromPointerEvent(event));
      if (!consumed) return;

      canvas.setPointerCapture(event.pointerId);
      setIsPanning(true);
      event.preventDefault();
    };

    const handlePointerMove = (event: PointerEvent) => {
      const consumed = panHandler.pointerMove(pointerInputEventFromPointerEvent(event));
      if (consumed) event.preventDefault();
    };

    const handlePointerUp = (event: PointerEvent) => {
      const consumed = panHandler.pointerUp(pointerInputEventFromPointerEvent(event));
      if (!consumed) return;

      setIsPanning(false);
      event.preventDefault();
    };

    const handleWheel = (event: WheelEvent) => {
      const consumed = handleViewportWheel({
        event: wheelInputEventFromWheelEvent(event),
        globalConsumer: options.globalWheelConsumer,
        dispatch: store.dispatch,
        currentZoom: store.getState().editor.viewport.zoom,
      });

      if (consumed) event.preventDefault();
    };

    window.addEventListener("keydown", handleKeyDown);
    window.addEventListener("keyup", handleKeyUp);
    canvas.addEventListener("pointerdown", handlePointerDown);
    canvas.addEventListener("pointermove", handlePointerMove);
    canvas.addEventListener("pointerup", handlePointerUp);
    canvas.addEventListener("pointercancel", handlePointerUp);
    canvas.addEventListener("wheel", handleWheel, { passive: false });

    return () => {
      window.removeEventListener("keydown", handleKeyDown);
      window.removeEventListener("keyup", handleKeyUp);
      canvas.removeEventListener("pointerdown", handlePointerDown);
      canvas.removeEventListener("pointermove", handlePointerMove);
      canvas.removeEventListener("pointerup", handlePointerUp);
      canvas.removeEventListener("pointercancel", handlePointerUp);
      canvas.removeEventListener("wheel", handleWheel);
    };
  }, [canvasRef, options, store]);

  return { isPanning };
}