import React from "react";
import {Composition} from "remotion";
import {YukkuriComposition} from "./yukkuri-composition";
import {FPS, totalDurationInFrames} from "./data/timing";
import {PizzaKilnSayoComposition} from "./pizza-kiln-composition";
import {
  PIZZA_KILN_FPS,
  totalPizzaKilnDurationInFrames,
} from "./data/pizza-kiln/timing";

export const Root: React.FC = () => {
  return (
    <>
      <Composition
        id="YukkuriZundamon"
        component={YukkuriComposition}
        durationInFrames={totalDurationInFrames(FPS)}
        fps={FPS}
        width={1280}
        height={720}
      />
      <Composition
        id="PizzaKilnSayo"
        component={PizzaKilnSayoComposition}
        durationInFrames={totalPizzaKilnDurationInFrames(PIZZA_KILN_FPS)}
        fps={PIZZA_KILN_FPS}
        width={1280}
        height={720}
      />
    </>
  );
};