import type {RefObject} from "react";
import {FloatingMediaWindow} from "../../../../packages/spatial-ui/src/FloatingMediaWindow";
export {initialObservationWindowRect,shouldCaptureWorkspacePointer} from "../../../../packages/spatial-ui/src/FloatingMediaWindow";

import type { ObservationWindowRect } from "../core/observation/useObservationLayout";
import type { ObservationSourceDescriptor } from "../core/runtime/contracts";
import { ObservationMedia, observationSourceStatusLabel } from "./ObservationSources";
import type { RecordedObservationPlayback } from "./RecordedFmp4Player";
import type {
  RecordedAdmissionPhase,
  RecordedCameraAdmissionState,
} from "../core/observation/recordedSessionAdmission";

export function FloatingObservationWindow({
  source,
  index,
  count,
  boundsRef,
  rect,
  maximized,
  active,
  hidden = false,
  onRectChange,
  onMaximizedChange,
  onActivate,
  onClose,
  playback,
  prepareRecorded,
  recordedSessionGate,
  recordedAdmissionKey,
  onRecordedAdmissionChange,
}: {
  source: ObservationSourceDescriptor;
  index: number;
  count: number;
  boundsRef: RefObject<HTMLElement | null>;
  rect?: ObservationWindowRect;
  maximized: boolean;
  active: boolean;
  hidden?: boolean;
  onRectChange: (rect: ObservationWindowRect) => void;
  onMaximizedChange: (maximized: boolean) => void;
  onActivate: () => void;
  onClose: () => void;
  playback?: RecordedObservationPlayback | null;
  prepareRecorded?: boolean;
  recordedSessionGate?: RecordedAdmissionPhase;
  recordedAdmissionKey?: string | null;
  onRecordedAdmissionChange?: (
    sourceId: string,
    state: RecordedCameraAdmissionState,
  ) => void;
}) {
  return <FloatingMediaWindow title={source.label} subtitle={source.description}
    index={index} count={count} boundsRef={boundsRef} rect={rect} maximized={maximized}
    active={active} hidden={hidden} onRectChange={onRectChange} onMaximizedChange={onMaximizedChange}
    onActivate={onActivate} onClose={onClose} resizable={source.capabilities.resizable}
    status={<span className="floating-observation-window__status"><i data-availability={source.availability} aria-hidden="true"/>{observationSourceStatusLabel(source)}</span>}
    footer={<span className="floating-observation-window__footer"><span>{source.endpointLabel || source.transport}</span><span>{source.capabilities.timelineMode === "live-only" ? "Эфир без буфера" : "Временная шкала"}</span></span>}>
      <ObservationMedia
        source={source}
        playback={playback}
        prepareRecorded={prepareRecorded}
        recordedSessionGate={recordedSessionGate}
        recordedAdmissionKey={recordedAdmissionKey}
        onRecordedAdmissionChange={onRecordedAdmissionChange}
      />
  </FloatingMediaWindow>;
}