react 16 upgrade

Issue-ID: SDC-1762
Change-Id: I7701f12fc63bb09f8c985c7c893b984701dcbfab
Signed-off-by: Einav Keidar <einavw@amdocs.com>

1 files changed, 33 insertions, 12 deletions

diff --git a/openecomp-ui/src/sdc-app/onboarding/licenseModel/entitlementPools/EntitlementPoolsEditorView.jsx b/openecomp-ui/src/sdc-app/onboarding/licenseModel/entitlementPools/EntitlementPoolsEditorView.jsx
index d5ca81cfac..d0e91e382b 100644
--- a/openecomp-ui/src/sdc-app/onboarding/licenseModel/entitlementPools/EntitlementPoolsEditorView.jsx
+++ b/openecomp-ui/src/sdc-app/onboarding/licenseModel/entitlementPools/EntitlementPoolsEditorView.jsx
@@ -46,12 +46,27 @@ const EntitlementPoolPropType = PropTypes.shape({
     name: PropTypes.string,
     description: PropTypes.string,
     thresholdUnits: PropTypes.string,
-    thresholdValue: PropTypes.string,
+    thresholdValue: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
     increments: PropTypes.string,
     startDate: PropTypes.string,
     expiryDate: PropTypes.string
 });
 
+const TabButton = props => {
+    const { onClick, disabled, className } = props;
+    const dataTestId = props['data-test-id'];
+    return (
+        <div
+            className={className}
+            onClick={disabled ? undefined : onClick}
+            data-test-id={dataTestId}
+            role="tab"
+            disabled={disabled}>
+            {props.children}
+        </div>
+    );
+};
+
 class EntitlementPoolsEditorView extends React.Component {
     static propTypes = {
         data: EntitlementPoolPropType,
@@ -95,7 +110,7 @@ class EntitlementPoolsEditorView extends React.Component {
         const isTabsDisabled = !data.id || !this.props.isFormValid;
 
         return (
-            <div>
+            <div className="entitlement-pools-modal license-model-modal">
                 <Tabs
                     type="menu"
                     activeTab={selectedTab}
@@ -191,23 +206,29 @@ class EntitlementPoolsEditorView extends React.Component {
                         )}
                     </Tab>
                     {selectedTab !== tabIds.GENERAL ? (
-                        <Button
+                        <TabButton
+                            tabId={tabIds.ADD_LIMIT_BUTTON}
                             disabled={
-                                this.state.selectedLimit || isReadOnlyMode
+                                !!this.state.selectedLimit || isReadOnlyMode
                             }
-                            className="add-limit-button"
-                            tabId={tabIds.ADD_LIMIT_BUTTON}
-                            btnType="link"
-                            iconName="plus">
-                            {i18n('Add Limit')}
-                        </Button>
+                            data-test-id="add-limits-tab"
+                            className="add-limit-button">
+                            <Button
+                                disabled={
+                                    !!this.state.selectedLimit || isReadOnlyMode
+                                }
+                                btnType="link"
+                                iconName="plus">
+                                {i18n('Add Limit')}
+                            </Button>
+                        </TabButton>
                     ) : (
-                        <div key="empty_ep_tab_key" />
+                        <TabButton key="empty_ep_tab_key" />
                     ) // Render empty div to not break tabs
                     }
                 </Tabs>
                 <ModalButtons
-                    className="entitlement-pools-editor-buttons"
+                    className="sdc-modal__footer"
                     selectedLimit={this.state.selectedLimit}
                     isFormValid={this.props.isFormValid}
                     isReadOnlyMode={isReadOnlyMode}