// WARNING:
// Do not edit this file. Check its twin in the orkes-saas repo.
import { Box } from "@mui/material";
import { ReactNode } from "react";

import { FeatureDisabledWrapper } from "components/FeatureDisabledWrapper";
import { HEADER_Z_INDEX } from "utils/constants/common";

export type SectionContainerProps = {
  children?: ReactNode;
  header?: ReactNode;
  featureDisabledCustomComponent?: ReactNode;
};

const SectionContainer = ({
  children,
  header = null,
  featureDisabledCustomComponent = null,
}: SectionContainerProps) => {
  return (
    <Box>
      {header && (
        <Box
          sx={(theme) => ({
            position: "sticky",
            top: 0,
            zIndex: HEADER_Z_INDEX,
            backgroundColor: theme.palette.customBackground.main,
          })}
        >
          {header}
        </Box>
      )}
      <Box
        id="section-container"
        sx={{
          padding: 3,
          paddingTop: 0,
          height: "100%",
        }}
      >
        <FeatureDisabledWrapper
          featureDisabledCustomComponent={featureDisabledCustomComponent}
        >
          {children}
        </FeatureDisabledWrapper>
      </Box>
    </Box>
  );
};

export default SectionContainer;
