[BA-124] Move edit suite button inside the suite page.

Author: stabarez

src/components/TestSuites/TestSuiteRow.js

@@ -5,20 +5,16 @@ import format from 'date-fns/format'
 
 import StatusBadge from 'components/StatusBadge'
 import routes from 'constants/routesPaths'
-import Anchor from 'components/Anchor'
 import TestSuiteRowWrapper from './TestSuiteRowWrapper'
 
 const TestSuiteRow = ({
   id,
   name,
-  url,
-  description,
   production,
   tests,
   lastSuiteExecution,
   match
 }) => {
-  const { repositoryName, repositoryOwner, repositoryRef } = match.params
   const testsCount = tests.length
 
   return (
@@ -41,25 +37,6 @@ const TestSuiteRow = ({
           </p>
         )}
         {production && <p>Only for production</p>}
-        <Link
-          to={{
-            pathname: routes.editTestSuite({
-              repositoryName,
-              repositoryOwner,
-              repositoryRef,
-              id
-            }),
-            state: {
-              name,
-              url,
-              description,
-              production,
-              tests
-            }
-          }}
-        >
-          <Anchor className="mc-mt-2">EDIT</Anchor>
-        </Link>
       </div>
     </TestSuiteRowWrapper>
   )
@@ -68,9 +45,7 @@ const TestSuiteRow = ({
 TestSuiteRow.propTypes = {
   id: PropTypes.string.isRequired,
   name: PropTypes.string.isRequired,
-  url: PropTypes.string.isRequired,
   production: PropTypes.bool,
-  description: PropTypes.string.isRequired,
   tests: PropTypes.array.isRequired,
   lastSuiteExecution: PropTypes.object,
   match: PropTypes.object

src/containers/SuitePage/SuitePage.js

@@ -1,9 +1,13 @@
 import React, { useState, useEffect, Fragment } from 'react'
 import PropTypes from 'prop-types'
 import { Separator, Button } from 'mc-components'
+import { Link } from 'react-router-dom'
 
 import api from 'api'
+import routes from 'constants/routesPaths'
 import Header from 'components/Header'
+import Anchor from 'components/Anchor'
+import Flex from 'components/Flex'
 import Environment from 'components/Environment'
 import StatusBadge from 'components/StatusBadge'
 import Spinner from 'components/Spinner'
@@ -76,12 +80,33 @@ const SuitePage = ({
         {suite && suite.tests && (
           <Fragment>
             <div>
-              <div>
+              <Flex alignItems="center">
                 <h5 className="d-inline mc-text-h5 mc-mr-2">{suite.name}</h5>
-                {suite.lastSuiteExecution && (
-                  <StatusBadge status={suite.lastSuiteExecution.status} />
-                )}
-              </div>
+                <div className="mc-mr-2">
+                  {suite.lastSuiteExecution && (
+                    <StatusBadge status={suite.lastSuiteExecution.status} />
+                  )}
+                </div>
+                <Link
+                  to={{
+                    pathname: routes.editTestSuite({
+                      repositoryName,
+                      repositoryOwner,
+                      repositoryRef,
+                      id: suite.id
+                    }),
+                    state: {
+                      name: suite.name,
+                      url: suite.url,
+                      description: suite.description,
+                      production: suite.production,
+                      tests: suite.tests
+                    }
+                  }}
+                >
+                  <Anchor>Edit</Anchor>
+                </Link>
+              </Flex>
               <p>{suite.description}</p>
               <p className="mc-text--hinted">
                 Default URL:{' '}