[SIEM] Fix state issues to avoid potential React update issues (#37261) (#37272)

## Summary

Fixed prevState issues with React setState
  * This will avoid subtle bugs with the react update renderer
  * Enabled one lint rule from warn to error
  * Turned off the other linter issue as it has an open ticket against it.
  * https://github.com/elastic/ingest-dev/issues/468

Summarize your PR. If it involves visual changes include a screenshot or gif.

### Checklist

Use ~~strikethroughs~~ to remove checklist items you don't feel are applicable to this PR.

~~- [ ] This was checked for cross-browser compatibility, [including a check against IE11](https://github.com/elastic/kibana/blob/master/CONTRIBUTING.md#cross-browser-compatibility)~~
~~- [ ] Any text added follows [EUI's writing guidelines](https://elastic.github.io/eui/#/guidelines/writing), uses sentence case text and includes [i18n support](https://github.com/elastic/kibana/blob/master/packages/kbn-i18n/README.md)~~
~~- [ ] [Documentation](https://github.com/elastic/kibana/blob/master/CONTRIBUTING.md#writing-documentation) was added for features that require explanation or tutorials~~
~~- [ ] [Unit or functional tests](https://github.com/elastic/kibana/blob/master/CONTRIBUTING.md#cross-browser-compatibility) were updated or added to match the most common scenarios~~
~~- [ ] This was checked for [keyboard-only and screenreader accessibility](https://developer.mozilla.org/en-US/docs/Learn/Tools_and_testing/Cross_browser_testing/Accessibility#Accessibility_testing_checklist)~~

### For maintainers

~~- [ ] This was checked for breaking API changes and was [labeled appropriately](https://github.com/elastic/kibana/blob/master/CONTRIBUTING.md#release-notes-process)~~
~~- [ ] This includes a feature addition or change that requires a release note and was [labeled appropriately](https://github.com/elastic/kibana/blob/master/CONTRIBUTING.md#release-notes-process)~~

.eslintrc.js

@@ -535,17 +535,15 @@ module.exports = {
         'react/boolean-prop-naming': 'error',
         'react/button-has-type': 'error',
         'react/forbid-dom-props': 'error',
-        // This will go from warn to error when this is fixed:
-        // https://github.com/elastic/ingest-dev/issues/468
-        'react/no-access-state-in-setstate': 'warn',
+        'react/no-access-state-in-setstate': 'error',
         // This style will be turned on after most bugs are fixed
         // 'react/no-children-prop': 'warn',
         'react/no-danger-with-children': 'error',
         'react/no-deprecated': 'error',
         'react/no-did-mount-set-state': 'error',
-        // This will go from warn to error when this is fixed:
-        // https://github.com/elastic/ingest-dev/issues/468
-        'react/no-did-update-set-state': 'warn',
+        // Re-enable once we have better options per this issue:
+        // https://github.com/airbnb/javascript/issues/1875
+        // 'react/no-did-update-set-state': 'error',
         'react/no-direct-mutation-state': 'error',
         'react/no-find-dom-node': 'error',
         'react/no-redundant-should-component-update': 'error',

x-pack/plugins/siem/public/components/load_more_table/index.tsx

@@ -282,17 +282,17 @@ export class LoadMoreTable<T, U, V, W, X, Y, Z, AA, AB> extends React.PureCompon
   }
 
   private onButtonClick = () => {
-    this.setState({
-      ...this.state,
-      isPopoverOpen: !this.state.isPopoverOpen,
-    });
+    this.setState(prevState => ({
+      ...prevState,
+      isPopoverOpen: !prevState.isPopoverOpen,
+    }));
   };
 
   private closePopover = () => {
-    this.setState({
-      ...this.state,
+    this.setState(prevState => ({
+      ...prevState,
       isPopoverOpen: false,
-    });
+    }));
   };
 }
 

x-pack/plugins/siem/public/components/navigation/tab_navigation/index.tsx

@@ -67,10 +67,10 @@ export class TabNavigation extends React.PureComponent<TabNavigationProps, TabNa
     const selectedTabId = this.mapLocationToTab(pathname);
 
     if (this.state.selectedTabId !== selectedTabId) {
-      this.setState({
-        ...this.state,
+      this.setState(prevState => ({
+        ...prevState,
         selectedTabId,
-      });
+      }));
     }
   }
   public render() {
@@ -86,10 +86,10 @@ export class TabNavigation extends React.PureComponent<TabNavigationProps, TabNa
     }, '');
 
   private handleTabClick = (href: string, id: string) => {
-    this.setState({
-      ...this.state,
+    this.setState(prevState => ({
+      ...prevState,
       selectedTabId: id,
-    });
+    }));
     track(`tab_${id}`);
     window.location.assign(href);
   };

x-pack/plugins/siem/public/components/timeline/footer/index.tsx

@@ -159,18 +159,18 @@ export class Footer extends React.PureComponent<FooterProps, FooterState> {
     const { paginationLoading, updatedAt } = this.state;
     const { isLoading, getUpdatedAt } = this.props;
     if (paginationLoading && prevProps.isLoading && !isLoading) {
-      this.setState({
-        ...this.state,
+      this.setState(prevState => ({
+        ...prevState,
         paginationLoading: false,
         updatedAt: getUpdatedAt(),
-      });
+      }));
     }
 
     if (updatedAt === null || (prevProps.isLoading && !isLoading)) {
-      this.setState({
-        ...this.state,
+      this.setState(prevState => ({
+        ...prevState,
         updatedAt: getUpdatedAt(),
-      });
+      }));
     }
   }
 
@@ -298,24 +298,24 @@ export class Footer extends React.PureComponent<FooterProps, FooterState> {
   }
 
   private loadMore = () => {
-    this.setState({
-      ...this.state,
+    this.setState(prevState => ({
+      ...prevState,
       paginationLoading: true,
-    });
+    }));
     this.props.onLoadMore(this.props.nextCursor, this.props.tieBreaker);
   };
 
   private onButtonClick = () => {
-    this.setState({
-      ...this.state,
-      isPopoverOpen: !this.state.isPopoverOpen,
-    });
+    this.setState(prevState => ({
+      ...prevState,
+      isPopoverOpen: !prevState.isPopoverOpen,
+    }));
   };
 
   private closePopover = () => {
-    this.setState({
-      ...this.state,
+    this.setState(prevState => ({
+      ...prevState,
       isPopoverOpen: false,
-    });
+    }));
   };
 }

x-pack/plugins/siem/public/components/timeline/properties/index.tsx

@@ -109,9 +109,9 @@ export class Properties extends React.PureComponent<Props, State> {
   }
 
   public onButtonClick = () => {
-    this.setState({
-      showActions: !this.state.showActions,
-    });
+    this.setState(prevState => ({
+      showActions: !prevState.showActions,
+    }));
   };
 
   public onToggleShowNotes = () => {

x-pack/plugins/siem/public/lib/clipboard/clipboard.tsx

@@ -82,9 +82,9 @@ export class Clipboard extends React.PureComponent<Props, State> {
     }
 
     if (isSuccess) {
-      this.setState({
-        toasts: [...this.state.toasts, getSuccessToast({ titleSummary })],
-      });
+      this.setState(prevState => ({
+        toasts: [...prevState.toasts, getSuccessToast({ titleSummary })],
+      }));
     }
   };