Update CSS & improve error management

packages/strapi-helper-plugin/lib/internals/eslint/.eslintrc.json

@@ -87,6 +87,7 @@
     "redux-saga/no-yield-in-race": 2,
     "redux-saga/yield-effects": 2,
     "require-yield": 0,
+    "react/forbid-prop-types": 0,
     "react/no-unescaped-entities": 0,
     "react/prefer-stateless-function": 0,
     "react/sort-prop-types": 2,

packages/strapi-helper-plugin/lib/src/components/InputJSON/index.js

@@ -80,7 +80,7 @@ class InputJSON extends React.Component {
     }
   }
 
-  setSize = () => this.codeMirror.setSize('100%', 600);
+  setSize = () => this.codeMirror.setSize('100%', 'auto');
 
   setTheme = (theme) => this.codeMirror.setOption('theme', theme);
 

packages/strapi-helper-plugin/lib/src/components/InputJSON/styles.scss

@@ -4,16 +4,31 @@
   margin-bottom: -14px;
   line-height: 18px;
 
-  div {
-    font-size: 1.3rem !important;
+  >div {
+    border-radius: 3px;
+
+    >div:last-of-type{
+      min-height: 320px;
+      max-height: 635px;
+      font-weight: 500;
+      font-size: 1.3rem !important;
+    }
   }
 }
 
 .select {
+  z-index: 100;
   position: absolute;
   bottom: 0; right: 0;
-  background: white;
+  height: 24px;
+  padding: 0 10px;
+  background: rgba(255, 255, 255, 0.04);
   border-radius: 0 !important;
+  border-top-left-radius: 3px !important;
+  -webkit-appearance: none;
+  text-transform: capitalize;
+  color: #787E8F;
+  
   &:focus, &:active {
     outline: 0;
   }

packages/strapi-helper-plugin/lib/src/components/InputJSONWithErrors/index.js

@@ -68,6 +68,11 @@ class InputJSONWithErrors extends React.Component { // eslint-disable-line react
     }
   }
 
+  handleChange = (e) => {
+    this.setState({ errors: [] });
+    this.props.onChange(e);
+  }
+
   render() {
     const {
       autoFocus,
@@ -87,7 +92,6 @@ class InputJSONWithErrors extends React.Component { // eslint-disable-line react
       name,
       noErrorsDescription,
       onBlur,
-      onChange,
       placeholder,
       resetProps,
       style,
@@ -124,7 +128,7 @@ class InputJSONWithErrors extends React.Component { // eslint-disable-line react
           deactivateErrorHighlight={deactivateErrorHighlight}
           name={name}
           onBlur={handleBlur}
-          onChange={onChange}
+          onChange={this.handleChange}
           placeholder={placeholder}
           resetProps={resetProps}
           style={inputStyle}

packages/strapi-helper-plugin/package.json

@@ -53,15 +53,15 @@
     "cross-env": "^5.0.5",
     "css-loader": "^0.28.5",
     "draft-js": "^0.10.5",
-    "eslint": "^4.4.1",
-    "eslint-config-airbnb": "^15.1.0",
-    "eslint-config-airbnb-base": "^11.3.1",
-    "eslint-config-prettier": "^2.3.0",
-    "eslint-import-resolver-webpack": "^0.8.3",
+    "eslint": "4.4.1",
+    "eslint-config-airbnb": "15.1.0",
+    "eslint-config-airbnb-base": "11.3.1",
+    "eslint-config-prettier": "2.3.0",
+    "eslint-import-resolver-webpack": "0.8.3",
     "eslint-plugin-import": "2.8.0",
-    "eslint-plugin-jsx-a11y": "^6.0.2",
-    "eslint-plugin-react": "^7.2.1",
-    "eslint-plugin-redux-saga": "^0.4.0",
+    "eslint-plugin-jsx-a11y": "6.0.2",
+    "eslint-plugin-react": "7.2.1",
+    "eslint-plugin-redux-saga": "0.4.0",
     "exports-loader": "^0.6.4",
     "express": "^4.15.4",
     "extract-text-webpack-plugin": "^3.0.0",

packages/strapi-lint/lib/internals/eslint/front/.eslintrc.json

@@ -74,6 +74,7 @@
     "no-use-before-define": 0,
     "prefer-template": 2,
     "class-methods-use-this": 0,
+    "react/forbid-prop-types": 0,
     "react/react-in-jsx-scope": 0,
     "react/forbid-prop-types": 0,
     "react/jsx-first-prop-new-line": [