import { FC } from 'react'; import { Link } from 'react-router-dom'; import { Alert, Box, Card, Typography } from '@mui/material'; import ToggleOnIcon from '@mui/icons-material/ToggleOn'; import { ConditionallyRender } from 'component/common/ConditionallyRender/ConditionallyRender'; interface IChangeRequestToggleChange { featureName: string; projectId: string; conflict?: string; onNavigate?: () => void; } export const ChangeRequestFeatureToggleChange: FC< IChangeRequestToggleChange > = ({ featureName, projectId, conflict, onNavigate, children }) => ( ({ marginTop: theme.spacing(2), overflow: 'hidden', })} > ({ backgroundColor: Boolean(conflict) ? theme.palette.warning.light : theme.palette.tableHeaderBackground, borderRadius: theme => `${theme.shape.borderRadiusLarge}px ${theme.shape.borderRadiusLarge}px 0 0`, border: '1px solid', borderColor: theme => conflict ? theme.palette.warning.border : theme.palette.dividerAlternative, borderBottom: 'none', overflow: 'hidden', })} > Conflict! {conflict}. } /> {featureName} {children} );