Clean LimitSelect component

packages/strapi-plugin-content-manager/public/app/components/LimitSelect/index.js

@@ -5,10 +5,16 @@
  */
 
 import React from 'react';
+import _ from 'lodash';
 
 import styles from './styles.scss';
 
 class LimitSelect extends React.Component { // eslint-disable-line react/prefer-stateless-function
+  componentWillMount() {
+    const id = _.uniqueId();
+    this.setState({ id });
+  }
+
   getOptionsValues() {
     return [{
       value: 10,
@@ -30,16 +36,20 @@ class LimitSelect extends React.Component { // eslint-disable-line react/prefer-
   }
 
   render() {
+    // Generate options
     const options = this.getOptionsValues().map((optionValue) => (
       <option value={optionValue.value} key={optionValue.value}>{optionValue.label}</option>
     ));
 
+    // Get id in order to link the `label` and the `select` elements
+    const id = this.state.id;
+
     return (
       <form className="form-inline">
         <div className="form-group">
-          <label className={styles.label} for="sel1">Items per page:</label>
+          <label className={styles.label} htmlFor={id}>Items per page:</label>
           <div className={styles.selectWrapper}>
-            <select onChange={this.props.onLimitChange} className={`form-control ${styles.select}`} id="sel1">
+            <select onChange={this.props.onLimitChange} className={`form-control ${styles.select}`} id={id}>
               {options}
             </select>
           </div>