From 1368835a296f9d100f71eb1d0adcc21c72885bd1 Mon Sep 17 00:00:00 2001
From: Alex Corey <alex.swansboro@gmail.com>
Date: Fri, 31 Jan 2020 14:07:24 -0500
Subject: [PATCH 1/2] Fixes update failure on TeamEdit

---
 awx/ui_next/src/screens/Team/Team.jsx         |  2 +-
 .../src/screens/Team/TeamEdit/TeamEdit.jsx    | 81 +++++++------------
 .../screens/Team/TeamEdit/TeamEdit.test.jsx   |  9 ++-
 3 files changed, 35 insertions(+), 57 deletions(-)

diff --git a/awx/ui_next/src/screens/Team/Team.jsx b/awx/ui_next/src/screens/Team/Team.jsx
index d0a385017e..7440bad624 100644
--- a/awx/ui_next/src/screens/Team/Team.jsx
+++ b/awx/ui_next/src/screens/Team/Team.jsx
@@ -37,7 +37,7 @@ function Team({ i18n, setBreadcrumb }) {
         setHasContentLoading(false);
       }
     })();
-  }, [id, setBreadcrumb]);
+  }, [id, setBreadcrumb, location]);
 
   const tabsArray = [
     { name: i18n._(t`Details`), link: `/teams/${id}/details`, id: 0 },
diff --git a/awx/ui_next/src/screens/Team/TeamEdit/TeamEdit.jsx b/awx/ui_next/src/screens/Team/TeamEdit/TeamEdit.jsx
index 40c18376fa..301b919f40 100644
--- a/awx/ui_next/src/screens/Team/TeamEdit/TeamEdit.jsx
+++ b/awx/ui_next/src/screens/Team/TeamEdit/TeamEdit.jsx
@@ -1,6 +1,6 @@
-import React, { Component } from 'react';
+import React, { useState } from 'react';
 import PropTypes from 'prop-types';
-import { withRouter } from 'react-router-dom';
+import { withRouter, useHistory } from 'react-router-dom';
 import { CardBody } from '@components/Card';
 
 import { TeamsAPI } from '@api';
@@ -8,65 +8,38 @@ import { Config } from '@contexts/Config';
 
 import TeamForm from '../shared/TeamForm';
 
-class TeamEdit extends Component {
-  constructor(props) {
-    super(props);
+function TeamEdit({ team }) {
+  const history = useHistory();
+  const [error, setError] = useState(null);
 
-    this.handleSubmit = this.handleSubmit.bind(this);
-    this.handleCancel = this.handleCancel.bind(this);
-    this.handleSuccess = this.handleSuccess.bind(this);
-
-    this.state = {
-      error: '',
-    };
-  }
-
-  async handleSubmit(values) {
-    const { team } = this.props;
+  const handleSubmit = async values => {
     try {
       await TeamsAPI.update(team.id, values);
-      this.handleSuccess();
+      history.push(`/teams/${team.id}/details`);
     } catch (err) {
-      this.setState({ error: err });
+      setError(error);
     }
-  }
+  };
 
-  handleCancel() {
-    const {
-      team: { id },
-      history,
-    } = this.props;
-    history.push(`/teams/${id}/details`);
-  }
+  const handleCancel = () => {
+    history.push(`/teams/${team.id}/details`);
+  };
 
-  handleSuccess() {
-    const {
-      team: { id },
-      history,
-    } = this.props;
-    history.push(`/teams/${id}/details`);
-  }
-
-  render() {
-    const { team } = this.props;
-    const { error } = this.state;
-
-    return (
-      <CardBody>
-        <Config>
-          {({ me }) => (
-            <TeamForm
-              team={team}
-              handleSubmit={this.handleSubmit}
-              handleCancel={this.handleCancel}
-              me={me || {}}
-            />
-          )}
-        </Config>
-        {error ? <div>error</div> : null}
-      </CardBody>
-    );
-  }
+  return (
+    <CardBody>
+      <Config>
+        {({ me }) => (
+          <TeamForm
+            team={team}
+            handleSubmit={handleSubmit}
+            handleCancel={handleCancel}
+            me={me || {}}
+          />
+        )}
+      </Config>
+      {error ? <div>error</div> : null}
+    </CardBody>
+  );
 }
 
 TeamEdit.propTypes = {
diff --git a/awx/ui_next/src/screens/Team/TeamEdit/TeamEdit.test.jsx b/awx/ui_next/src/screens/Team/TeamEdit/TeamEdit.test.jsx
index cb410405b1..529e57ed84 100644
--- a/awx/ui_next/src/screens/Team/TeamEdit/TeamEdit.test.jsx
+++ b/awx/ui_next/src/screens/Team/TeamEdit/TeamEdit.test.jsx
@@ -20,8 +20,12 @@ describe('<TeamEdit />', () => {
     },
   };
 
-  test('handleSubmit should call api update', async () => {
-    const wrapper = mountWithContexts(<TeamEdit team={mockData} />);
+  test('handleSubmit should call api update and then navigate to the details page', async () => {
+    const history = createMemoryHistory({});
+
+    const wrapper = mountWithContexts(<TeamEdit team={mockData} />, {
+      context: { router: { history } },
+    });
 
     const updatedTeamData = {
       name: 'new name',
@@ -32,6 +36,7 @@ describe('<TeamEdit />', () => {
     });
 
     expect(TeamsAPI.update).toHaveBeenCalledWith(1, updatedTeamData);
+    expect(history.location.pathname).toEqual('/teams/1/details');
   });
 
   test('should navigate to team detail when cancel is clicked', async () => {

From 51709482413a7bd7a86500c3f4a93a1c00ce2607 Mon Sep 17 00:00:00 2001
From: Alex Corey <alex.swansboro@gmail.com>
Date: Fri, 31 Jan 2020 15:03:13 -0500
Subject: [PATCH 2/2] Fix error naming issue

---
 awx/ui_next/src/screens/Team/TeamEdit/TeamEdit.jsx | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/awx/ui_next/src/screens/Team/TeamEdit/TeamEdit.jsx b/awx/ui_next/src/screens/Team/TeamEdit/TeamEdit.jsx
index 301b919f40..e11a014018 100644
--- a/awx/ui_next/src/screens/Team/TeamEdit/TeamEdit.jsx
+++ b/awx/ui_next/src/screens/Team/TeamEdit/TeamEdit.jsx
@@ -17,7 +17,7 @@ function TeamEdit({ team }) {
       await TeamsAPI.update(team.id, values);
       history.push(`/teams/${team.id}/details`);
     } catch (err) {
-      setError(error);
+      setError(err);
     }
   };