diff --git a/__tests__/pages/Organizations/screens/OrganizationAdd.test.jsx b/__tests__/pages/Organizations/screens/OrganizationAdd.test.jsx
index 9d5079ce70..6a1c919ce3 100644
--- a/__tests__/pages/Organizations/screens/OrganizationAdd.test.jsx
+++ b/__tests__/pages/Organizations/screens/OrganizationAdd.test.jsx
@@ -1,6 +1,6 @@
import React from 'react';
import { mount } from 'enzyme';
-import { MemoryRouter } from 'react-router-dom';
+import { MemoryRouter, Router } from 'react-router-dom';
import { I18nProvider } from '@lingui/react';
import { ConfigContext } from '../../../../src/context';
import OrganizationAdd from '../../../../src/pages/Organizations/screens/OrganizationAdd';
@@ -18,6 +18,7 @@ describe('', () => {
);
});
+
test('calls "onFieldChange" when input values change', () => {
const spy = jest.spyOn(OrganizationAdd.WrappedComponent.prototype, 'onFieldChange');
const wrapper = mount(
@@ -35,6 +36,7 @@ describe('', () => {
wrapper.find('input#add-org-form-description').simulate('change', { target: { value: 'bar' } });
expect(spy).toHaveBeenCalledTimes(2);
});
+
test('calls "onSubmit" when Save button is clicked', () => {
const spy = jest.spyOn(OrganizationAdd.WrappedComponent.prototype, 'onSubmit');
const wrapper = mount(
@@ -51,6 +53,7 @@ describe('', () => {
wrapper.find('button[aria-label="Save"]').prop('onClick')();
expect(spy).toBeCalled();
});
+
test('calls "onCancel" when Cancel button is clicked', () => {
const spy = jest.spyOn(OrganizationAdd.WrappedComponent.prototype, 'onCancel');
const wrapper = mount(
@@ -68,6 +71,25 @@ describe('', () => {
expect(spy).toBeCalled();
});
+ test('calls "onCancel" when close button (x) is clicked', () => {
+ const wrapper = mount(
+
+
+
+
+
+ );
+ const history = wrapper.find(Router).prop('history');
+ expect(history.length).toBe(1);
+ expect(history.location.pathname).toEqual('/organizations/add');
+ wrapper.find('button[aria-label="Close"]').prop('onClick')();
+ expect(history.length).toBe(2);
+ expect(history.location.pathname).toEqual('/organizations');
+ });
+
test('Successful form submission triggers redirect', (done) => {
const onSuccess = jest.spyOn(OrganizationAdd.WrappedComponent.prototype, 'onSuccess');
const mockedResp = { data: { id: 1, related: { instance_groups: '/bar' } } };
diff --git a/src/app.scss b/src/app.scss
index 934240376c..5d984dcbd5 100644
--- a/src/app.scss
+++ b/src/app.scss
@@ -206,6 +206,17 @@
--pf-c-card__body--PaddingTop: 24px;
}
+//
+// pf tooltip overrides
+//
+
+.pf-c-tooltip__content {
+ --pf-c-tooltip__content--PaddingTop: 0.71rem;
+ --pf-c-tooltip__content--PaddingRight: 0.71rem;
+ --pf-c-tooltip__content--PaddingBottom: 0.71rem;
+ --pf-c-tooltip__content--PaddingLeft: 0.71rem;
+}
+
//
// pf empty state overrides
//
@@ -238,3 +249,7 @@
--pf-c-card__body--PaddingX: 0;
--pf-c-card__body--PaddingY: 0;
}
+
+.at-u-textRight {
+ text-align: right;
+}
diff --git a/src/pages/Organizations/screens/OrganizationAdd.jsx b/src/pages/Organizations/screens/OrganizationAdd.jsx
index 05cbd6fb23..9a1f8e6c01 100644
--- a/src/pages/Organizations/screens/OrganizationAdd.jsx
+++ b/src/pages/Organizations/screens/OrganizationAdd.jsx
@@ -10,10 +10,12 @@ import {
TextInput,
Gallery,
Card,
+ CardHeader,
CardBody,
+ Button,
Tooltip,
} from '@patternfly/react-core';
-import { QuestionCircleIcon } from '@patternfly/react-icons';
+import { QuestionCircleIcon, TimesIcon } from '@patternfly/react-icons';
import { ConfigContext } from '../../../context';
import Lookup from '../../../components/Lookup';
@@ -110,11 +112,25 @@ class OrganizationAdd extends React.Component {
return (
-
-
-
-
-
+
+ {error ? error
: ''}
+
+
+
+ )}
+
);
}