diff --git a/awx/ui_next/src/components/CollapsibleSection/CollapsibleSection.jsx b/awx/ui_next/src/components/CollapsibleSection/CollapsibleSection.jsx index 4bae5b2c9d..184106a177 100644 --- a/awx/ui_next/src/components/CollapsibleSection/CollapsibleSection.jsx +++ b/awx/ui_next/src/components/CollapsibleSection/CollapsibleSection.jsx @@ -3,6 +3,7 @@ import { bool, string } from 'prop-types'; import styled from 'styled-components'; import { Button } from '@patternfly/react-core'; import { AngleRightIcon } from '@patternfly/react-icons'; +import omitProps from '@util/omitProps'; import ExpandingContainer from './ExpandingContainer'; const Toggle = styled.div` @@ -17,12 +18,12 @@ const Toggle = styled.div` } `; -const Arrow = styled(AngleRightIcon)` +const Arrow = styled(omitProps(AngleRightIcon, 'isExpanded'))` margin-right: -5px; margin-left: 5px; transition: transform 0.1s ease-out; transform-origin: 50% 50%; - ${(props) => props.isExpanded && `transform: rotate(90deg);`} + ${props => props.isExpanded && `transform: rotate(90deg);`} `; function CollapsibleSection({ label, startExpanded, children }) { diff --git a/awx/ui_next/src/util/omitProps.jsx b/awx/ui_next/src/util/omitProps.jsx new file mode 100644 index 0000000000..e9c1f8f975 --- /dev/null +++ b/awx/ui_next/src/util/omitProps.jsx @@ -0,0 +1,11 @@ +import React from 'react'; + +export default function omitProps(Component, ...omit) { + return function Omit(props) { + const clean = { ...props }; + omit.forEach(key => { + delete clean[key]; + }) + return ; + } +}