1
0
mirror of https://github.com/ansible/awx.git synced 2024-10-30 13:55:31 +03:00

add ObjectDetails for HTTP Headers display

This commit is contained in:
Keith Grant 2020-08-10 16:48:29 -07:00
parent 4c555815b3
commit 65d4c347c9
3 changed files with 56 additions and 2 deletions

View File

@ -0,0 +1,51 @@
import 'styled-components/macro';
import React from 'react';
import { shape, node, number } from 'prop-types';
import { TextListItemVariants } from '@patternfly/react-core';
import { DetailName, DetailValue } from './Detail';
import CodeMirrorInput from '../CodeMirrorInput';
function ObjectDetail({ value, label, rows, fullHeight }) {
return (
<>
<DetailName
component={TextListItemVariants.dt}
fullWidth
css="grid-column: 1 / -1"
>
<div className="pf-c-form__label">
<span
className="pf-c-form__label-text"
css="font-weight: var(--pf-global--FontWeight--bold)"
>
{label}
</span>
</div>
</DetailName>
<DetailValue
component={TextListItemVariants.dd}
fullWidth
css="grid-column: 1 / -1; margin-top: -20px"
>
<CodeMirrorInput
mode="json"
value={JSON.stringify(value)}
readOnly
rows={rows}
fullHeight={fullHeight}
css="margin-top: 10px"
/>
</DetailValue>
</>
);
}
ObjectDetail.propTypes = {
value: shape.isRequired,
label: node.isRequired,
rows: number,
};
ObjectDetail.defaultProps = {
rows: null,
};
export default ObjectDetail;

View File

@ -3,3 +3,4 @@ export { default as Detail, DetailName, DetailValue } from './Detail';
export { default as DeletedDetail } from './DeletedDetail';
export { default as UserDateDetail } from './UserDateDetail';
export { default as DetailBadge } from './DetailBadge';
export { default as ObjectDetail } from './ObjectDetail';

View File

@ -9,6 +9,7 @@ import {
Detail,
DetailList,
DeletedDetail,
ObjectDetail,
} from '../../../components/DetailList';
import DeleteButton from '../../../components/DeleteButton';
import ErrorDetail from '../../../components/ErrorDetail';
@ -310,11 +311,12 @@ function NotificationTemplateDetail({ i18n, template }) {
value={configuration.http_method}
dataCy="nt-detail-webhook-http-method"
/>
{/* <Detail
<ObjectDetail
label={i18n._(t`HTTP Headers`)}
value={configuration.headers}
rows="6"
dataCy="nt-detail-webhook-headers"
/> */}
/>
</>
)}
</DetailList>