Added proptypes and jsdocs to the tabpanel.

src/Components/NotificationIntegrationModal/NotificationIntegrationModal.jsx

@@ -175,8 +175,8 @@ const NotificationIntegrationModal = ({
       maxWidth="md"
       sx={{
         '& .MuiDialog-paper': {
-          width: `calc(90% - ${theme.spacing(40)})`, 
-          maxWidth: theme.breakpoints.values.md 
+          width: `calc(80% - ${theme.spacing(40)})`, 
+          maxWidth: `${theme.breakpoints.values.md - 70}px` 
         }
       }}
     >

src/Components/NotificationIntegrationModal/TabPanel.jsx

@@ -1,7 +1,19 @@
 import React from "react";
+import PropTypes from "prop-types";
 import { Box } from "@mui/material";
 import { useTheme } from "@emotion/react";
 
+/**
+ * TabPanel component that displays content for the selected tab.
+ * 
+ * @component
+ * @param {Object} props - The component props.
+ * @param {React.ReactNode} props.children - The content to be displayed when this tab panel is selected.
+ * @param {number} props.value - The currently selected tab value.
+ * @param {number} props.index - The index of this specific tab panel.
+ * @param {Object} props.other - Any additional props to be spread to the root element.
+ * @returns {React.ReactElement|null} The rendered tab panel or null if not selected.
+ */
 function TabPanel({ children, value, index, ...other }) {
   const theme = useTheme(); 
   
@@ -22,4 +34,13 @@ function TabPanel({ children, value, index, ...other }) {
   );
 }
 
+TabPanel.propTypes = {
+
+  children: PropTypes.node,
+  
+  index: PropTypes.number.isRequired,
+  
+  value: PropTypes.number.isRequired
+};
+
 export default TabPanel;