56 lines
1.4 KiB
TypeScript
56 lines
1.4 KiB
TypeScript
import { Box, useMediaQuery, useTheme } from "@mui/material";
|
|
import { FC } from "react";
|
|
import { StepButtonsBlock } from "../StepButtonsBlock/StepButtonsBlock";
|
|
import { CustomSelect } from "../../../../components/CustomSelect/CustomSelect";
|
|
|
|
type IntegrationStep4Props = {
|
|
handlePrevStep: () => void;
|
|
handleNextStep: () => void;
|
|
selectedDealPerformer: string | null;
|
|
setSelectedDealPerformer: (value: string | null) => void;
|
|
performers: string[];
|
|
};
|
|
|
|
export const IntegrationStep4: FC<IntegrationStep4Props> = ({
|
|
handlePrevStep,
|
|
handleNextStep,
|
|
selectedDealPerformer,
|
|
setSelectedDealPerformer,
|
|
performers,
|
|
}) => {
|
|
const theme = useTheme();
|
|
const isMobile = useMediaQuery(theme.breakpoints.down(600));
|
|
const isTablet = useMediaQuery(theme.breakpoints.down(1000));
|
|
|
|
return (
|
|
<Box
|
|
sx={{
|
|
display: "flex",
|
|
flexDirection: "column",
|
|
alignItems: "center",
|
|
height: "100%",
|
|
flexGrow: 1,
|
|
}}
|
|
>
|
|
<Box sx={{ width: "100%", marginTop: "20px", zIndex: 3 }}>
|
|
<CustomSelect
|
|
selectedItem={selectedDealPerformer}
|
|
items={performers}
|
|
setSelectedItem={setSelectedDealPerformer}
|
|
/>
|
|
</Box>
|
|
<Box
|
|
sx={{
|
|
marginTop: "auto",
|
|
alignSelf: "end",
|
|
}}
|
|
>
|
|
<StepButtonsBlock
|
|
handleNextStep={handleNextStep}
|
|
handlePrevStep={handlePrevStep}
|
|
/>
|
|
</Box>
|
|
</Box>
|
|
);
|
|
};
|