From 178d519f6e4b44aa86d96ba22dfadaf0e0d1248e Mon Sep 17 00:00:00 2001
From: Alex Corey <alex.swansboro@gmail.com>
Date: Fri, 12 Apr 2019 10:44:24 -0400
Subject: [PATCH] Remove unwanted committed file

---
 .../Organization/Organization.test.jsx        |  48 +++++++-
 src/app.scss                                  |  19 ++++
 .../screens/Organization/Organization.jsx     | 106 +++++++++++++-----
 3 files changed, 141 insertions(+), 32 deletions(-)

diff --git a/__tests__/pages/Organizations/screens/Organization/Organization.test.jsx b/__tests__/pages/Organizations/screens/Organization/Organization.test.jsx
index ac147e2631..b57c95d6f4 100644
--- a/__tests__/pages/Organizations/screens/Organization/Organization.test.jsx
+++ b/__tests__/pages/Organizations/screens/Organization/Organization.test.jsx
@@ -1,20 +1,64 @@
 import React from 'react';
 import { mount } from 'enzyme';
+<<<<<<< HEAD
+import { MemoryRouter } from 'react-router-dom';	import { MemoryRouter } from 'react-router-dom';
+import { I18nProvider } from '@lingui/react';	import { I18nProvider } from '@lingui/react';
+import Organization from '../../../../../src/pages/Organizations/screens/Organization/Organization';	import Organization, { _Organization } from '../../../../../src/pages/Organizations/screens/Organization/Organization';
+
+=======
 import { MemoryRouter } from 'react-router-dom';
 import { I18nProvider } from '@lingui/react';
-import Organization from '../../../../../src/pages/Organizations/screens/Organization/Organization';
+import Organization, { _Organization } from '../../../../../src/pages/Organizations/screens/Organization/Organization';
+>>>>>>> addresses PR issues
 
 describe('<OrganizationView />', () => {
   test('initially renders succesfully', () => {
+    const spy = jest.spyOn(_Organization.prototype, 'checkLocation');
     mount(
       <I18nProvider>
         <MemoryRouter initialEntries={['/organizations/1']} initialIndex={0}>
-          <Organization
+          <_Organization
             match={{ path: '/organizations/:id', url: '/organizations/1' }}
             location={{ search: '', pathname: '/organizations/1' }}
           />
         </MemoryRouter>
       </I18nProvider>
     );
+    expect(spy).toHaveBeenCalled();
+  });
+
+  test('handleTabSelect renders the correct tab', async () => {
+    const currentTab = 'organizations/19/access';
+    const spy = jest.spyOn(_Organization.prototype, 'handleTabSelect');
+    const wrapper = mount(
+      <I18nProvider>
+        <MemoryRouter initialEntries={['/organizations/1']} initialIndex={0}>
+          <Organization location={currentTab} />
+        </MemoryRouter>
+      </I18nProvider>
+    ).find('Organization');
+    wrapper.find('button').at(2).simulate('click');
+    setImmediate(async () => {
+      wrapper.setState({ activeTabKey: 1 });
+    });
+    wrapper.update();
+    expect(spy).toBeCalled();
+    expect(wrapper.state('activeTabKey')).toBe(1);
+  });
+
+  test('checkLocation renders proper state when new tab is selected', async () => {
+    const currentTab = 'organizations/19/access';
+    const wrapper = mount(
+      <I18nProvider>
+        <MemoryRouter initialEntries={['/organizations/1']} initialIndex={0}>
+          <Organization location={currentTab} />
+        </MemoryRouter>
+      </I18nProvider>
+    ).find('Organization');
+    setImmediate(async () => {
+      wrapper.setState({ activeTabKey: 1 });
+    });
+    wrapper.find('button').at(3).simulate('click');
+    expect(wrapper.state('activeTabKey')).toBe(2);
   });
 });
diff --git a/src/app.scss b/src/app.scss
index 20df8aa24b..2f83a57641 100644
--- a/src/app.scss
+++ b/src/app.scss
@@ -283,6 +283,25 @@
   margin-bottom: 10px;
 }
 
+.orgListAlert-actionBtn{
+  margin:0 10px;
+}
+
+.orgListDetete-progressBar{
+  padding-right: 32px;
+}
+
+.orgListDelete-progressBar-noShow{
+  display: none;
+  padding-right: 32px;
+}
+
+.OrgsTab-closeButton {
+  color: black;
+  float:right;
+  position: relative;
+  top: -60px;
+}
 .awx-c-form-action-group {
   float: right;
   display: block;
diff --git a/src/pages/Organizations/screens/Organization/Organization.jsx b/src/pages/Organizations/screens/Organization/Organization.jsx
index 2ba53ece98..b4887548ab 100644
--- a/src/pages/Organizations/screens/Organization/Organization.jsx
+++ b/src/pages/Organizations/screens/Organization/Organization.jsx
@@ -5,20 +5,21 @@ import {
   Switch,
   Route,
   withRouter,
-  Redirect
+  Redirect,
+  Link
 } from 'react-router-dom';
 import {
   Card,
   CardHeader,
-  PageSection
+  PageSection,
+  Tab,
+  Tabs
 } from '@patternfly/react-core';
-
+import {
+  TimesIcon
+} from '@patternfly/react-icons';
 import { withNetwork } from '../../../../contexts/Network';
-
-import Tabs from '../../../../components/Tabs/Tabs';
-import Tab from '../../../../components/Tabs/Tab';
 import NotifyAndRedirect from '../../../../components/NotifyAndRedirect';
-
 import OrganizationAccess from './OrganizationAccess';
 import OrganizationDetail from './OrganizationDetail';
 import OrganizationEdit from './OrganizationEdit';
@@ -33,9 +34,17 @@ class Organization extends Component {
       organization: null,
       error: false,
       loading: true,
+      tabElements: [
+        { name: i18nMark('Details'), link: `${props.match.url}/details`, id: 0 },
+        { name: i18nMark('Access'), link: `${props.match.url}/access`, id: 1 },
+        { name: i18nMark('Teams'), link: `${props.match.url}/teams`, id: 2 },
+        { name: i18nMark('Notifications'), link: `${props.match.url}/notifications`, id: 3 },
+      ],
     };
 
     this.fetchOrganization = this.fetchOrganization.bind(this);
+    this.handleTabSelect = this.handleTabSelect.bind(this);
+    this.checkLocation = this.checkLocation.bind(this);
   }
 
   componentDidMount () {
@@ -62,48 +71,80 @@ class Organization extends Component {
       setBreadcrumb(data);
       this.setState({ organization: data, loading: false });
     } catch (error) {
+<<<<<<< HEAD
       handleHttpError(error) || this.setState({ error: true, loading: false });
+=======
+      this.setState({ error: true });
+    } finally {
+      this.setState({ loading: false });
+      this.checkLocation();
+>>>>>>> addresses PR issues
     }
   }
 
+  checkLocation () {
+    const { location } = this.props;
+    const { tabElements } = this.state;
+    const activeTab = tabElements.filter(tabElement => tabElement.link === location.pathname);
+    this.setState({ activeTabKey: activeTab[0].id });
+  }
+
+  handleTabSelect (event, eventKey) {
+    const { history } = this.props;
+    const { tabElements } = this.state;
+
+    const tab = tabElements.find(tabElement => tabElement.id === eventKey);
+    history.push(tab.link);
+    const activeTab = tabElements.filter(selectedTab => selectedTab.link === tab.link)
+      .map(selectedTab => selectedTab.id);
+    this.setState({ activeTabKey: activeTab[0] });
+  }
+
   render () {
     const {
       location,
       match,
       history
     } = this.props;
-
     const {
+      activeTabKey,
       organization,
       error,
-      loading
+      loading,
+      tabElements
     } = this.state;
 
-    const tabElements = [
-      { name: i18nMark('Details'), link: `${match.url}/details` },
-      { name: i18nMark('Access'), link: `${match.url}/access` },
-      { name: i18nMark('Teams'), link: `${match.url}/teams` },
-      { name: i18nMark('Notifications'), link: `${match.url}/notifications` },
-    ];
-
     let cardHeader = (
       <CardHeader>
         <I18n>
           {({ i18n }) => (
-            <Tabs
-              labelText={i18n._(t`Organization detail tabs`)}
-              closeButton={{ link: '/organizations', text: i18nMark('Close') }}
-            >
-              {tabElements.map(tabElement => (
-                <Tab
-                  key={tabElement.name}
-                  link={tabElement.link}
-                  replace
-                >
-                  {tabElement.name}
-                </Tab>
-              ))}
-            </Tabs>
+            <>
+              <Tabs
+                labeltext={i18n._(t`Organization detail tabs`)}
+                activeKey={activeTabKey}
+                onSelect={(event, eventKey) => {
+                  this.handleTabSelect(event, eventKey);
+                }}
+              >
+                {tabElements.map(tabElement => (
+                  <Tab
+                    className={`${tabElement.name}`}
+                    aria-label={`${tabElement.name}`}
+                    eventKey={tabElement.id}
+                    key={tabElement.id}
+                    link={tabElement.link}
+                    title={tabElement.name}
+                  />
+                ))}
+              </Tabs>
+              <Link
+                aria-label="Close"
+                title="Close"
+                to="/organizations"
+              >
+                <TimesIcon className="OrgsTab-closeButton" />
+              </Link>
+            </>
           )}
         </I18n>
       </CardHeader>
@@ -185,5 +226,10 @@ class Organization extends Component {
     );
   }
 }
+<<<<<<< HEAD
 
 export default withNetwork(withRouter(Organization));
+=======
+export { Organization as _Organization };
+export default withRouter(Organization);
+>>>>>>> addresses PR issues