1
0
mirror of https://github.com/ansible/awx.git synced 2024-10-27 09:25:10 +03:00

Removes missingDetail prop and addresses a typo.

This removes `missingDetail` prop in favor of using styledComponent's className prop.
This commit is contained in:
Alex Corey 2019-11-04 14:42:00 -05:00
parent e5b76c6427
commit 9170aa184a
3 changed files with 24 additions and 41 deletions

View File

@ -14,7 +14,7 @@ const DetailName = styled(({ fullWidth, ...props }) => (
`} `}
`; `;
const DetailValue = styled(({ fullWidth, missingValue, ...props }) => ( const DetailValue = styled(({ fullWidth, ...props }) => (
<TextListItem {...props} /> <TextListItem {...props} />
))` ))`
word-break: break-all; word-break: break-all;
@ -23,42 +23,36 @@ const DetailValue = styled(({ fullWidth, missingValue, ...props }) => (
` `
grid-column: 2 / -1; grid-column: 2 / -1;
`} `}
${props =>
props.missingValue &&
`
color: #c9190b;
`}
`; `;
const Detail = ({ label, value, fullWidth, missingValue }) => { const Detail = ({ label, value, fullWidth, className}) => {
if (!value && typeof value !== 'number') { if (!value && typeof value !== 'number') {
return null; return null;
} }
return ( return (
<Fragment> <>
<DetailName component={TextListItemVariants.dt} fullWidth={fullWidth}> <DetailName className={className} component={TextListItemVariants.dt} fullWidth={fullWidth}>
{label} {label}
</DetailName> </DetailName>
<DetailValue <DetailValue
missingValue={missingValue} className={className}
component={TextListItemVariants.dd} component={TextListItemVariants.dd}
fullWidth={fullWidth} fullWidth={fullWidth}
> >
{value} {value}
</DetailValue> </DetailValue>
</Fragment> </>
); );
}; };
Detail.propTypes = { Detail.propTypes = {
label: node.isRequired, label: node.isRequired,
value: node, value: node,
fullWidth: bool, fullWidth: bool,
missingValue: bool,
}; };
Detail.defaultProps = { Detail.defaultProps = {
value: null, value: null,
fullWidth: false, fullWidth: false,
missingValue: false,
}; };
export default Detail; export default Detail;

View File

@ -72,7 +72,6 @@ exports[`<ResourceAccessListItem /> initially renders succesfully 1`] = `
<Detail <Detail
fullWidth={false} fullWidth={false}
label="Name" label="Name"
missingValue={false}
value="jane brown" value="jane brown"
/> />
</ForwardRef> </ForwardRef>
@ -84,7 +83,6 @@ exports[`<ResourceAccessListItem /> initially renders succesfully 1`] = `
<Detail <Detail
fullWidth={false} fullWidth={false}
label="Team Roles" label="Team Roles"
missingValue={false}
value={ value={
<ForwardRef> <ForwardRef>
<ForwardRef <ForwardRef
@ -128,7 +126,6 @@ exports[`<ResourceAccessListItem /> initially renders succesfully 1`] = `
<Detail <Detail
fullWidth={false} fullWidth={false}
label="Name" label="Name"
missingValue={false}
value="jane brown" value="jane brown"
/> />
</ForwardRef> </ForwardRef>
@ -140,7 +137,6 @@ exports[`<ResourceAccessListItem /> initially renders succesfully 1`] = `
<Detail <Detail
fullWidth={false} fullWidth={false}
label="Team Roles" label="Team Roles"
missingValue={false}
value={ value={
<ForwardRef> <ForwardRef>
<ForwardRef <ForwardRef
@ -207,7 +203,6 @@ exports[`<ResourceAccessListItem /> initially renders succesfully 1`] = `
<Detail <Detail
fullWidth={false} fullWidth={false}
label="Name" label="Name"
missingValue={false}
value="jane brown" value="jane brown"
/> />
</ForwardRef> </ForwardRef>
@ -219,7 +214,6 @@ exports[`<ResourceAccessListItem /> initially renders succesfully 1`] = `
<Detail <Detail
fullWidth={false} fullWidth={false}
label="Team Roles" label="Team Roles"
missingValue={false}
value={ value={
<ForwardRef> <ForwardRef>
<ForwardRef <ForwardRef
@ -385,7 +379,6 @@ exports[`<ResourceAccessListItem /> initially renders succesfully 1`] = `
<Detail <Detail
fullWidth={false} fullWidth={false}
label="Name" label="Name"
missingValue={false}
value="jane brown" value="jane brown"
> >
<Detail__DetailName <Detail__DetailName
@ -442,7 +435,6 @@ exports[`<ResourceAccessListItem /> initially renders succesfully 1`] = `
<Detail__DetailValue <Detail__DetailValue
component="dd" component="dd"
fullWidth={false} fullWidth={false}
missingValue={false}
> >
<StyledComponent <StyledComponent
component="dd" component="dd"
@ -453,12 +445,10 @@ exports[`<ResourceAccessListItem /> initially renders succesfully 1`] = `
"componentStyle": ComponentStyle { "componentStyle": ComponentStyle {
"componentId": "Detail__DetailValue-sc-16ypsyv-1", "componentId": "Detail__DetailValue-sc-16ypsyv-1",
"isStatic": false, "isStatic": false,
"lastClassName": "kCDjmZ", "lastClassName": "yHlYM",
"rules": Array [ "rules": Array [
"word-break:break-all;", "word-break:break-all;",
[Function], [Function],
" ",
[Function],
], ],
}, },
"displayName": "Detail__DetailValue", "displayName": "Detail__DetailValue",
@ -473,20 +463,18 @@ exports[`<ResourceAccessListItem /> initially renders succesfully 1`] = `
} }
forwardedRef={null} forwardedRef={null}
fullWidth={false} fullWidth={false}
missingValue={false}
> >
<Component <Component
className="Detail__DetailValue-sc-16ypsyv-1 kCDjmZ" className="Detail__DetailValue-sc-16ypsyv-1 yHlYM"
component="dd" component="dd"
fullWidth={false} fullWidth={false}
missingValue={false}
> >
<TextListItem <TextListItem
className="Detail__DetailValue-sc-16ypsyv-1 kCDjmZ" className="Detail__DetailValue-sc-16ypsyv-1 yHlYM"
component="dd" component="dd"
> >
<dd <dd
className="Detail__DetailValue-sc-16ypsyv-1 kCDjmZ" className="Detail__DetailValue-sc-16ypsyv-1 yHlYM"
data-pf-content={true} data-pf-content={true}
> >
jane brown jane brown
@ -554,7 +542,6 @@ exports[`<ResourceAccessListItem /> initially renders succesfully 1`] = `
<Detail <Detail
fullWidth={false} fullWidth={false}
label="Team Roles" label="Team Roles"
missingValue={false}
value={ value={
<ForwardRef> <ForwardRef>
<ForwardRef <ForwardRef
@ -620,7 +607,6 @@ exports[`<ResourceAccessListItem /> initially renders succesfully 1`] = `
<Detail__DetailValue <Detail__DetailValue
component="dd" component="dd"
fullWidth={false} fullWidth={false}
missingValue={false}
> >
<StyledComponent <StyledComponent
component="dd" component="dd"
@ -631,12 +617,10 @@ exports[`<ResourceAccessListItem /> initially renders succesfully 1`] = `
"componentStyle": ComponentStyle { "componentStyle": ComponentStyle {
"componentId": "Detail__DetailValue-sc-16ypsyv-1", "componentId": "Detail__DetailValue-sc-16ypsyv-1",
"isStatic": false, "isStatic": false,
"lastClassName": "kCDjmZ", "lastClassName": "yHlYM",
"rules": Array [ "rules": Array [
"word-break:break-all;", "word-break:break-all;",
[Function], [Function],
" ",
[Function],
], ],
}, },
"displayName": "Detail__DetailValue", "displayName": "Detail__DetailValue",
@ -651,20 +635,18 @@ exports[`<ResourceAccessListItem /> initially renders succesfully 1`] = `
} }
forwardedRef={null} forwardedRef={null}
fullWidth={false} fullWidth={false}
missingValue={false}
> >
<Component <Component
className="Detail__DetailValue-sc-16ypsyv-1 kCDjmZ" className="Detail__DetailValue-sc-16ypsyv-1 yHlYM"
component="dd" component="dd"
fullWidth={false} fullWidth={false}
missingValue={false}
> >
<TextListItem <TextListItem
className="Detail__DetailValue-sc-16ypsyv-1 kCDjmZ" className="Detail__DetailValue-sc-16ypsyv-1 yHlYM"
component="dd" component="dd"
> >
<dd <dd
className="Detail__DetailValue-sc-16ypsyv-1 kCDjmZ" className="Detail__DetailValue-sc-16ypsyv-1 yHlYM"
data-pf-content={true} data-pf-content={true}
> >
<ChipGroup> <ChipGroup>

View File

@ -28,6 +28,12 @@ const ButtonGroup = styled.div`
margin-left: 20px; margin-left: 20px;
} }
`; `;
const MissingDetail = styled(Detail)`
dd& {
color: red;
}
`;
class JobTemplateDetail extends Component { class JobTemplateDetail extends Component {
constructor(props) { constructor(props) {
super(props); super(props);
@ -158,12 +164,13 @@ class JobTemplateDetail extends Component {
); );
const renderMissingDataDetail = value => ( const renderMissingDataDetail = value => (
<Detail missingValue label={value} value={i18n._(t`Deleted`)} />
<MissingDetail label={value} value={i18n._(t`Deleted`)} />
); );
const inventoryValue = (kind, id) => { const inventoryValue = (kind, id) => {
const inventorykind = const inventorykind =
kind === 'smart' ? (kind = 'smary_inventory') : (kind = 'inventory'); kind === 'smart' ? (kind = 'smart_inventory') : (kind = 'inventory');
return ask_inventory_on_launch ? ( return ask_inventory_on_launch ? (
<Fragment> <Fragment>