diff --git a/awx/ui_next/src/screens/Inventory/InventoryGroupAdd/InventoryGroupAdd.jsx b/awx/ui_next/src/screens/Inventory/InventoryGroupAdd/InventoryGroupAdd.jsx index eff8a2fe10..ede9a5abf2 100644 --- a/awx/ui_next/src/screens/Inventory/InventoryGroupAdd/InventoryGroupAdd.jsx +++ b/awx/ui_next/src/screens/Inventory/InventoryGroupAdd/InventoryGroupAdd.jsx @@ -1,28 +1,28 @@ -import React, { useState, useEffect } from 'react'; +import React, { useState } from 'react'; import { withI18n } from '@lingui/react'; -import { withRouter } from 'react-router-dom'; +import { useHistory, useParams } from 'react-router-dom'; import { GroupsAPI } from '@api'; import { Card } from '@patternfly/react-core'; import InventoryGroupForm from '../shared/InventoryGroupForm'; -function InventoryGroupsAdd({ history, inventory, setBreadcrumb }) { +function InventoryGroupsAdd() { const [error, setError] = useState(null); - - useEffect(() => setBreadcrumb(inventory), [inventory, setBreadcrumb]); + const { id } = useParams(); + const history = useHistory(); const handleSubmit = async values => { - values.inventory = inventory.id; + values.inventory = id; try { const { data } = await GroupsAPI.create(values); - history.push(`/inventories/inventory/${inventory.id}/groups/${data.id}`); + history.push(`/inventories/inventory/${id}/groups/${data.id}`); } catch (err) { setError(err); } }; const handleCancel = () => { - history.push(`/inventories/inventory/${inventory.id}/groups`); + history.push(`/inventories/inventory/${id}/groups`); }; return ( @@ -35,5 +35,5 @@ function InventoryGroupsAdd({ history, inventory, setBreadcrumb }) { ); } -export default withI18n()(withRouter(InventoryGroupsAdd)); +export default withI18n()(InventoryGroupsAdd); export { InventoryGroupsAdd as _InventoryGroupsAdd }; diff --git a/awx/ui_next/src/screens/Inventory/InventoryGroupAdd/InventoryGroupAdd.test.jsx b/awx/ui_next/src/screens/Inventory/InventoryGroupAdd/InventoryGroupAdd.test.jsx index a3abb97035..ccbbdb8bfb 100644 --- a/awx/ui_next/src/screens/Inventory/InventoryGroupAdd/InventoryGroupAdd.test.jsx +++ b/awx/ui_next/src/screens/Inventory/InventoryGroupAdd/InventoryGroupAdd.test.jsx @@ -21,9 +21,7 @@ describe('', () => { wrapper = mountWithContexts( ( - {}} inventory={{ id: 1 }} /> - )} + component={() => } />, { context: { diff --git a/awx/ui_next/src/screens/Inventory/InventoryGroupEdit/InventoryGroupEdit.jsx b/awx/ui_next/src/screens/Inventory/InventoryGroupEdit/InventoryGroupEdit.jsx index 230314ce7c..aa1ddde74f 100644 --- a/awx/ui_next/src/screens/Inventory/InventoryGroupEdit/InventoryGroupEdit.jsx +++ b/awx/ui_next/src/screens/Inventory/InventoryGroupEdit/InventoryGroupEdit.jsx @@ -1,28 +1,26 @@ import React, { useState } from 'react'; import { withI18n } from '@lingui/react'; -import { withRouter } from 'react-router-dom'; +import { useParams, useHistory } from 'react-router-dom'; import { GroupsAPI } from '@api'; import InventoryGroupForm from '../shared/InventoryGroupForm'; -function InventoryGroupEdit({ history, inventoryGroup, inventory, match }) { +function InventoryGroupEdit({ inventoryGroup }) { const [error, setError] = useState(null); + const { id, groupId } = useParams(); + const history = useHistory(); const handleSubmit = async values => { try { - await GroupsAPI.update(match.params.groupId, values); - history.push( - `/inventories/inventory/${inventory.id}/groups/${inventoryGroup.id}` - ); + await GroupsAPI.update(groupId, values); + history.push(`/inventories/inventory/${id}/groups/${groupId}`); } catch (err) { setError(err); } }; const handleCancel = () => { - history.push( - `/inventories/inventory/${inventory.id}/groups/${inventoryGroup.id}` - ); + history.push(`/inventories/inventory/${id}/groups/${groupId}`); }; return ( @@ -34,5 +32,5 @@ function InventoryGroupEdit({ history, inventoryGroup, inventory, match }) { /> ); } -export default withI18n()(withRouter(InventoryGroupEdit)); +export default withI18n()(InventoryGroupEdit); export { InventoryGroupEdit as _InventoryGroupEdit }; diff --git a/awx/ui_next/src/screens/Inventory/InventoryGroupEdit/InventoryGroupEdit.test.jsx b/awx/ui_next/src/screens/Inventory/InventoryGroupEdit/InventoryGroupEdit.test.jsx index 240bb3dec0..fe9c678a23 100644 --- a/awx/ui_next/src/screens/Inventory/InventoryGroupEdit/InventoryGroupEdit.test.jsx +++ b/awx/ui_next/src/screens/Inventory/InventoryGroupEdit/InventoryGroupEdit.test.jsx @@ -26,24 +26,12 @@ describe('', () => { wrapper = mountWithContexts( ( - {}} - inventory={{ id: 1 }} - inventoryGroup={{ id: 2 }} - /> - )} + component={() => } />, { context: { router: { history, - route: { - match: { - params: { groupId: 13 }, - }, - location: history.location, - }, }, }, } diff --git a/awx/ui_next/src/screens/Template/TemplateList/TemplateListItem.jsx b/awx/ui_next/src/screens/Template/TemplateList/TemplateListItem.jsx index 55ceca10c9..51bb28c28b 100644 --- a/awx/ui_next/src/screens/Template/TemplateList/TemplateListItem.jsx +++ b/awx/ui_next/src/screens/Template/TemplateList/TemplateListItem.jsx @@ -1,4 +1,4 @@ -import React, { Component } from 'react'; +import React from 'react'; import { Link } from 'react-router-dom'; import { DataListItem, @@ -22,7 +22,6 @@ import ListActionButton from '@components/ListActionButton'; import VerticalSeparator from '@components/VerticalSeparator'; import { Sparkline } from '@components/Sparkline'; import { toTitleCase } from '@util/strings'; - import styled from 'styled-components'; const rightStyle = ` @@ -51,108 +50,104 @@ const LeftDataListCell = styled(DataListCell)` } } `; + const RightDataListCell = styled(DataListCell)` ${rightStyle} `; + const RightActionButtonCell = styled(ActionButtonCell)` ${rightStyle} `; -class TemplateListItem extends Component { - render() { - const { i18n, template, isSelected, onSelect } = this.props; - const canLaunch = template.summary_fields.user_capabilities.start; - const missingResourceIcon = +function TemplateListItem({ i18n, template, isSelected, onSelect }) { + const canLaunch = template.summary_fields.user_capabilities.start; + + const missingResourceIcon = + template.type === 'job_template' && + (!template.summary_fields.project || (!template.summary_fields.inventory && - !template.ask_inventory_on_launch) || - !template.summary_fields.project; - return ( - - - - - + !template.ask_inventory_on_launch)); + + return ( + + + + + + + + {template.name} + + + {missingResourceIcon && ( - - {template.name} - + + + - {missingResourceIcon && ( - - - - - - )} - , - - {toTitleCase(template.type)} - , - - - , - - {canLaunch && template.type === 'job_template' && ( - - - {({ handleLaunch }) => ( - - - - )} - - - )} - {template.summary_fields.user_capabilities.edit && ( - - - - - - )} - , - ]} - /> - - - ); - } + )} + , + + {toTitleCase(template.type)} + , + + + , + + {canLaunch && template.type === 'job_template' && ( + + + {({ handleLaunch }) => ( + + + + )} + + + )} + {template.summary_fields.user_capabilities.edit && ( + + + + + + )} + , + ]} + /> + + + ); } + export { TemplateListItem as _TemplateListItem }; export default withI18n()(TemplateListItem); diff --git a/awx/ui_next/src/screens/Template/TemplateList/TemplatesListItem.test.jsx b/awx/ui_next/src/screens/Template/TemplateList/TemplatesListItem.test.jsx index b9f3d38dff..8a340f1e62 100644 --- a/awx/ui_next/src/screens/Template/TemplateList/TemplatesListItem.test.jsx +++ b/awx/ui_next/src/screens/Template/TemplateList/TemplatesListItem.test.jsx @@ -142,4 +142,23 @@ describe('', () => { ); expect(wrapper.find('ExclamationTriangleIcon').exists()).toBe(false); }); + test('missing resource icon is not shown type is workflow_job_template', () => { + const wrapper = mountWithContexts( + + ); + expect(wrapper.find('ExclamationTriangleIcon').exists()).toBe(false); + }); });