adding reload indices button to index management (#27033)

* adding reload indices button to index management

* addressing PR feedback

x-pack/plugins/index_management/public/sections/index_list/components/index_list/index.js

@@ -4,4 +4,4 @@
  * you may not use this file except in compliance with the Elastic License.
  */
 
-export { IndexList } from './index_list.container';
+export { IndexList } from './index_list';

x-pack/plugins/index_management/public/sections/index_list/components/index_list/index_list.container.js

@@ -1,26 +0,0 @@
-/*
- * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
- * or more contributor license agreements. Licensed under the Elastic License;
- * you may not use this file except in compliance with the Elastic License.
- */
-
-import { connect } from 'react-redux';
-import { IndexList as PresentationComponent } from './index_list';
-
-import {
-  loadIndices,
-  reloadIndices
-} from '../../../../store/actions';
-
-const mapDispatchToProps = (dispatch) => {
-  return {
-    loadIndices: () => {
-      dispatch(loadIndices());
-    },
-    reloadIndices: () => {
-      dispatch(reloadIndices());
-    }
-  };
-};
-
-export const IndexList = connect(null, mapDispatchToProps)(PresentationComponent);

x-pack/plugins/index_management/public/sections/index_list/components/index_list/index_list.js

@@ -10,20 +10,8 @@ import {
   DetailPanel,
   IndexTable,
 } from '../../components';
-import {
-  REFRESH_RATE_INDEX_LIST
-} from '../../../../constants';
 
 export class IndexList extends React.PureComponent {
-  componentDidMount() {
-    this.props.loadIndices();
-    this.interval = setInterval(this.props.reloadIndices, REFRESH_RATE_INDEX_LIST);
-  }
-
-  componentWillUnmount() {
-    clearInterval(this.interval);
-  }
-
   render() {
     const {
       match: {

x-pack/plugins/index_management/public/sections/index_list/components/index_table/index_table.container.js

@@ -24,6 +24,8 @@ import {
   pageSizeChanged,
   sortChanged,
   showSystemIndicesChanged,
+  loadIndices,
+  reloadIndices
 } from '../../../../store/actions';
 
 import { IndexTable as PresentationComponent } from './index_table';
@@ -64,6 +66,12 @@ const mapDispatchToProps = (dispatch) => {
     },
     closeDetailPanel: () => {
       dispatch(closeDetailPanel());
+    },
+    loadIndices: () => {
+      dispatch(loadIndices());
+    },
+    reloadIndices: () => {
+      dispatch(reloadIndices());
     }
   };
 };

x-pack/plugins/index_management/public/sections/index_list/components/index_table/index_table.js

@@ -10,10 +10,14 @@ import { FormattedMessage, injectI18n } from '@kbn/i18n/react';
 import { Route } from 'react-router-dom';
 import { NoMatch } from '../../../no_match';
 import { healthToColor } from '../../../../services';
+import { toastNotifications } from 'ui/notify';
 
 import '../../../../styles/table.less';
-
 import {
+  REFRESH_RATE_INDEX_LIST
+} from '../../../../constants';
+import {
+  EuiButton,
   EuiCallOut,
   EuiHealth,
   EuiLink,
@@ -93,6 +97,8 @@ export class IndexTableUi extends Component {
     };
   }
   componentDidMount() {
+    this.props.loadIndices();
+    this.interval = setInterval(this.props.reloadIndices, REFRESH_RATE_INDEX_LIST);
     const {
       filterChanged,
       filterFromURI
@@ -102,6 +108,9 @@ export class IndexTableUi extends Component {
       filterChanged(EuiSearchBar.Query.parse(decodedFilter));
     }
   }
+  componentWillUnmount() {
+    clearInterval(this.interval);
+  }
   onSort = column => {
     const { sortField, isSortAscending, sortChanged } = this.props;
 
@@ -326,6 +335,7 @@ export class IndexTableUi extends Component {
       showSystemIndicesChanged,
       indices,
       intl,
+      loadIndices,
     } = this.props;
     const { selectedIndicesMap } = this.state;
     const atLeastOneItemSelected = Object.keys(selectedIndicesMap).length > 0;
@@ -406,6 +416,24 @@ export class IndexTableUi extends Component {
                   onChange={this.onFilterChanged}
                 />
               </EuiFlexItem>
+              <EuiFlexItem grow={false}>
+                <EuiButton
+                  color="secondary"
+                  onClick={() => {
+                    loadIndices();
+                    toastNotifications.addSuccess(intl.formatMessage({
+                      id: 'xpack.idxMgmt.indexTable.reloadingIndicesMessage',
+                      defaultMessage: 'Reloading indices'
+                    }));
+                  }}
+                  iconType="refresh"
+                >
+                  <FormattedMessage
+                    id="xpack.idxMgmt.indexTable.reloadIndicesButton"
+                    defaultMessage="Reload indices"
+                  />
+                </EuiButton>
+              </EuiFlexItem>
             </EuiFlexGroup>
             {this.renderFilterError()}
             <EuiSpacer size="m" />