import { createContext, useContext, type ReactNode } from "react";
import { CitedMarkdown } from "../../citations/CitedMarkdown";
import { InlineCite } from "../../citations/InlineCite";
import type { SlideView } from "../../../lib/report/slides";

// WHAT A SLIDE NEEDS FROM WHERE IT IS SHOWN. The slides (Slide.tsx) are the
// same everywhere; three things differ by host, and come from here:
//
//   md        a slide's markdown (a point, the summary's first paragraph, a
//             section's first sentences), its `cite:` links live
//   cite      a citation's marker beside the evidence it shows
//   readHref  where "Read this in the article" goes for a slide
//   onRead    what following it does instead of navigating (the reader keeps
//             its place by switching views in the page)
//   badge     something to show on a slide (umtool: its notes)
//
// The default is the export site's: CitedMarkdown and InlineCite, whose
// numbers open the citation's card, inside the page's CitationsProvider.
// umtool passes its own (a citation opens its evidence rail); slides.html its
// static links.

export type SlidesHost = {
  md: (text: string) => ReactNode;
  cite: (id: string, children: ReactNode) => ReactNode;
  readHref: (slide: SlideView) => string;
  onRead?: (slide: SlideView) => void;
  badge?: (slide: SlideView) => ReactNode;
};

export const defaultSlidesHost: SlidesHost = {
  md: (text) => <CitedMarkdown className="rs-md">{text}</CitedMarkdown>,
  cite: (id, children) => <InlineCite id={id}>{children}</InlineCite>,
  readHref: (slide) => `#${slide.anchorId}`,
};

const SlidesHostContext = createContext<SlidesHost>(defaultSlidesHost);

export function SlidesHostProvider({ host, children }: { host: SlidesHost; children: ReactNode }) {
  return <SlidesHostContext.Provider value={host}>{children}</SlidesHostContext.Provider>;
}

export function useSlidesHost(): SlidesHost {
  return useContext(SlidesHostContext);
}