From d1db08c6d075d4e246019b10f8e437900e48631f Mon Sep 17 00:00:00 2001
From: Michael Dokolin <mikhail.dokolin@elastic.co>
Date: Thu, 22 Jul 2021 22:30:05 +0200
Subject: [PATCH] [Reporting] Fix the delete button in the reporting management
 dashboard (#106016) (#106591)

* Fix the delete button in the reporting management dashboard
* Update delete button copy for consistency
---
 .../public/management/report_delete_button.tsx        |  2 +-
 .../reporting/public/management/report_listing.tsx    | 11 +++++++++--
 2 files changed, 10 insertions(+), 3 deletions(-)

diff --git a/x-pack/plugins/reporting/public/management/report_delete_button.tsx b/x-pack/plugins/reporting/public/management/report_delete_button.tsx
index dfb411fc195e8..250136568bc24 100644
--- a/x-pack/plugins/reporting/public/management/report_delete_button.tsx
+++ b/x-pack/plugins/reporting/public/management/report_delete_button.tsx
@@ -91,7 +91,7 @@ export class ReportDeleteButton extends PureComponent<Props, State> {
           {intl.formatMessage(
             {
               id: 'xpack.reporting.listing.table.deleteReportButton',
-              defaultMessage: `Delete ({num})`,
+              defaultMessage: `Delete {num, plural, one {report} other {reports} }`,
             },
             { num: jobsToDelete.length }
           )}
diff --git a/x-pack/plugins/reporting/public/management/report_listing.tsx b/x-pack/plugins/reporting/public/management/report_listing.tsx
index fffa952be6cb4..3630b5e8fbbc1 100644
--- a/x-pack/plugins/reporting/public/management/report_listing.tsx
+++ b/x-pack/plugins/reporting/public/management/report_listing.tsx
@@ -147,7 +147,7 @@ class ReportListingUi extends Component<Props, State> {
         />
 
         <EuiSpacer size={'l'} />
-        {this.renderTable()}
+        <div>{this.renderTable()}</div>
 
         <EuiSpacer size="s" />
         <EuiFlexGroup justifyContent="spaceBetween" direction="rowReverse">
@@ -499,6 +499,14 @@ class ReportListingUi extends Component<Props, State> {
 
     return (
       <Fragment>
+        {this.state.selectedJobs.length > 0 && (
+          <Fragment>
+            <EuiFlexGroup alignItems="center" justifyContent="flexStart" gutterSize="m">
+              <EuiFlexItem grow={false}>{this.renderDeleteButton()}</EuiFlexItem>
+            </EuiFlexGroup>
+            <EuiSpacer size="l" />
+          </Fragment>
+        )}
         <EuiBasicTable
           tableCaption={i18n.translate('xpack.reporting.listing.table.captionDescription', {
             defaultMessage: 'Reports generated in Kibana applications',
@@ -524,7 +532,6 @@ class ReportListingUi extends Component<Props, State> {
           onChange={this.onTableChange}
           data-test-subj="reportJobListing"
         />
-        {this.state.selectedJobs.length > 0 ? this.renderDeleteButton() : null}
       </Fragment>
     );
   }