From 949ec6c7d8fbb5fab4bafe3fc1d45e46311349cb Mon Sep 17 00:00:00 2001
From: Kirill Matrosov <KMatrosov@alfabank.ru>
Date: Mon, 27 Apr 2020 19:38:03 +0300
Subject: [PATCH] refactor(*): remove unsafe (#911)

---
 src/select/select.tsx | 49 +++++++++++++++++++------------------------
 1 file changed, 21 insertions(+), 28 deletions(-)

diff --git a/src/select/select.tsx b/src/select/select.tsx
index fc30b840c9..30ec5031b8 100644
--- a/src/select/select.tsx
+++ b/src/select/select.tsx
@@ -8,7 +8,7 @@ import { DeepReadonly } from 'utility-types';
 import { createCn } from 'bem-react-classname';
 import { withTheme } from '../cn';
 
-import { Button } from '../button/button';
+import { Button } from '../button';
 import IconButton from '../icon-button/icon-button';
 import IconArrowDown from '../icon/ui/arrow-down';
 import IconArrowUp from '../icon/ui/arrow-up';
@@ -16,11 +16,10 @@ import Menu from '../menu/menu';
 import Mq from '../mq/mq';
 import ThemedPopup from '../popup/popup';
 import PopupHeader from '../popup-header/popup-header';
-import { ResizeSensor } from '../resize-sensor/resize-sensor';
+import { ResizeSensor } from '../resize-sensor';
 
 import { HtmlElement } from '../lib/prop-types';
 import keyboardCode from '../lib/keyboard-code';
-import performance from '../performance';
 import scrollTo from '../lib/scroll-to';
 import { SCROLL_TO_CORRECTION, SCROLL_TO_NORMAL_DURATION } from '../vars';
 
@@ -317,8 +316,7 @@ type SelectState = DeepReadonly<{
 /**
  * Компонент выпадающего списка.
  */
-@performance(true)
-export class Select extends React.Component<SelectProps, SelectState> {
+export class Select extends React.PureComponent<SelectProps, SelectState> {
     protected cn = createCn('select');
 
     static defaultProps: Partial<SelectProps> = {
@@ -342,7 +340,7 @@ export class Select extends React.Component<SelectProps, SelectState> {
     };
 
     state: SelectState = {
-        hasGroup: false,
+        hasGroup: this.props.options.some(option => !!(option.type === 'group' && !!option.content)),
         isMobile: false,
         opened: !!this.props.opened,
         popupStyles: {},
@@ -368,13 +366,6 @@ export class Select extends React.Component<SelectProps, SelectState> {
      */
     private awaitClosing = false;
 
-    // eslint-disable-next-line camelcase
-    UNSAFE_componentWillMount() {
-        this.setState({
-            hasGroup: this.props.options.some(option => !!(option.type === 'group' && !!option.content))
-        });
-    }
-
     componentDidMount() {
         if (this.isAutoSelectRequired()) {
             this.selectFirstOption();
@@ -384,24 +375,18 @@ export class Select extends React.Component<SelectProps, SelectState> {
         this.updatePopupStyles();
     }
 
-    // eslint-disable-next-line camelcase
-    UNSAFE_componentWillReceiveProps(nextProps) {
+    componentDidUpdate(prevProps: SelectProps) {
         this.setPopupTarget();
-        this.updatePopupStyles();
-
-        if (this.state.opened && nextProps.disabled) {
-            this.toggleOpened();
-        }
-
-        this.setState({
-            hasGroup: this.props.options.some(option => !!(option.type === 'group' && !!option.content))
-        });
-    }
 
-    componentDidUpdate() {
         if (this.state.opened) {
             this.updatePopupStyles();
+            if (this.props.disabled) {
+                this.toggleOpened();
+            }
         }
+        const hasGroup = prevProps.options.some(option => option.type === 'group' && !!option.content);
+
+        this.updateHasGroup(hasGroup);
     }
 
     render() {
@@ -1037,8 +1022,10 @@ export class Select extends React.Component<SelectProps, SelectState> {
         if (this.props.equalPopupWidth) {
             popupStyles.maxWidth = buttonWidth;
         }
-
-        this.setState({ popupStyles });
+        if (this.state.popupStyles.maxWidth !== popupStyles.maxWidth ||
+            this.state.popupStyles.minWidth !== popupStyles.minWidth) {
+            this.setState({ popupStyles });
+        }
     };
 
     private setPopupTarget = () => {
@@ -1108,6 +1095,12 @@ export class Select extends React.Component<SelectProps, SelectState> {
 
         return firstOption;
     }
+
+    private updateHasGroup(hasGroup: boolean) {
+        if (this.state.hasGroup !== hasGroup) {
+            this.setState({ hasGroup });
+        }
+    }
 }
 
 class ThemedSelect extends Select {}