diff --git a/awx/ui_next/src/components/Card/CardActionsRow.jsx b/awx/ui_next/src/components/Card/CardActionsRow.jsx new file mode 100644 index 0000000000..045483a06a --- /dev/null +++ b/awx/ui_next/src/components/Card/CardActionsRow.jsx @@ -0,0 +1,23 @@ +import React from 'react'; +import { CardActions } from '@patternfly/react-core'; +import styled from 'styled-components'; + +const CardActionsWrapper = styled.div` + display: flex; + justify-content: flex-end; + margin-top: 20px; + + & > :not(:first-child) { + margin-left: 20px; + } +`; + +function CardActionsRow({ children }) { + return ( + + {children} + + ); +} + +export default CardActionsRow; diff --git a/awx/ui_next/src/components/Card/index.js b/awx/ui_next/src/components/Card/index.js index 42ad8807ba..860e50a051 100644 --- a/awx/ui_next/src/components/Card/index.js +++ b/awx/ui_next/src/components/Card/index.js @@ -1,2 +1,3 @@ export { default as TabbedCardHeader } from './TabbedCardHeader'; export { default as CardBody } from './CardBody'; +export { default as CardActionsRow } from './CardActionsRow'; diff --git a/awx/ui_next/src/screens/Inventory/InventoryDetail/InventoryDetail.jsx b/awx/ui_next/src/screens/Inventory/InventoryDetail/InventoryDetail.jsx index c356e769ca..182978fd21 100644 --- a/awx/ui_next/src/screens/Inventory/InventoryDetail/InventoryDetail.jsx +++ b/awx/ui_next/src/screens/Inventory/InventoryDetail/InventoryDetail.jsx @@ -2,7 +2,8 @@ import React, { useState, useEffect } from 'react'; import { Link } from 'react-router-dom'; import { withI18n } from '@lingui/react'; import { t } from '@lingui/macro'; -import { CardBody } from '@components/Card'; +import { Button } from '@patternfly/react-core'; +import { CardBody, CardActionsRow } from '@components/Card'; import { DetailList, Detail, UserDateDetail } from '@components/DetailList'; import { ChipGroup, Chip } from '@components/Chip'; import { VariablesDetail } from '@components/CodeMirrorInput'; @@ -84,6 +85,16 @@ function InventoryDetail({ inventory, i18n }) { user={inventory.summary_fields.modified_by} /> + {inventory.summary_fields.user_capabilities.edit && ( + + + + )} ); }