link-stack/apps/link/app/(main)/leafcutter/[view]/_components/LeafcutterWrapper.tsx

"use client";

import { FC } from "react";
import getConfig from "next/config";
import { Grid } from "@mui/material";
import Iframe from "react-iframe";

type LeafcutterWrapperProps = {
  path: string;
};

export const LeafcutterWrapper: FC<LeafcutterWrapperProps> = ({ path }) => {
  const {
    publicRuntimeConfig: { linkURL },
  } = getConfig();
  const fullLeafcutterURL = `${linkURL}/proxy/leafcutter/${path}`;

  return (
    <Grid
      container
      spacing={0}
      sx={{ height: "100%", width: "100%" }}
      direction="column"
    >
      <Grid item sx={{ height: "100vh", width: "100%" }}>
        <Iframe
          id="leafcutter"
          url={fullLeafcutterURL}
          width="100%"
          height="100%"
          frameBorder={0}
        />
      </Grid>
    </Grid>
  );
};