/**
 * Property reel — the JSON contract between the main app's "Create Reel"
 * pipeline (src/lib/promo-video/property-reel.ts) and this Remotion
 * composition (ReelVideo.tsx).
 *
 * Unlike the AI-written promo JobScript, a reel spec is built
 * deterministically from a property listing: no LLM, no narration — a
 * music-driven sequence of full-bleed photo slides with factual overlays
 * (title, location, price, beds/baths, features) and a contact end card.
 */

import React from "react";

/** One slide in the reel. Photos carry `image` (path relative to the bundled
 *  public dir, e.g. "images/reel/0.jpg"); special cards carry only a `label`
 *  ("intro", "features", "outro"). */
export interface ReelSlide {
  image?: string;
  /** Short label shown over the photo, or the card type for non-photo slides. */
  label?: string;
}

export interface ReelFeature {
  icon: string;
  text: string;
}

export interface ReelSpec {
  brand: {
    name: string;
    tagline: string;
    website: string;
  };
  property: {
    title: string;
    location: string;
    /** Pre-formatted price string, e.g. "KSh 8,000,000" or "KSh 65,000 /mo". */
    price?: string;
    /** Sale or rental — drives the price suffix chip. */
    listingType?: "sale" | "rent" | "other";
    bedrooms?: number;
    bathrooms?: number;
    /** Free-text amenity highlights (max 4 are rendered). */
    features: string[];
    /** Listing URL for the QR-style end card (optional). */
    url?: string;
  };
  slides: ReelSlide[];
  /** Agent-facing caption shown on the opening card (optional). */
  tagline?: string;
}

/** Per-slide timing produced by scripts/render-job.mjs (one entry per slide). */
export interface ReelTiming {
  slide: number;
  start: number;
  duration: number;
}

export interface ReelVideoProps {
  spec: ReelSpec;
  schedule: ReelTiming[];
  durationInFrames: number;
}

const ReelSpecContext = React.createContext<ReelSpec | null>(null);

export const ReelSpecProvider = ReelSpecContext.Provider;

/** Returns the active reel spec, or null when rendering other compositions. */
export function useReelSpec(): ReelSpec | null {
  return React.useContext(ReelSpecContext);
}