85 lines
1.7 KiB
React
85 lines
1.7 KiB
React
// Components
|
|
import { TabContext } from "@mui/lab";
|
|
import { Tab, useTheme } from "@mui/material";
|
|
import Settings from "./Settings";
|
|
import Content from "./Content";
|
|
|
|
// Utils
|
|
import PropTypes from "prop-types";
|
|
import CustomTabList from "../../../../../Components/Tab";
|
|
|
|
const Tabs = ({
|
|
isCreate,
|
|
form,
|
|
errors,
|
|
monitors,
|
|
selectedMonitors,
|
|
setSelectedMonitors,
|
|
handleFormChange,
|
|
handleImageChange,
|
|
progress,
|
|
removeLogo,
|
|
tab,
|
|
setTab,
|
|
TAB_LIST,
|
|
}) => {
|
|
const theme = useTheme();
|
|
return (
|
|
<TabContext value={TAB_LIST[tab]}>
|
|
<CustomTabList
|
|
onChange={(_, selected) => {
|
|
setTab(TAB_LIST.indexOf(selected));
|
|
}}
|
|
aria-label="status page tabs"
|
|
>
|
|
{TAB_LIST.map((tabLabel, idx) => (
|
|
<Tab
|
|
key={tabLabel}
|
|
label={tabLabel}
|
|
value={tabLabel}
|
|
/>
|
|
))}
|
|
</CustomTabList>
|
|
{tab === 0 ? (
|
|
<Settings
|
|
tabValue={TAB_LIST[0]}
|
|
form={form}
|
|
handleFormChange={handleFormChange}
|
|
handleImageChange={handleImageChange}
|
|
progress={progress}
|
|
removeLogo={removeLogo}
|
|
errors={errors}
|
|
isCreate={isCreate}
|
|
/>
|
|
) : (
|
|
<Content
|
|
tabValue={TAB_LIST[1]}
|
|
form={form}
|
|
monitors={monitors}
|
|
handleFormChange={handleFormChange}
|
|
errors={errors}
|
|
selectedMonitors={selectedMonitors}
|
|
setSelectedMonitors={setSelectedMonitors}
|
|
/>
|
|
)}
|
|
</TabContext>
|
|
);
|
|
};
|
|
|
|
Tabs.propTypes = {
|
|
form: PropTypes.object,
|
|
errors: PropTypes.object,
|
|
monitors: PropTypes.array,
|
|
selectedMonitors: PropTypes.array,
|
|
setSelectedMonitors: PropTypes.func,
|
|
handleFormChange: PropTypes.func,
|
|
handleImageChange: PropTypes.func,
|
|
progress: PropTypes.object,
|
|
removeLogo: PropTypes.func,
|
|
tab: PropTypes.number,
|
|
setTab: PropTypes.func,
|
|
TAB_LIST: PropTypes.array,
|
|
};
|
|
|
|
export default Tabs;
|