Skip to content

Commit

Permalink
Cleanup
Browse files Browse the repository at this point in the history
- Remove peer selection on add and edit instance
- Added conconcial name and order comlums names same on endpoints and
  peers
- Other cleanup items
- rename name to instance name
  • Loading branch information
dmzoneill committed Jan 11, 2024
1 parent 50775f4 commit 81313f7
Show file tree
Hide file tree
Showing 5 changed files with 59 additions and 93 deletions.
Original file line number Diff line number Diff line change
Expand Up @@ -5,7 +5,7 @@ import PaginatedTable, {
getSearchableKeys,
HeaderCell,
HeaderRow,
ToolbarAddButton,
// ToolbarAddButton,
} from 'components/PaginatedTable';
import AddEndpointModal from 'components/AddEndpointModal';
import useToast from 'hooks/useToast';
Expand Down Expand Up @@ -51,8 +51,11 @@ function InstanceEndPointList({ setBreadcrumb }) {

for(let q = 0; q < results.length; q++) {
const receptor = results[q];
if(receptor.managed === true) continue;
if(id.toString() === receptor.instance.toString()) {
receptor.name = detail.hostname;
endpoint_list.push(receptor);
console.log(receptor)
}
}

Expand Down Expand Up @@ -90,13 +93,13 @@ function InstanceEndPointList({ setBreadcrumb }) {
const { selected, isAllSelected, handleSelect, clearSelected, selectAll } =
useSelected(endpoints);

const handleEndpointDelete = async () => {
// console.log(selected)
// InstancesAPI.updateReceptorAddresses(instance.id, values);
}
// const handleEndpointDelete = async () => {
// // console.log(selected)
// // InstancesAPI.updateReceptorAddresses(instance.id, values);
// }

const isHopNode = instance.node_type === 'hop';
const isExecutionNode = instance.node_type === 'execution';
// const isHopNode = instance.node_type === 'hop';
// const isExecutionNode = instance.node_type === 'execution';

return (
<CardBody>
Expand Down Expand Up @@ -130,6 +133,7 @@ function InstanceEndPointList({ setBreadcrumb }) {
<HeaderRow qsConfig={QS_CONFIG} isExpandable>
<HeaderCell sortKey="address">{t`Address`}</HeaderCell>
<HeaderCell sortKey="port">{t`Port`}</HeaderCell>
<HeaderCell sortKey="canonical">{t`Canonical`}</HeaderCell>
</HeaderRow>
}
renderToolbar={(props) => (
Expand All @@ -141,22 +145,22 @@ function InstanceEndPointList({ setBreadcrumb }) {
onExpandAll={expandAll}
qsConfig={QS_CONFIG}
additionalControls={[
(isExecutionNode || isHopNode) && (
<ToolbarAddButton
ouiaId="add-endpoint-button"
key="add-endpoint"
defaultLabel={t`Add`}
onClick={() => setisAddEndpointModalOpen(true)}
/>
),
(isExecutionNode || isHopNode) && (
<ToolbarAddButton
ouiaId="delete-endpoint-button"
key="delete-endpoint"
defaultLabel={t`Delete`}
onClick={() => handleEndpointDelete()}
/>
),
// (isExecutionNode || isHopNode) && (
// <ToolbarAddButton
// ouiaId="add-endpoint-button"
// key="add-endpoint"
// defaultLabel={t`Add`}
// onClick={() => setisAddEndpointModalOpen(true)}
// />
// ),
// (isExecutionNode || isHopNode) && (
// <ToolbarAddButton
// ouiaId="delete-endpoint-button"
// key="delete-endpoint"
// defaultLabel={t`Delete`}
// onClick={() => handleEndpointDelete()}
// />
// ),
]}
/>
)}
Expand All @@ -167,7 +171,7 @@ function InstanceEndPointList({ setBreadcrumb }) {
isExpanded={expanded.some((row) => row.id === endpoint.id)}
onExpand={() => handleExpand(endpoint)}
key={endpoint.id}
peerInstance={endpoint}
peerEndpoint={endpoint}
rowIndex={index}
/>
)}
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -5,18 +5,18 @@ import 'styled-components/macro';
import { Tr, Td } from '@patternfly/react-table';

function InstanceEndPointListItem({
peerInstance,
peerEndpoint,
isSelected,
onSelect,
isExpanded,
onExpand,
rowIndex,
}) {
const labelId = `check-action-${peerInstance.id}`;
const labelId = `check-action-${peerEndpoint.id}`;
return (
<Tr
id={`peerInstance-row-${peerInstance.id}`}
ouiaId={`peerInstance-row-${peerInstance.id}`}
id={`peerEndpoint-row-${peerEndpoint.id}`}
ouiaId={`peerEndpoint-row-${peerEndpoint.id}`}
>
<Td
expand={{
Expand All @@ -36,15 +36,15 @@ function InstanceEndPointListItem({
/>

<Td id={labelId} dataLabel={t`Address`}>
<Link to={`/instances/${peerInstance.instance}/details`}>
<b>{peerInstance.address}</b>
</Link>
{peerEndpoint.address}
</Td>

<Td id={labelId} dataLabel={t`Port`}>
<Link to={`/instances/${peerInstance.instance}/details`}>
<b>{peerInstance.port}</b>
</Link>
{peerEndpoint.port}
</Td>

<Td id={labelId} dataLabel={t`Canonical`}>
{peerEndpoint.canonical.toString()}
</Td>

</Tr>
Expand Down
13 changes: 8 additions & 5 deletions awx/ui/src/screens/Instances/InstancePeers/InstancePeerList.js
Original file line number Diff line number Diff line change
Expand Up @@ -62,6 +62,7 @@ function InstancePeerList({ setBreadcrumb }) {

for(let q = 0; q < results.length; q++) {
const receptor = results[q];
if(receptor.managed === true) continue;
const host = instances.data.results.filter((obj) => obj.id === receptor.instance)[0];
const copy = receptor;
copy.hostname = host.hostname;
Expand Down Expand Up @@ -150,6 +151,7 @@ function InstancePeerList({ setBreadcrumb }) {
const copy = receptor;
copy.hostname = host.hostname;
copy.node_type = host.node_type;
copy.canonical = copy.canonical.toString()
address_list.push(copy);
}

Expand Down Expand Up @@ -250,14 +252,14 @@ function InstancePeerList({ setBreadcrumb }) {
]}
headerRow={
<HeaderRow qsConfig={QS_CONFIG} isExpandable>
<HeaderCell sortKey="address">{t`Address`}</HeaderCell>
<HeaderCell sortKey="port">{t`Port`}</HeaderCell>
<HeaderCell
tooltip={t`Cannot run health check on hop nodes.`}
sortKey="hostname"
>{t`Name`}</HeaderCell>
<HeaderCell sortKey="errors">{t`Status`}</HeaderCell>
>{t`Instance Name`}</HeaderCell>
<HeaderCell sortKey="address">{t`Address`}</HeaderCell>
<HeaderCell sortKey="port">{t`Port`}</HeaderCell>
<HeaderCell sortKey="node_type">{t`Node Type`}</HeaderCell>
<HeaderCell sortKey="canonical">{t`Canonical`}</HeaderCell>
</HeaderRow>
}
renderToolbar={(props) => (
Expand Down Expand Up @@ -312,10 +314,11 @@ function InstancePeerList({ setBreadcrumb }) {
optionsRequest={readInstancesOptions}
displayKey="hostname"
columns={[
{ key: 'hostname', name: t`Name` },
{ key: 'address', name: t`Address` },
{ key: 'port', name: t`Port` },
{ key: 'hostname', name: t`Name` },
{ key: 'node_type', name: t`Node Type` },
{ key: 'canonical', name: t`Canonical` },
]}
/>
)}
Expand Down
38 changes: 11 additions & 27 deletions awx/ui/src/screens/Instances/InstancePeers/InstancePeerListItem.js
Original file line number Diff line number Diff line change
Expand Up @@ -2,10 +2,8 @@ import React from 'react';
import { Link } from 'react-router-dom';
import { t } from '@lingui/macro';
import 'styled-components/macro';
import { Tooltip } from '@patternfly/react-core';
import { Tr, Td, ExpandableRowContent } from '@patternfly/react-table';
import { formatDateString } from 'util/dates';
import StatusLabel from 'components/StatusLabel';
import { Detail, DetailList } from 'components/DetailList';

function InstancePeerListItem({
Expand Down Expand Up @@ -43,41 +41,27 @@ function InstancePeerListItem({
}}
dataLabel={t`Selected`}
/>
<Td id={labelId} dataLabel={t`Address`}>
<Link to={`/instances/${peerInstance.instance}/details`}>
<b>{peerInstance.address}</b>
</Link>
</Td>

<Td id={labelId} dataLabel={t`Port`}>
<Link to={`/instances/${peerInstance.instance}/details`}>
<b>{peerInstance.port}</b>
</Link>
</Td>

<Td id={labelId} dataLabel={t`Name`}>
<Link to={`/instances/${peerInstance.instance}/details`}>
<b>{peerInstance.hostname}</b>
</Link>
</Td>

<Td dataLabel={t`Status`}>
<Tooltip
content={
<div>
{t`Last Health Check`}
&nbsp;
{formatDateString(
peerInstance.last_health_check ?? peerInstance.last_seen
)}
</div>
}
>
<StatusLabel status={peerInstance.node_state} />
</Tooltip>
<Td id={labelId} dataLabel={t`Address`}>
{peerInstance.address}
</Td>

<Td id={labelId} dataLabel={t`Port`}>
{peerInstance.port}
</Td>

<Td dataLabel={t`Node Type`}>{peerInstance.node_type}</Td>

<Td id={labelId} dataLabel={t`Canonical`}>
{peerInstance.canonical.toString()}
</Td>

</Tr>
{!isHopNode && (
<Tr
Expand Down
29 changes: 2 additions & 27 deletions awx/ui/src/screens/Instances/Shared/InstanceForm.js
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
import React, { useCallback } from 'react';
import React from 'react';
import { t } from '@lingui/macro';
import { Formik, useField, useFormikContext } from 'formik';
import { Formik, useField } from 'formik';
import { Form, FormGroup, CardBody } from '@patternfly/react-core';
import { FormColumnLayout } from 'components/FormLayout';
import FormField, {
Expand All @@ -9,7 +9,6 @@ import FormField, {
} from 'components/FormField';
import FormActionGroup from 'components/FormActionGroup';
import AnsibleSelect from 'components/AnsibleSelect';
import { PeersLookup } from 'components/Lookup';
import { required } from 'util/validators';

const INSTANCE_TYPES = [
Expand All @@ -23,16 +22,6 @@ function InstanceFormFields({ isEdit }) {
validate: required(t`Set a value for this field`),
});

const { setFieldValue } = useFormikContext();

const [peersField, peersMeta, peersHelpers] = useField('peers');

const handlePeersUpdate = useCallback(
(value) => {
setFieldValue('peers', value);
},
[setFieldValue]
);
return (
<>
<FormField
Expand Down Expand Up @@ -91,20 +80,6 @@ function InstanceFormFields({ isEdit }) {
isDisabled={isEdit}
/>
</FormGroup>
<PeersLookup
helperTextInvalid={peersMeta.error}
isValid={!peersMeta.touched || !peersMeta.error}
onBlur={() => peersHelpers.setTouched()}
onChange={handlePeersUpdate}
value={peersField.value}
tooltip={t`Select the Peers Instances.`}
fieldName="peers"
formLabel={t`Peers`}
multiple
typePeers
id="peers"
isRequired
/>
<FormGroup fieldId="instance-option-checkboxes" label={t`Options`}>
<CheckboxField
id="enabled"
Expand Down

0 comments on commit 81313f7

Please sign in to comment.