import { Box, useMediaQuery, useTheme } from "@mui/material";
import { PanelSwitchQuestionListGraph } from "@ui_kit/Toolbars/PanelSwitchQuestionListGraph";

interface Props {
  openBranchingPage: boolean;
  setOpenBranchingPage: () => void;
  widthMain: number;
}

export const SwitchBranchingPanel = ({
  openBranchingPage,
  setOpenBranchingPage,
  widthMain,
}: Props) => {
  const theme = useTheme();
  const isMobile = useMediaQuery(theme.breakpoints.down(660));
  const isTablet = useMediaQuery(theme.breakpoints.down(1446));
  return openBranchingPage ? (
    <Box sx={{ userSelect: "none", maxWidth: "350px", width: "100%" }}>
      {widthMain > 1216 && (
        <PanelSwitchQuestionListGraph
          openBranchingPage={openBranchingPage}
          setOpenBranchingPage={setOpenBranchingPage}
        />
      )}
    </Box>
  ) : (
    <></>
  );
};