External-Mirrors/awx
2
0
Fork 0
mirror of https://github.com/ansible/awx.git synced 2026-02-03 10:38:15 -03:30
Code Issues Packages Projects Releases Wiki Activity

Merge pull request #11830 from marshmalien/fix-duplicate-keys-subscription-modal

Browse Source 
Add unique row id to subscription modal list items
This commit is contained in:
Tiago Góes
2022-03-08 11:48:58 -03:00
committed by GitHub
parent 4450b11e61 a65948de69
commit 82d91f8dbd
3 changed files with 21 additions and 21 deletions
Download Patch File Download Diff File Expand all files Collapse all files

32
awx/ui/src/screens/Setting/Subscription/SubscriptionEdit/SubscriptionModal.js
View File

@@ -47,6 +47,15 @@ function SubscriptionModal({
subscriptionCreds.username, subscriptionCreds.username,
subscriptionCreds.password subscriptionCreds.password
); );
// Ensure unique ids for each subscription
// because it is possible to have multiple
// subscriptions with the same pool_id
let repeatId = 1;
data.forEach((i) => {
i.id = repeatId++;
});
return data; return data;
}, []), // eslint-disable-line react-hooks/exhaustive-deps }, []), // eslint-disable-line react-hooks/exhaustive-deps
[] []
@@ -64,17 +73,9 @@ function SubscriptionModal({
fetchSubscriptions(); fetchSubscriptions();
}, [fetchSubscriptions]); }, [fetchSubscriptions]);
const handleSelect = (item) => {
if (selected.some((s) => s.pool_id === item.pool_id)) {
setSelected(selected.filter((s) => s.pool_id !== item.pool_id));
} else {
setSelected(selected.concat(item));
}
};
useEffect(() => { useEffect(() => {
if (selectedSubscription?.pool_id) { if (selectedSubscription?.id) {
handleSelect({ pool_id: selectedSubscription.pool_id }); setSelected([selectedSubscription]);
} }
}, []); // eslint-disable-line react-hooks/exhaustive-deps }, []); // eslint-disable-line react-hooks/exhaustive-deps
@@ -150,19 +151,18 @@ function SubscriptionModal({
<Tbody> <Tbody>
{subscriptions.map((subscription) => ( {subscriptions.map((subscription) => (
<Tr <Tr
key={`row-${subscription.pool_id}`} key={`row-${subscription.id}`}
id={subscription.pool_id} id={`row-${subscription.id}`}
ouiaId={`subscription-row-${subscription.pool_id}`} ouiaId={`subscription-row-${subscription.pool_id}`}
> >
<Td <Td
key={`row-${subscription.pool_id}`}
select={{ select={{
onSelect: () => handleSelect(subscription), onSelect: () => setSelected([subscription]),
isSelected: selected.some( isSelected: selected.some(
(row) => row.pool_id === subscription.pool_id (row) => row.id === subscription.id
), ),
variant: 'radio', variant: 'radio',
rowIndex: `row-${subscription.pool_id}`, rowIndex: `row-${subscription.id}`,
}} }}
/> />
<Td dataLabel={t`Trial`}>{subscription.subscription_name}</Td> <Td dataLabel={t`Trial`}>{subscription.subscription_name}</Td>

8
awx/ui/src/screens/Setting/Subscription/SubscriptionEdit/SubscriptionModal.test.js
View File

@@ -125,14 +125,14 @@ describe('<SubscriptionModal />', () => {
password: '$encrypted', password: '$encrypted',
}} }}
selectedSubscription={{ selectedSubscription={{
pool_id: 8, id: 2,
}} }}
/> />
); );
await waitForElement(wrapper, 'table'); await waitForElement(wrapper, 'table');
expect(wrapper.find('tr[id=7] input').prop('checked')).toBe(false); expect(wrapper.find('tr[id="row-1"] input').prop('checked')).toBe(false);
expect(wrapper.find('tr[id=8] input').prop('checked')).toBe(true); expect(wrapper.find('tr[id="row-2"] input').prop('checked')).toBe(true);
expect(wrapper.find('tr[id=9] input').prop('checked')).toBe(false); expect(wrapper.find('tr[id="row-3"] input').prop('checked')).toBe(false);
}); });
}); });

2
awx/ui/src/screens/Setting/Subscription/SubscriptionEdit/SubscriptionStep.js
View File

@@ -227,7 +227,7 @@ function SubscriptionStep() {
username: username.value, username: username.value,
password: password.value, password: password.value,
}} }}
selectedSubscripion={subscription?.value} selectedSubscription={subscription?.value}
onClose={closeModal} onClose={closeModal}
onConfirm={(value) => subscriptionHelpers.setValue(value)} onConfirm={(value) => subscriptionHelpers.setValue(value)}
/> />