import React from "react";
import {Composition} from "remotion";
import {YukkuriComposition} from "./yukkuri-composition";
import {FPS as YUKKURI_ZUNDAMON_FPS, totalDurationInFrames as totalYukkuriZundamonDurationInFrames} from "./data/timing";
import {PizzaKilnSayoComposition} from "./pizza-kiln-composition";
import {
  PIZZA_KILN_FPS,
  totalPizzaKilnDurationInFrames,
} from "./data/pizza-kiln/timing";
import {PizzaOvenProject01} from "./pizzaOvenProject01";
import {
  PIZZA_OVEN_PROJECT_01_FPS,
  totalPizzaOvenProject01DurationInFrames,
} from "./data/pizza-oven-project-01/timing";

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