Remove Arrow functions in render SettingsPage

packages/strapi-plugin-content-manager/admin/src/components/Block/index.js

@@ -9,13 +9,15 @@ import { FormattedMessage } from 'react-intl';
 
 import styles from './styles.scss';
 
+const renderMsg = msg => <p>{msg}</p>;
+
 const Block = ({ children, description, style, title }) => (
   <div className="col-md-12">
     <div className={styles.ctmBlock} style={style}>
       <div className={styles.ctmBlockTitle}>
         <FormattedMessage id={title} />
         <FormattedMessage id={description}>
-          {msg => <p>{msg}</p>}
+          {renderMsg}
         </FormattedMessage>
       </div>
       {children}

packages/strapi-plugin-content-manager/admin/src/components/DraggableAttr/index.js

@@ -97,6 +97,10 @@ class DraggableAttr extends React.Component {
     this.props.onClickEditListItem(this.props.index);
   }
 
+  handleDragEnd = () => this.setState({ dragStart: false });
+
+  handleDragStart = () => this.setState({ dragStart: true });
+
   handleMouseEnter = () => {
     if (!this.props.isDraggingSibling) {
       this.setState({ isOver: true });
@@ -123,8 +127,8 @@ class DraggableAttr extends React.Component {
         connectDropTarget(
           <div
             className={cn(className, isEditing && styles.editingAttr, overClass)}
-            onDragStart={() => this.setState({ dragStart: true })}
-            onDragEnd={() => this.setState({ dragStart: false })}
+            onDragStart={this.handleDragStart}
+            onDragEnd={this.handleDragEnd}
             onMouseEnter={this.handleMouseEnter}
             onMouseLeave={this.handleMouseLeave}
             onClick={this.handleClickEdit}

packages/strapi-plugin-content-manager/admin/src/containers/SettingsPage/index.js

@@ -92,6 +92,11 @@ class SettingsPage extends React.PureComponent {
     this.props.history.push(`${pathname}${destination}`);
   }
 
+  handleConfirmReset = () => {
+    this.props.onReset();
+    this.toggleWarningCancel();
+  }
+
   handleReset = (e) => {
     e.preventDefault();
     this.setState({ showWarningCancel: true });
@@ -106,6 +111,17 @@ class SettingsPage extends React.PureComponent {
 
   toggleWarningCancel = () => this.setState(prevState => ({ showWarningCancel: !prevState.showWarningCancel }));
 
+  renderForm = input => (
+    <Input
+      key={input.name}
+      onChange={this.props.onChange}
+      value={this.getValue(input)}
+      {...input}
+    />
+  );
+
+  renderRow = model => <SettingsRow key={model.name} {...model} onClick={this.handleClick} />;
+
   render() {
     const { showWarning, showWarningCancel } = this.state;
     const { onChange, onReset, onSubmit } = this.props;
@@ -127,9 +143,7 @@ class SettingsPage extends React.PureComponent {
             confirm: 'content-manager.popUpWarning.button.confirm',
           }}
           popUpWarningType="danger"
-          onConfirm={() => {
-            onSubmit();
-          }}
+          onConfirm={onSubmit}
         />
         <PopUpWarning
           isOpen={showWarningCancel}
@@ -141,10 +155,7 @@ class SettingsPage extends React.PureComponent {
             confirm: 'content-manager.popUpWarning.button.confirm',
           }}
           popUpWarningType="danger"
-          onConfirm={() => {
-            onReset();
-            this.toggleWarningCancel();
-          }}
+          onConfirm={this.handleConfirmReset}
         />
         <div className={cn('row', styles.container)}>
           <Block
@@ -155,27 +166,22 @@ class SettingsPage extends React.PureComponent {
               <div className="row">
                 <div className="col-md-10">
                   <div className="row">
-                    {forms.inputs.map(input => (
-                      <Input
-                        key={input.name}
-                        onChange={onChange}
-                        value={this.getValue(input)}
-                        {...input}
-                      />
-                    ))}
+                    {forms.inputs.map(this.renderForm)}
                   </div>
                 </div>
               </div>
             </form>
           </Block>
+          {/* LIST */}
           <Block
             title="content-manager.containers.SettingsPage.Block.contentType.title"
             description="content-manager.containers.SettingsPage.Block.contentType.description"
           >
             <div className={styles.contentTypesWrapper}>
-              {this.getModels().map(model => <SettingsRow key={model.name} {...model} onClick={this.handleClick} />)}
+              {this.getModels().map(this.renderRow)}
             </div>
           </Block>
+          {/* LIST */}
         </div>
       </div>
     );