From 1d4a193f7eb0b0ac79aa3ae6e3cf36408ab39d54 Mon Sep 17 00:00:00 2001
From: Johann Pinson <johann.pinson@gmail.com>
Date: Tue, 19 Jun 2018 11:13:32 +0200
Subject: [PATCH 01/65] feat(graphql): add DateTime support instead of String

---
 packages/strapi-plugin-graphql/package.json        |  3 ++-
 packages/strapi-plugin-graphql/services/GraphQL.js | 13 +++++++++----
 2 files changed, 11 insertions(+), 5 deletions(-)

diff --git a/packages/strapi-plugin-graphql/package.json b/packages/strapi-plugin-graphql/package.json
index b048fa98e2..c8e35cade1 100644
--- a/packages/strapi-plugin-graphql/package.json
+++ b/packages/strapi-plugin-graphql/package.json
@@ -27,7 +27,8 @@
     "graphql-depth-limit": "^1.1.0",
     "graphql-playground-middleware-koa": "^1.6.1",
     "graphql-tools": "^2.23.1",
-    "graphql-type-json": "^0.2.0",
+    "graphql-type-json": "^0.2.1",
+    "graphql-type-datetime": "^0.2.1",
     "pluralize": "^7.0.0",
     "strapi-utils": "3.0.0-alpha.12.4"
   },
diff --git a/packages/strapi-plugin-graphql/services/GraphQL.js b/packages/strapi-plugin-graphql/services/GraphQL.js
index 0e43ea9674..c345637d1e 100644
--- a/packages/strapi-plugin-graphql/services/GraphQL.js
+++ b/packages/strapi-plugin-graphql/services/GraphQL.js
@@ -14,6 +14,7 @@ const pluralize = require('pluralize');
 const graphql = require('graphql');
 const { makeExecutableSchema } = require('graphql-tools');
 const GraphQLJSON = require('graphql-type-json');
+const GraphQLDateTime = require('graphql-type-datetime');
 const policyUtils = require('strapi-utils').policy;
 
 module.exports = {
@@ -170,6 +171,9 @@ module.exports = {
         case 'float':
           type = 'Float';
           break;
+        case 'date':
+          type = 'DateTime';
+          break;
         case 'enumeration':
           type = this.convertEnumType(definition, modelName, attributeName);
           break;
@@ -453,8 +457,8 @@ module.exports = {
       // Add timestamps attributes.
       if (_.get(model, 'options.timestamps') === true) {
         Object.assign(initialState, {
-          createdAt: 'String!',
-          updatedAt: 'String!'
+          createdAt: 'DateTime!',
+          updatedAt: 'DateTime!'
         });
 
         Object.assign(acc.resolver[globalId], {
@@ -777,10 +781,11 @@ module.exports = {
 
   addCustomScalar: (resolvers) => {
     Object.assign(resolvers, {
-      JSON: GraphQLJSON
+      JSON: GraphQLJSON,
+      DateTime: GraphQLDateTime,
     });
 
-    return 'scalar JSON';
+    return 'scalar JSON \n scalar DateTime';
   },
 
   /**

From 34aef5bbc6e82c3a8251ebd47b3e4a9e0fa930a2 Mon Sep 17 00:00:00 2001
From: Johann Pinson <johann.pinson@gmail.com>
Date: Wed, 20 Jun 2018 10:09:34 +0200
Subject: [PATCH 02/65] fix(datetime): update npm dependencies

---
 packages/strapi-plugin-graphql/package.json | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/packages/strapi-plugin-graphql/package.json b/packages/strapi-plugin-graphql/package.json
index c8e35cade1..91e065a726 100644
--- a/packages/strapi-plugin-graphql/package.json
+++ b/packages/strapi-plugin-graphql/package.json
@@ -28,7 +28,7 @@
     "graphql-playground-middleware-koa": "^1.6.1",
     "graphql-tools": "^2.23.1",
     "graphql-type-json": "^0.2.1",
-    "graphql-type-datetime": "^0.2.1",
+    "graphql-type-datetime": "^0.2.2",
     "pluralize": "^7.0.0",
     "strapi-utils": "3.0.0-alpha.12.4"
   },

From 6bbc5c899333c8d16f7de3e1afbabbc9f840f31c Mon Sep 17 00:00:00 2001
From: Johann Pinson <johann.pinson@gmail.com>
Date: Wed, 20 Jun 2018 19:08:58 +0200
Subject: [PATCH 03/65] fix(datetime): add `datetime` and `timestamp` detection

---
 packages/strapi-plugin-graphql/services/GraphQL.js | 2 ++
 1 file changed, 2 insertions(+)

diff --git a/packages/strapi-plugin-graphql/services/GraphQL.js b/packages/strapi-plugin-graphql/services/GraphQL.js
index c345637d1e..e240236ec9 100644
--- a/packages/strapi-plugin-graphql/services/GraphQL.js
+++ b/packages/strapi-plugin-graphql/services/GraphQL.js
@@ -172,6 +172,8 @@ module.exports = {
           type = 'Float';
           break;
         case 'date':
+        case 'datetime':
+        case 'timestamp':
           type = 'DateTime';
           break;
         case 'enumeration':

From 039d9e5856e9e03607fd88c8a6f35fccdef0514a Mon Sep 17 00:00:00 2001
From: cyril lopez <cyril.lpz@gmail.com>
Date: Wed, 27 Jun 2018 19:00:19 +0200
Subject: [PATCH 04/65] Front-end config in core-store

---
 .../config/functions/bootstrap.js             | 140 ++++++++++++++++++
 .../config/layout.json                        |  13 +-
 .../models/Permission.settings.json           |   1 -
 3 files changed, 152 insertions(+), 2 deletions(-)
 create mode 100644 packages/strapi-plugin-content-manager/config/functions/bootstrap.js

diff --git a/packages/strapi-plugin-content-manager/config/functions/bootstrap.js b/packages/strapi-plugin-content-manager/config/functions/bootstrap.js
new file mode 100644
index 0000000000..37c11afd5f
--- /dev/null
+++ b/packages/strapi-plugin-content-manager/config/functions/bootstrap.js
@@ -0,0 +1,140 @@
+const _ = require('lodash');
+const pluralize = require('pluralize');
+
+module.exports = async cb => {
+  const pickData = (model) => _.pick(model, [
+    'info',
+    'connection',
+    'collectionName',
+    'attributes',
+    'identity',
+    'globalId',
+    'globalName',
+    'orm',
+    'loadedModel',
+    'primaryKey',
+    'associations'
+  ]);
+  
+  const models = _.mapValues(strapi.models, pickData);
+  delete models['core_store'];
+  const pluginsModel = Object.keys(strapi.plugins).reduce((acc, current) => {
+    acc[current] = {
+      models: _.mapValues(strapi.plugins[current].models, pickData),
+    };
+  
+    return acc;
+  }, {});
+  
+  // Init schema
+  const schema = { plugins: {} };
+  
+  const buildSchema = (model, name, plugin = false) => {
+    // Model data
+    const schemaModel = {
+      label: _.upperFirst(name),
+      labelPlural: _.upperFirst(pluralize(name)),
+      orm: model.orm || 'mongoose',
+    };
+  
+    // Fields (non relation)
+    schemaModel.fields = _.mapValues(_.pickBy(model.attributes, attribute =>
+      !attribute.model && !attribute.collection
+    ), (value, attribute) => ({
+      label: _.upperFirst(attribute),
+      description: '',
+      type: value.type || 'string',
+    }));
+  
+    // Select fields displayed in list view
+    // schemaModel.list = _.slice(_.keys(schemaModel.fields), 0, 4);
+    schemaModel.listDisplay = Object.keys(schemaModel.fields)
+      // Construct Array of attr ex { type: 'string', label: 'Foo', name: 'Foo', description: '' }
+      .map(attr => Object.assign(schemaModel.fields[attr], { name: attr }))
+      // Retrieve only the fourth first items
+      .slice(0, 4);
+  
+    if (model.associations) {
+      // Model relations
+      schemaModel.relations = model.associations.reduce((acc, current) => {
+        const displayedAttribute = current.plugin ?
+          _.get(pluginsModel, [current.plugin, 'models', current.model || current.collection, 'info', 'mainField']) ||
+          _.findKey(_.get(pluginsModel, [current.plugin, 'models', current.model || current.collection, 'attributes']), { type : 'string'}) ||
+          'id' :
+          _.get(models, [current.model || current.collection, 'info', 'mainField']) ||
+          _.findKey(_.get(models, [current.model || current.collection, 'attributes']), { type : 'string'}) ||
+          'id';
+  
+        acc[current.alias] = {
+          ...current,
+          description: '',
+          displayedAttribute,
+        };
+  
+        return acc;
+      }, {});
+    }
+  
+    if (plugin) {
+      return _.set(schema.plugins, `${plugin}.${name}`, schemaModel);
+    }
+  
+    // Set the formatted model to the schema
+    schema[name] = schemaModel;
+  };
+  
+  _.forEach(pluginsModel, (plugin, pluginName) => {
+    _.forEach(plugin.models, (model, name) => {
+      buildSchema(model, name, pluginName);
+    });
+  });
+  
+  // Generate schema for models.
+  _.forEach(models, (model, name) => {
+    buildSchema(model, name);
+  });
+  
+  const pluginStore = strapi.store({
+    environment: strapi.config.environment,
+    type: 'plugin',
+    name: 'content-manager'
+  });
+  
+  const buildSchemaKeys = (data) => Object.keys(data).reduce((acc, curr) => {
+
+    if (curr !== 'plugins') {
+
+      if (!data[curr].fields && _.isObject(data[curr])) {
+        return buildSchemaKeys(data[curr]);
+      }
+
+      return acc.concat([{ [curr]: Object.keys(data[curr].fields) }]);
+    } 
+  
+    return buildSchemaKeys(data[curr]);
+  }, []);
+  
+  try {
+    const prevSchema = await pluginStore.get({ key: 'schema' });
+  
+    if (!prevSchema) {
+      pluginStore.set({ key: 'schema', value: schema });
+      cb(); 
+    }
+  
+    const prevSchemaKeys = buildSchemaKeys(prevSchema);
+    const schemaKeys = buildSchemaKeys(schema);
+  
+    // Update the store with the new created APIs
+    if (!_.isEqual(prevSchemaKeys, schemaKeys)) {
+      pluginStore.set({ key: 'schema', value: _.merge(schema, prevSchema) });
+    }
+  
+  
+  } catch(err) {
+    console.log('error', err);
+  }  
+  
+
+  cb();
+};
\ No newline at end of file
diff --git a/packages/strapi-plugin-content-manager/config/layout.json b/packages/strapi-plugin-content-manager/config/layout.json
index 9e26dfeeb6..53e5def681 100644
--- a/packages/strapi-plugin-content-manager/config/layout.json
+++ b/packages/strapi-plugin-content-manager/config/layout.json
@@ -1 +1,12 @@
-{}
\ No newline at end of file
+{
+  "product": {
+    "attributes": {
+      "name": {
+        "appearance": ""
+      },
+      "json": {
+        "appearance": ""
+      }
+    }
+  }
+}
\ No newline at end of file
diff --git a/packages/strapi-plugin-users-permissions/models/Permission.settings.json b/packages/strapi-plugin-users-permissions/models/Permission.settings.json
index bd9acae178..2d037f3c70 100644
--- a/packages/strapi-plugin-users-permissions/models/Permission.settings.json
+++ b/packages/strapi-plugin-users-permissions/models/Permission.settings.json
@@ -27,7 +27,6 @@
     },
     "policy": {
       "type": "string",
-      "required": true,
       "configurable": false
     },
     "role": {

From 4aa46c5d0fd97031d25d5c39c2eb9d8906e40875 Mon Sep 17 00:00:00 2001
From: cyril lopez <cyril.lpz@gmail.com>
Date: Thu, 28 Jun 2018 09:31:17 +0200
Subject: [PATCH 05/65] Store config in core_store

---
 .../config/functions/bootstrap.js                     | 11 ++++++++---
 .../strapi-plugin-content-manager/config/layout.json  |  3 +++
 2 files changed, 11 insertions(+), 3 deletions(-)

diff --git a/packages/strapi-plugin-content-manager/config/functions/bootstrap.js b/packages/strapi-plugin-content-manager/config/functions/bootstrap.js
index 37c11afd5f..90a4836412 100644
--- a/packages/strapi-plugin-content-manager/config/functions/bootstrap.js
+++ b/packages/strapi-plugin-content-manager/config/functions/bootstrap.js
@@ -35,6 +35,11 @@ module.exports = async cb => {
       label: _.upperFirst(name),
       labelPlural: _.upperFirst(pluralize(name)),
       orm: model.orm || 'mongoose',
+      search: true,
+      filters: true,
+      bulkActions: true,
+      pageEntries: 20,
+      defaultSort: 'id'
     };
   
     // Fields (non relation)
@@ -50,10 +55,11 @@ module.exports = async cb => {
     // schemaModel.list = _.slice(_.keys(schemaModel.fields), 0, 4);
     schemaModel.listDisplay = Object.keys(schemaModel.fields)
       // Construct Array of attr ex { type: 'string', label: 'Foo', name: 'Foo', description: '' }
-      .map(attr => Object.assign(schemaModel.fields[attr], { name: attr }))
+      // NOTE: Do we allow sort on boolean?
+      .map(attr => Object.assign(schemaModel.fields[attr], { name: attr, sortable: true, searchable: true }))
       // Retrieve only the fourth first items
       .slice(0, 4);
-  
+    
     if (model.associations) {
       // Model relations
       schemaModel.relations = model.associations.reduce((acc, current) => {
@@ -101,7 +107,6 @@ module.exports = async cb => {
   });
   
   const buildSchemaKeys = (data) => Object.keys(data).reduce((acc, curr) => {
-
     if (curr !== 'plugins') {
 
       if (!data[curr].fields && _.isObject(data[curr])) {
diff --git a/packages/strapi-plugin-content-manager/config/layout.json b/packages/strapi-plugin-content-manager/config/layout.json
index 53e5def681..430ecb52f2 100644
--- a/packages/strapi-plugin-content-manager/config/layout.json
+++ b/packages/strapi-plugin-content-manager/config/layout.json
@@ -6,6 +6,9 @@
       },
       "json": {
         "appearance": ""
+      },
+      "bool": {
+        "appearance": ""
       }
     }
   }

From f09cace58211a602ee4507d6f2206d371b66628a Mon Sep 17 00:00:00 2001
From: cyril lopez <cyril.lpz@gmail.com>
Date: Thu, 28 Jun 2018 09:46:10 +0200
Subject: [PATCH 06/65] Remove JSON & Wysiwyg from helper-plugin and move them
 to content-manager

---
 .../lib/src/components/InputJSON/index.js     | 201 -----
 .../lib/src/components/InputJSON/jsonlint.js  | 424 ----------
 .../lib/src/components/InputJSON/styles.scss  |  40 -
 .../components/InputJSONWithErrors/index.js   | 227 -----
 .../InputJSONWithErrors/styles.scss           |   5 -
 .../lib/src/components/InputsIndex/index.js   |   4 -
 .../components/Wysiwyg/componentsStyles.scss  | 209 -----
 .../lib/src/components/Wysiwyg/constants.js   |  98 ---
 .../lib/src/components/Wysiwyg/converter.js   |  19 -
 .../src/components/Wysiwyg/customSelect.js    |  42 -
 .../lib/src/components/Wysiwyg/helpers.js     | 116 ---
 .../lib/src/components/Wysiwyg/image.js       |  22 -
 .../lib/src/components/Wysiwyg/index.js       | 792 ------------------
 .../lib/src/components/Wysiwyg/link.js        |  45 -
 .../src/components/Wysiwyg/previewControl.js  |  29 -
 .../src/components/Wysiwyg/previewWysiwyg.js  | 261 ------
 .../lib/src/components/Wysiwyg/strategies.js  |  35 -
 .../lib/src/components/Wysiwyg/styles.scss    | 115 ---
 .../lib/src/components/Wysiwyg/toggleMode.js  |  36 -
 .../lib/src/components/Wysiwyg/utils.js       |  74 --
 .../lib/src/components/Wysiwyg/video.js       |  26 -
 .../components/WysiwygBottomControls/index.js |  57 --
 .../WysiwygBottomControls/styles.scss         |  41 -
 .../src/components/WysiwygDropUpload/index.js |  26 -
 .../components/WysiwygDropUpload/styles.scss  |  12 -
 .../lib/src/components/WysiwygEditor/index.js |  27 -
 .../components/WysiwygInlineControls/index.js | 111 ---
 .../WysiwygInlineControls/styles.scss         | 123 ---
 .../components/WysiwygWithErrors/Loadable.js  |   7 -
 .../components/WysiwygWithErrors/Loader.js    |  11 -
 .../src/components/WysiwygWithErrors/index.js | 222 -----
 .../components/WysiwygWithErrors/styles.scss  |  24 -
 packages/strapi-helper-plugin/package.json    |   5 +-
 .../admin/src/components/Edit/index.js        |   4 +
 .../config/layout.json                        |   3 +
 .../package.json                              |   5 +-
 36 files changed, 12 insertions(+), 3486 deletions(-)
 delete mode 100644 packages/strapi-helper-plugin/lib/src/components/InputJSON/index.js
 delete mode 100644 packages/strapi-helper-plugin/lib/src/components/InputJSON/jsonlint.js
 delete mode 100644 packages/strapi-helper-plugin/lib/src/components/InputJSON/styles.scss
 delete mode 100644 packages/strapi-helper-plugin/lib/src/components/InputJSONWithErrors/index.js
 delete mode 100644 packages/strapi-helper-plugin/lib/src/components/InputJSONWithErrors/styles.scss
 delete mode 100644 packages/strapi-helper-plugin/lib/src/components/Wysiwyg/componentsStyles.scss
 delete mode 100644 packages/strapi-helper-plugin/lib/src/components/Wysiwyg/constants.js
 delete mode 100644 packages/strapi-helper-plugin/lib/src/components/Wysiwyg/converter.js
 delete mode 100644 packages/strapi-helper-plugin/lib/src/components/Wysiwyg/customSelect.js
 delete mode 100644 packages/strapi-helper-plugin/lib/src/components/Wysiwyg/helpers.js
 delete mode 100644 packages/strapi-helper-plugin/lib/src/components/Wysiwyg/image.js
 delete mode 100644 packages/strapi-helper-plugin/lib/src/components/Wysiwyg/index.js
 delete mode 100644 packages/strapi-helper-plugin/lib/src/components/Wysiwyg/link.js
 delete mode 100644 packages/strapi-helper-plugin/lib/src/components/Wysiwyg/previewControl.js
 delete mode 100644 packages/strapi-helper-plugin/lib/src/components/Wysiwyg/previewWysiwyg.js
 delete mode 100644 packages/strapi-helper-plugin/lib/src/components/Wysiwyg/strategies.js
 delete mode 100644 packages/strapi-helper-plugin/lib/src/components/Wysiwyg/styles.scss
 delete mode 100644 packages/strapi-helper-plugin/lib/src/components/Wysiwyg/toggleMode.js
 delete mode 100644 packages/strapi-helper-plugin/lib/src/components/Wysiwyg/utils.js
 delete mode 100644 packages/strapi-helper-plugin/lib/src/components/Wysiwyg/video.js
 delete mode 100644 packages/strapi-helper-plugin/lib/src/components/WysiwygBottomControls/index.js
 delete mode 100644 packages/strapi-helper-plugin/lib/src/components/WysiwygBottomControls/styles.scss
 delete mode 100644 packages/strapi-helper-plugin/lib/src/components/WysiwygDropUpload/index.js
 delete mode 100644 packages/strapi-helper-plugin/lib/src/components/WysiwygDropUpload/styles.scss
 delete mode 100644 packages/strapi-helper-plugin/lib/src/components/WysiwygEditor/index.js
 delete mode 100644 packages/strapi-helper-plugin/lib/src/components/WysiwygInlineControls/index.js
 delete mode 100644 packages/strapi-helper-plugin/lib/src/components/WysiwygInlineControls/styles.scss
 delete mode 100644 packages/strapi-helper-plugin/lib/src/components/WysiwygWithErrors/Loadable.js
 delete mode 100644 packages/strapi-helper-plugin/lib/src/components/WysiwygWithErrors/Loader.js
 delete mode 100644 packages/strapi-helper-plugin/lib/src/components/WysiwygWithErrors/index.js
 delete mode 100644 packages/strapi-helper-plugin/lib/src/components/WysiwygWithErrors/styles.scss

diff --git a/packages/strapi-helper-plugin/lib/src/components/InputJSON/index.js b/packages/strapi-helper-plugin/lib/src/components/InputJSON/index.js
deleted file mode 100644
index 199287766e..0000000000
--- a/packages/strapi-helper-plugin/lib/src/components/InputJSON/index.js
+++ /dev/null
@@ -1,201 +0,0 @@
-/**
- * 
- * InputJSON
- * 
- */
-
-
-import React from 'react';
-import PropTypes from 'prop-types';
-import cm from 'codemirror';
-import 'codemirror/lib/codemirror.css';
-import 'codemirror/mode/javascript/javascript';
-import 'codemirror/addon/lint/lint';
-import 'codemirror/addon/lint/javascript-lint';
-import 'codemirror/addon/edit/closebrackets';
-import 'codemirror/addon/selection/mark-selection';
-import 'codemirror/theme/liquibyte.css';
-import 'codemirror/theme/xq-dark.css';
-import 'codemirror/theme/3024-day.css';
-import 'codemirror/theme/3024-night.css';
-import 'codemirror/theme/blackboard.css';
-import 'codemirror/theme/monokai.css';
-import 'codemirror/theme/cobalt.css';
-
-import { isEmpty, isObject, trimStart } from 'lodash';
-import jsonlint from './jsonlint';
-import styles from './styles.scss';
-
-const WAIT = 600;
-const stringify = JSON.stringify;
-const parse = JSON.parse;
-const DEFAULT_THEME = 'monokai';
-const THEMES = ['blackboard', 'cobalt', 'monokai', '3024-day', '3024-night', 'liquibyte', 'xq-dark'];
-
-class InputJSON extends React.Component {
-  constructor(props) {
-    super(props);
-    this.editor = React.createRef();
-    this.state = { error: false, markedText: null };
-  }
-
-  componentDidMount() {
-    // Init codemirror component
-    this.codeMirror = cm.fromTextArea(this.editor.current, {
-      autoCloseBrackets: true,
-      lineNumbers: true,
-      matchBrackets: true,
-      mode: 'application/json',
-      smartIndent: true,
-      styleSelectedText: true,
-      tabSize: 2,
-      theme: DEFAULT_THEME,
-    });
-    this.codeMirror.on('change', this.handleChange);
-    this.codeMirror.on('blur', this.handleBlur);
-
-    this.setSize();
-    this.setInitValue();
-  }
-
-  componentDidUpdate(prevProps) {
-    if (isEmpty(prevProps.value) && !isEmpty(this.props.value) && !this.state.hasInitValue) {
-      this.setInitValue();
-    }
-  }
-
-  setInitValue = () => {
-    const { value } = this.props;
-
-    if (isObject(value) && value !== null) {
-      try {
-        parse(stringify(value));
-        this.setState({ hasInitValue: true });
-
-        return this.codeMirror.setValue(stringify(value, null, 2));
-      } catch(err) {
-
-        return this.setState({ error: true });
-      }
-    }
-  }
-
-  setSize = () => this.codeMirror.setSize('100%', 'auto');
-
-  setTheme = (theme) => this.codeMirror.setOption('theme', theme);
-
-  getContentAtLine = (line) => this.codeMirror.getLine(line);
-
-  getEditorOption = (opt) => this.codeMirror.getOption(opt);
-
-  getValue = () => this.codeMirror.getValue();
-
-  markSelection = ({ message }) => {
-    let line = parseInt(
-      message
-        .split(':')[0]
-        .split('line ')[1],
-      10,
-    ) - 1;
-
-    let content = this.getContentAtLine(line);
-
-    if (content === '{') {
-      line = line + 1;
-      content = this.getContentAtLine(line);
-    }
-    const chEnd = content.length;
-    const chStart = chEnd - trimStart(content, ' ').length;
-    const markedText = this.codeMirror.markText({ line, ch: chStart }, { line, ch: chEnd }, { className: styles.colored });
-    this.setState({ markedText });
-  }
-
-  timer = null;
-
-  handleBlur = ({ target }) => {
-    const { name, onBlur } = this.props;
-  
-    if (target === undefined) { // codemirror catches multiple events
-      onBlur({
-        target: {
-          name,
-          type: 'json',
-          value: this.getValue(),
-        },
-      });
-
-    }
-  }
-
-  handleChange = () => {
-    const { hasInitValue } = this.state;
-    const { name, onChange } = this.props;
-    let value = this.codeMirror.getValue();
-
-    try {
-      value = parse(value);
-    } catch(err) {
-      // Silent
-    }
-
-    // Update the parent
-    onChange({
-      target: {
-        name,
-        value,
-        type: 'json',
-      },
-    });
-
-    if (!hasInitValue) {
-      this.setState({ hasInitValue: true });
-    }
-
-    // Remove higlight error
-    if (this.state.markedText) {
-      this.state.markedText.clear();
-      this.setState({ markedText: null, error: null });
-    }
-    
-    clearTimeout(this.timer);
-    this.timer = setTimeout(() => this.testJSON(this.codeMirror.getValue()), WAIT);
-  }
-
-  testJSON = (value) => {
-    try {
-      jsonlint.parse(value);
-    } catch(err) {
-      this.markSelection(err);
-    }
-  }
-
-  render() {
-    if (this.state.error) {
-      return <div>error json</div>;
-    }
-
-    return (
-      <div className={styles.jsonWrapper}>
-        <textarea ref={this.editor} autoComplete='off' defaultValue="" />
-        <select className={styles.select} onChange={({ target }) => this.setTheme(target.value)} defaultValue={DEFAULT_THEME}>
-          {THEMES.sort().map(theme => <option key={theme} value={theme}>{theme}</option>)}
-        </select>
-      </div>
-    );
-  }
-}
-
-InputJSON.defaultProps = {
-  onBlur: () => {},
-  onChange: () => {},
-  value: null,
-};
-
-InputJSON.propTypes = {
-  name: PropTypes.string.isRequired,
-  onBlur: PropTypes.func,
-  onChange: PropTypes.func,
-  value: PropTypes.object,
-};
-
-export default InputJSON;
\ No newline at end of file
diff --git a/packages/strapi-helper-plugin/lib/src/components/InputJSON/jsonlint.js b/packages/strapi-helper-plugin/lib/src/components/InputJSON/jsonlint.js
deleted file mode 100644
index 7081babde7..0000000000
--- a/packages/strapi-helper-plugin/lib/src/components/InputJSON/jsonlint.js
+++ /dev/null
@@ -1,424 +0,0 @@
-/* Jison generated parser */
-/* eslint-disable */
-var jsonlint = (function(){
-  var parser = {trace: function trace() { },
-  yy: {},
-  symbols_: {"error":2,"JSONString":3,"STRING":4,"JSONNumber":5,"NUMBER":6,"JSONNullLiteral":7,"NULL":8,"JSONBooleanLiteral":9,"TRUE":10,"FALSE":11,"JSONText":12,"JSONValue":13,"EOF":14,"JSONObject":15,"JSONArray":16,"{":17,"}":18,"JSONMemberList":19,"JSONMember":20,":":21,",":22,"[":23,"]":24,"JSONElementList":25,"$accept":0,"$end":1},
-  terminals_: {2:"error",4:"STRING",6:"NUMBER",8:"NULL",10:"TRUE",11:"FALSE",14:"EOF",17:"{",18:"}",21:":",22:",",23:"[",24:"]"},
-  productions_: [0,[3,1],[5,1],[7,1],[9,1],[9,1],[12,2],[13,1],[13,1],[13,1],[13,1],[13,1],[13,1],[15,2],[15,3],[20,3],[19,1],[19,3],[16,2],[16,3],[25,1],[25,3]],
-  performAction: function anonymous(yytext,yyleng,yylineno,yy,yystate,$$,_$) {
-  
-  var $0 = $$.length - 1;
-  switch (yystate) {
-  case 1: // replace escaped characters with actual character
-            this.$ = yytext.replace(/\\(\\|")/g, "$"+"1")
-                       .replace(/\\n/g,'\n')
-                       .replace(/\\r/g,'\r')
-                       .replace(/\\t/g,'\t')
-                       .replace(/\\v/g,'\v')
-                       .replace(/\\f/g,'\f')
-                       .replace(/\\b/g,'\b');
-          
-  break;
-  case 2:this.$ = Number(yytext);
-  break;
-  case 3:this.$ = null;
-  break;
-  case 4:this.$ = true;
-  break;
-  case 5:this.$ = false;
-  break;
-  case 6:return this.$ = $$[$0-1];
-  break;
-  case 13:this.$ = {};
-  break;
-  case 14:this.$ = $$[$0-1];
-  break;
-  case 15:this.$ = [$$[$0-2], $$[$0]];
-  break;
-  case 16:this.$ = {}; this.$[$$[$0][0]] = $$[$0][1];
-  break;
-  case 17:this.$ = $$[$0-2]; $$[$0-2][$$[$0][0]] = $$[$0][1];
-  break;
-  case 18:this.$ = [];
-  break;
-  case 19:this.$ = $$[$0-1];
-  break;
-  case 20:this.$ = [$$[$0]];
-  break;
-  case 21:this.$ = $$[$0-2]; $$[$0-2].push($$[$0]);
-  break;
-  }
-  },
-  table: [{3:5,4:[1,12],5:6,6:[1,13],7:3,8:[1,9],9:4,10:[1,10],11:[1,11],12:1,13:2,15:7,16:8,17:[1,14],23:[1,15]},{1:[3]},{14:[1,16]},{14:[2,7],18:[2,7],22:[2,7],24:[2,7]},{14:[2,8],18:[2,8],22:[2,8],24:[2,8]},{14:[2,9],18:[2,9],22:[2,9],24:[2,9]},{14:[2,10],18:[2,10],22:[2,10],24:[2,10]},{14:[2,11],18:[2,11],22:[2,11],24:[2,11]},{14:[2,12],18:[2,12],22:[2,12],24:[2,12]},{14:[2,3],18:[2,3],22:[2,3],24:[2,3]},{14:[2,4],18:[2,4],22:[2,4],24:[2,4]},{14:[2,5],18:[2,5],22:[2,5],24:[2,5]},{14:[2,1],18:[2,1],21:[2,1],22:[2,1],24:[2,1]},{14:[2,2],18:[2,2],22:[2,2],24:[2,2]},{3:20,4:[1,12],18:[1,17],19:18,20:19},{3:5,4:[1,12],5:6,6:[1,13],7:3,8:[1,9],9:4,10:[1,10],11:[1,11],13:23,15:7,16:8,17:[1,14],23:[1,15],24:[1,21],25:22},{1:[2,6]},{14:[2,13],18:[2,13],22:[2,13],24:[2,13]},{18:[1,24],22:[1,25]},{18:[2,16],22:[2,16]},{21:[1,26]},{14:[2,18],18:[2,18],22:[2,18],24:[2,18]},{22:[1,28],24:[1,27]},{22:[2,20],24:[2,20]},{14:[2,14],18:[2,14],22:[2,14],24:[2,14]},{3:20,4:[1,12],20:29},{3:5,4:[1,12],5:6,6:[1,13],7:3,8:[1,9],9:4,10:[1,10],11:[1,11],13:30,15:7,16:8,17:[1,14],23:[1,15]},{14:[2,19],18:[2,19],22:[2,19],24:[2,19]},{3:5,4:[1,12],5:6,6:[1,13],7:3,8:[1,9],9:4,10:[1,10],11:[1,11],13:31,15:7,16:8,17:[1,14],23:[1,15]},{18:[2,17],22:[2,17]},{18:[2,15],22:[2,15]},{22:[2,21],24:[2,21]}],
-  defaultActions: {16:[2,6]},
-  parseError: function parseError(str, hash) {
-      throw new Error(str);
-  },
-  parse: function parse(input) {
-      var self = this,
-          stack = [0],
-          vstack = [null], // semantic value stack
-          lstack = [], // location stack
-          table = this.table,
-          yytext = '',
-          yylineno = 0,
-          yyleng = 0,
-          recovering = 0,
-          TERROR = 2,
-          EOF = 1;
-  
-      //this.reductionCount = this.shiftCount = 0;
-  
-      this.lexer.setInput(input);
-      this.lexer.yy = this.yy;
-      this.yy.lexer = this.lexer;
-      if (typeof this.lexer.yylloc == 'undefined')
-          this.lexer.yylloc = {};
-      var yyloc = this.lexer.yylloc;
-      lstack.push(yyloc);
-  
-      if (typeof this.yy.parseError === 'function')
-          this.parseError = this.yy.parseError;
-  
-      function popStack (n) {
-          stack.length = stack.length - 2*n;
-          vstack.length = vstack.length - n;
-          lstack.length = lstack.length - n;
-      }
-  
-      function lex() {
-          var token;
-          token = self.lexer.lex() || 1; // $end = 1
-          // if token isn't its numeric value, convert
-          if (typeof token !== 'number') {
-              token = self.symbols_[token] || token;
-          }
-          return token;
-      }
-  
-      var symbol, preErrorSymbol, state, action, a, r, yyval={},p,len,newState, expected;
-      while (true) {
-          // retreive state number from top of stack
-          state = stack[stack.length-1];
-  
-          // use default actions if available
-          if (this.defaultActions[state]) {
-              action = this.defaultActions[state];
-          } else {
-              if (symbol == null)
-                  symbol = lex();
-              // read action for current state and first input
-              action = table[state] && table[state][symbol];
-          }
-  
-          // handle parse error
-          _handle_error:
-          if (typeof action === 'undefined' || !action.length || !action[0]) {
-  
-              if (!recovering) {
-                  // Report error
-                  expected = [];
-                  for (p in table[state]) if (this.terminals_[p] && p > 2) {
-                      expected.push("'"+this.terminals_[p]+"'");
-                  }
-                  var errStr = '';
-                  if (this.lexer.showPosition) {
-                      errStr = 'Parse error on line '+(yylineno+1)+":\n"+this.lexer.showPosition()+"\nExpecting "+expected.join(', ') + ", got '" + this.terminals_[symbol]+ "'";
-                  } else {
-                      errStr = 'Parse error on line '+(yylineno+1)+": Unexpected " +
-                                    (symbol == 1 /*EOF*/ ? "end of input" :
-                                                ("'"+(this.terminals_[symbol] || symbol)+"'"));
-                  }
-                  this.parseError(errStr,
-                      {text: this.lexer.match, token: this.terminals_[symbol] || symbol, line: this.lexer.yylineno, loc: yyloc, expected: expected});
-              }
-  
-              // just recovered from another error
-              if (recovering == 3) {
-                  if (symbol == EOF) {
-                      throw new Error(errStr || 'Parsing halted.');
-                  }
-  
-                  // discard current lookahead and grab another
-                  yyleng = this.lexer.yyleng;
-                  yytext = this.lexer.yytext;
-                  yylineno = this.lexer.yylineno;
-                  yyloc = this.lexer.yylloc;
-                  symbol = lex();
-              }
-  
-              // try to recover from error
-              while (1) {
-                  // check for error recovery rule in this state
-                  if ((TERROR.toString()) in table[state]) {
-                      break;
-                  }
-                  if (state == 0) {
-                      throw new Error(errStr || 'Parsing halted.');
-                  }
-                  popStack(1);
-                  state = stack[stack.length-1];
-              }
-  
-              preErrorSymbol = symbol; // save the lookahead token
-              symbol = TERROR;         // insert generic error symbol as new lookahead
-              state = stack[stack.length-1];
-              action = table[state] && table[state][TERROR];
-              recovering = 3; // allow 3 real symbols to be shifted before reporting a new error
-          }
-  
-          // this shouldn't happen, unless resolve defaults are off
-          if (action[0] instanceof Array && action.length > 1) {
-              throw new Error('Parse Error: multiple actions possible at state: '+state+', token: '+symbol);
-          }
-  
-          switch (action[0]) {
-  
-              case 1: // shift
-                  //this.shiftCount++;
-  
-                  stack.push(symbol);
-                  vstack.push(this.lexer.yytext);
-                  lstack.push(this.lexer.yylloc);
-                  stack.push(action[1]); // push state
-                  symbol = null;
-                  if (!preErrorSymbol) { // normal execution/no error
-                      yyleng = this.lexer.yyleng;
-                      yytext = this.lexer.yytext;
-                      yylineno = this.lexer.yylineno;
-                      yyloc = this.lexer.yylloc;
-                      if (recovering > 0)
-                          recovering--;
-                  } else { // error just occurred, resume old lookahead f/ before error
-                      symbol = preErrorSymbol;
-                      preErrorSymbol = null;
-                  }
-                  break;
-  
-              case 2: // reduce
-                  //this.reductionCount++;
-  
-                  len = this.productions_[action[1]][1];
-  
-                  // perform semantic action
-                  yyval.$ = vstack[vstack.length-len]; // default to $$ = $1
-                  // default location, uses first token for firsts, last for lasts
-                  yyval._$ = {
-                      first_line: lstack[lstack.length-(len||1)].first_line,
-                      last_line: lstack[lstack.length-1].last_line,
-                      first_column: lstack[lstack.length-(len||1)].first_column,
-                      last_column: lstack[lstack.length-1].last_column
-                  };
-                  r = this.performAction.call(yyval, yytext, yyleng, yylineno, this.yy, action[1], vstack, lstack);
-  
-                  if (typeof r !== 'undefined') {
-                      return r;
-                  }
-  
-                  // pop off stack
-                  if (len) {
-                      stack = stack.slice(0,-1*len*2);
-                      vstack = vstack.slice(0, -1*len);
-                      lstack = lstack.slice(0, -1*len);
-                  }
-  
-                  stack.push(this.productions_[action[1]][0]);    // push nonterminal (reduce)
-                  vstack.push(yyval.$);
-                  lstack.push(yyval._$);
-                  // goto new state = table[STATE][NONTERMINAL]
-                  newState = table[stack[stack.length-2]][stack[stack.length-1]];
-                  stack.push(newState);
-                  break;
-  
-              case 3: // accept
-                  return true;
-          }
-  
-      }
-  
-      return true;
-  }};
-  /* Jison generated lexer */
-  var lexer = (function(){
-  var lexer = ({EOF:1,
-  parseError:function parseError(str, hash) {
-          if (this.yy.parseError) {
-              this.yy.parseError(str, hash);
-          } else {
-              throw new Error(str);
-          }
-      },
-  setInput:function (input) {
-          this._input = input;
-          this._more = this._less = this.done = false;
-          this.yylineno = this.yyleng = 0;
-          this.yytext = this.matched = this.match = '';
-          this.conditionStack = ['INITIAL'];
-          this.yylloc = {first_line:1,first_column:0,last_line:1,last_column:0};
-          return this;
-      },
-  input:function () {
-          var ch = this._input[0];
-          this.yytext+=ch;
-          this.yyleng++;
-          this.match+=ch;
-          this.matched+=ch;
-          var lines = ch.match(/\n/);
-          if (lines) this.yylineno++;
-          this._input = this._input.slice(1);
-          return ch;
-      },
-  unput:function (ch) {
-          this._input = ch + this._input;
-          return this;
-      },
-  more:function () {
-          this._more = true;
-          return this;
-      },
-  less:function (n) {
-          this._input = this.match.slice(n) + this._input;
-      },
-  pastInput:function () {
-          var past = this.matched.substr(0, this.matched.length - this.match.length);
-          return (past.length > 20 ? '...':'') + past.substr(-20).replace(/\n/g, "");
-      },
-  upcomingInput:function () {
-          var next = this.match;
-          if (next.length < 20) {
-              next += this._input.substr(0, 20-next.length);
-          }
-          return (next.substr(0,20)+(next.length > 20 ? '...':'')).replace(/\n/g, "");
-      },
-  showPosition:function () {
-          var pre = this.pastInput();
-          var c = new Array(pre.length + 1).join("-");
-          return pre + this.upcomingInput() + "\n" + c+"^";
-      },
-  next:function () {
-          if (this.done) {
-              return this.EOF;
-          }
-          if (!this._input) this.done = true;
-  
-          var token,
-              match,
-              tempMatch,
-              index,
-              col,
-              lines;
-          if (!this._more) {
-              this.yytext = '';
-              this.match = '';
-          }
-          var rules = this._currentRules();
-          for (var i=0;i < rules.length; i++) {
-              tempMatch = this._input.match(this.rules[rules[i]]);
-              if (tempMatch && (!match || tempMatch[0].length > match[0].length)) {
-                  match = tempMatch;
-                  index = i;
-                  if (!this.options.flex) break;
-              }
-          }
-          if (match) {
-              lines = match[0].match(/\n.*/g);
-              if (lines) this.yylineno += lines.length;
-              this.yylloc = {first_line: this.yylloc.last_line,
-                             last_line: this.yylineno+1,
-                             first_column: this.yylloc.last_column,
-                             last_column: lines ? lines[lines.length-1].length-1 : this.yylloc.last_column + match[0].length}
-              this.yytext += match[0];
-              this.match += match[0];
-              this.yyleng = this.yytext.length;
-              this._more = false;
-              this._input = this._input.slice(match[0].length);
-              this.matched += match[0];
-              token = this.performAction.call(this, this.yy, this, rules[index],this.conditionStack[this.conditionStack.length-1]);
-              if (this.done && this._input) this.done = false;
-              if (token) return token;
-              else return;
-          }
-          if (this._input === "") {
-              return this.EOF;
-          } else {
-              this.parseError('Lexical error on line '+(this.yylineno+1)+'. Unrecognized text.\n'+this.showPosition(), 
-                      {text: "", token: null, line: this.yylineno});
-          }
-      },
-  lex:function lex() {
-          var r = this.next();
-          if (typeof r !== 'undefined') {
-              return r;
-          } else {
-              return this.lex();
-          }
-      },
-  begin:function begin(condition) {
-          this.conditionStack.push(condition);
-      },
-  popState:function popState() {
-          return this.conditionStack.pop();
-      },
-  _currentRules:function _currentRules() {
-          return this.conditions[this.conditionStack[this.conditionStack.length-1]].rules;
-      },
-  topState:function () {
-          return this.conditionStack[this.conditionStack.length-2];
-      },
-  pushState:function begin(condition) {
-          this.begin(condition);
-      }});
-  lexer.options = {};
-  lexer.performAction = function anonymous(yy,yy_,$avoiding_name_collisions,YY_START) {
-  
-  var YYSTATE=YY_START
-  switch($avoiding_name_collisions) {
-  case 0:/* skip whitespace */
-  break;
-  case 1:return 6
-  break;
-  case 2:yy_.yytext = yy_.yytext.substr(1,yy_.yyleng-2); return 4
-  break;
-  case 3:return 17
-  break;
-  case 4:return 18
-  break;
-  case 5:return 23
-  break;
-  case 6:return 24
-  break;
-  case 7:return 22
-  break;
-  case 8:return 21
-  break;
-  case 9:return 10
-  break;
-  case 10:return 11
-  break;
-  case 11:return 8
-  break;
-  case 12:return 14
-  break;
-  case 13:return 'INVALID'
-  break;
-  }
-  };
-  lexer.rules = [/^(?:\s+)/,/^(?:(-?([0-9]|[1-9][0-9]+))(\.[0-9]+)?([eE][-+]?[0-9]+)?\b)/,/^(?:"(?:\\[\\"bfnrt/]|\\u[a-fA-F0-9]{4}|[^\\\0-\x09\x0a-\x1f"])*")/,/^(?:\{)/,/^(?:\})/,/^(?:\[)/,/^(?:\])/,/^(?:,)/,/^(?::)/,/^(?:true\b)/,/^(?:false\b)/,/^(?:null\b)/,/^(?:$)/,/^(?:.)/];
-  lexer.conditions = {"INITIAL":{"rules":[0,1,2,3,4,5,6,7,8,9,10,11,12,13],"inclusive":true}};
-  
-  
-  ;
-  return lexer;})()
-  parser.lexer = lexer;
-  return parser;
-  })();
-  if (typeof require !== 'undefined' && typeof exports !== 'undefined') {
-  exports.parser = jsonlint;
-  exports.parse = function () { return jsonlint.parse.apply(jsonlint, arguments); }
-  exports.main = function commonjsMain(args) {
-      if (!args[1]) {
-        throw new Error('Usage: '+args[0]+' FILE');
-      }
-  }
-}
\ No newline at end of file
diff --git a/packages/strapi-helper-plugin/lib/src/components/InputJSON/styles.scss b/packages/strapi-helper-plugin/lib/src/components/InputJSON/styles.scss
deleted file mode 100644
index da4a3bdce9..0000000000
--- a/packages/strapi-helper-plugin/lib/src/components/InputJSON/styles.scss
+++ /dev/null
@@ -1,40 +0,0 @@
-.jsonWrapper {
-  position: relative;
-  margin-top: 14px;
-  margin-bottom: -14px;
-  line-height: 18px;
-
-  >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;
-  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;
-  }
-}
-
-.colored {
-  background-color: yellow;
-  color: black !important;
-}
\ No newline at end of file
diff --git a/packages/strapi-helper-plugin/lib/src/components/InputJSONWithErrors/index.js b/packages/strapi-helper-plugin/lib/src/components/InputJSONWithErrors/index.js
deleted file mode 100644
index 184c74f748..0000000000
--- a/packages/strapi-helper-plugin/lib/src/components/InputJSONWithErrors/index.js
+++ /dev/null
@@ -1,227 +0,0 @@
-/**
- *
- * InputJSONWithErrors
- *
- */
-
-import React from 'react';
-import PropTypes from 'prop-types';
-import { isEmpty, isFunction } from 'lodash';
-import cn from 'classnames';
-
-// Design
-import Label from 'components/Label';
-import InputDescription from 'components/InputDescription';
-import InputErrors from 'components/InputErrors';
-import InputSpacer from 'components/InputSpacer';
-import InputJSON from 'components/InputJSON';
-
-// Utils
-import validateInput from 'utils/inputsValidations';
-
-import styles from './styles.scss';
-
-class InputJSONWithErrors extends React.Component { // eslint-disable-line react/prefer-stateless-function
-  state = { errors: [], hasInitialValue: false };
-
-  componentDidMount() {
-    const { value, errors } = this.props;
-
-    // Prevent the input from displaying an error when the user enters and leaves without filling it
-    if (!isEmpty(value)) {
-      this.setState({ hasInitialValue: true });
-    }
-
-    // Display input error if it already has some
-    if (!isEmpty(errors)) {
-      this.setState({ errors });
-    }
-  }
-
-  componentDidUpdate(prevProps) {
-    // Show required error if the input's value is received after the compo is mounted
-    if (!isEmpty(this.props.value) && !this.state.hasInitialValue) {
-      this.setInit();
-    }
-
-    // Check if errors have been updated during validations
-    if (prevProps.didCheckErrors !== this.props.didCheckErrors) {
-      // Remove from the state the errors that have already been set
-      const errors = isEmpty(this.props.errors) ? [] : this.props.errors;
-      this.setErrors(errors);
-    }
-  }
-  setErrors = errors => this.setState({ errors });
-
-  setInit = () => this.setState({ hasInitialValue: true });
-
-  /**
-   * Set the errors depending on the validations given to the input
-   * @param  {Object} target
-   */
-  handleBlur = ({ target }) => {
-    // Prevent from displaying error if the input is initially isEmpty
-    if (!isEmpty(target.value) || this.state.hasInitialValue) {
-      const errors = validateInput(target.value, this.props.validations);
-      this.setErrors(errors);
-      this.setInit();
-    }
-  }
-
-  handleChange = (e) => {
-    this.setState({ errors: [] });
-    this.props.onChange(e);
-  }
-
-  render() {
-    const {
-      autoFocus,
-      className,
-      customBootstrapClass,
-      deactivateErrorHighlight,
-      disabled,
-      errorsClassName,
-      errorsStyle,
-      inputClassName,
-      inputDescription,
-      inputDescriptionClassName,
-      inputStyle,
-      label,
-      labelClassName,
-      labelStyle,
-      name,
-      noErrorsDescription,
-      onBlur,
-      placeholder,
-      resetProps,
-      style,
-      tabIndex,
-      value,
-    } = this.props;
-    const handleBlur = isFunction(onBlur) ? onBlur : this.handleBlur;
-
-    let spacer = !isEmpty(inputDescription) ? <InputSpacer /> : <div />;
-
-    if (!noErrorsDescription && !isEmpty(this.state.errors)) {
-      spacer = <div />;
-    }
-
-    return (
-      <div
-        className={cn(
-          styles.containerJSON,
-          customBootstrapClass,
-          !isEmpty(className) && className,
-        )}
-        style={style}
-      >
-        <Label
-          className={labelClassName}
-          htmlFor={name}
-          message={label}
-          style={labelStyle}
-        />
-        <InputJSON
-          autoFocus={autoFocus}
-          className={inputClassName}
-          disabled={disabled}
-          deactivateErrorHighlight={deactivateErrorHighlight}
-          name={name}
-          onBlur={handleBlur}
-          onChange={this.handleChange}
-          placeholder={placeholder}
-          resetProps={resetProps}
-          style={inputStyle}
-          tabIndex={tabIndex}
-          value={value}
-        />
-        <InputDescription
-          className={inputDescriptionClassName}
-          message={inputDescription}
-          style={{ marginTop: '3.2rem'}}
-        />
-        <InputErrors
-          className={errorsClassName}
-          errors={!noErrorsDescription && this.state.errors || []}
-          style={errorsStyle}
-        />
-        {spacer}
-      </div>
-    );
-  }
-}
-
-InputJSONWithErrors.defaultProps = {
-  autoFocus: false,
-  className: '',
-  customBootstrapClass: 'col-md-12',
-  deactivateErrorHighlight: false,
-  didCheckErrors: false,
-  disabled: false,
-  errors: [],
-  errorsClassName: '',
-  errorsStyle: {},
-  inputClassName: '',
-  inputDescription: '',
-  inputDescriptionClassName: '',
-  inputStyle: {},
-  label: '',
-  labelClassName: '',
-  labelStyle: {},
-  noErrorsDescription: false,
-  onBlur: false,
-  placeholder: '',
-  resetProps: false,
-  style: {},
-  tabIndex: '0',
-  validations: {},
-  value: null,
-};
-
-InputJSONWithErrors.propTypes = {
-  autoFocus: PropTypes.bool,
-  className: PropTypes.string,
-  customBootstrapClass: PropTypes.string,
-  deactivateErrorHighlight: PropTypes.bool,
-  didCheckErrors: PropTypes.bool,
-  disabled: PropTypes.bool,
-  errors: PropTypes.array,
-  errorsClassName: PropTypes.string,
-  errorsStyle: PropTypes.object,
-  inputClassName: PropTypes.string,
-  inputDescription: PropTypes.oneOfType([
-    PropTypes.string,
-    PropTypes.func,
-    PropTypes.shape({
-      id: PropTypes.string,
-      params: PropTypes.object,
-    }),
-  ]),
-  inputDescriptionClassName: PropTypes.string,
-  inputStyle: PropTypes.object,
-  label: PropTypes.oneOfType([
-    PropTypes.string,
-    PropTypes.func,
-    PropTypes.shape({
-      id: PropTypes.string,
-      params: PropTypes.object,
-    }),
-  ]),
-  labelClassName: PropTypes.string,
-  labelStyle: PropTypes.object,
-  name: PropTypes.string.isRequired,
-  noErrorsDescription: PropTypes.bool,
-  onBlur: PropTypes.oneOfType([
-    PropTypes.bool,
-    PropTypes.func,
-  ]),
-  onChange: PropTypes.func.isRequired,
-  placeholder: PropTypes.string,
-  resetProps: PropTypes.bool,
-  style: PropTypes.object,
-  tabIndex: PropTypes.string,
-  validations: PropTypes.object,
-  value: PropTypes.object,
-};
-
-export default InputJSONWithErrors;
diff --git a/packages/strapi-helper-plugin/lib/src/components/InputJSONWithErrors/styles.scss b/packages/strapi-helper-plugin/lib/src/components/InputJSONWithErrors/styles.scss
deleted file mode 100644
index ee2da47dc1..0000000000
--- a/packages/strapi-helper-plugin/lib/src/components/InputJSONWithErrors/styles.scss
+++ /dev/null
@@ -1,5 +0,0 @@
-.containerJSON {
-  margin-bottom: 1.6rem;
-  font-size: 1.3rem;
-  font-family: 'Lato';
-}
diff --git a/packages/strapi-helper-plugin/lib/src/components/InputsIndex/index.js b/packages/strapi-helper-plugin/lib/src/components/InputsIndex/index.js
index ef8e995a99..8e7cfdf2c6 100644
--- a/packages/strapi-helper-plugin/lib/src/components/InputsIndex/index.js
+++ b/packages/strapi-helper-plugin/lib/src/components/InputsIndex/index.js
@@ -21,8 +21,6 @@ import InputPasswordWithErrors from 'components/InputPasswordWithErrors';
 import InputTextAreaWithErrors from 'components/InputTextAreaWithErrors';
 import InputTextWithErrors from 'components/InputTextWithErrors';
 import InputToggleWithErrors from 'components/InputToggleWithErrors';
-import WysiwygWithErrors from 'components/WysiwygWithErrors';
-import InputJSONWithErrors from 'components/InputJSONWithErrors';
 
 const DefaultInputError = ({ type }) => <div>Your input type: <b>{type}</b> does not exist</div>;
 
@@ -32,7 +30,6 @@ const inputs = {
   date: InputDateWithErrors,
   email: InputEmailWithErrors,
   file: InputFileWithErrors,
-  json: InputJSONWithErrors,
   number: InputNumberWithErrors,
   password: InputPasswordWithErrors,
   search: InputSearchWithErrors,
@@ -41,7 +38,6 @@ const inputs = {
   text: InputTextWithErrors,
   textarea: InputTextAreaWithErrors,
   toggle: InputToggleWithErrors,
-  wysiwyg: WysiwygWithErrors,
 };
 
 function InputsIndex(props) {
diff --git a/packages/strapi-helper-plugin/lib/src/components/Wysiwyg/componentsStyles.scss b/packages/strapi-helper-plugin/lib/src/components/Wysiwyg/componentsStyles.scss
deleted file mode 100644
index 8bfa287dfa..0000000000
--- a/packages/strapi-helper-plugin/lib/src/components/Wysiwyg/componentsStyles.scss
+++ /dev/null
@@ -1,209 +0,0 @@
-.editor {
-  max-height: 555px;
-  min-height: 303px;
-  overflow: auto;
-  padding: 20px 20px 0 20px;
-  font-size: 16px;
-  background-color: #fff;
-  line-height: 24px !important;
-  font-family: "OpenSans";
-  cursor: text;
-
-  // TODO define rules for header's margin
-  h1, h2, h3, h4, h5, h6 {
-    margin: 0;
-    line-height: 24px !important;
-    font-family: "OpenSans";
-  }
-
-  h1 {
-    margin-top: 11px !important;
-    font-size: 36px;
-    font-weight: 600;
-  }
-
-  h2 {
-    margin-top: 26px;
-    font-size: 30px;
-    font-weight: 500;
-  }
-
-  h3 {
-    margin-top: 26px;
-    font-size: 24px;
-    font-weight: 500;
-  }
-
-  h4 {
-    margin-top: 26px;
-    font-size: 20px;
-    font-weight: 500;
-  }
-
-  > div {
-    > div {
-      > div {
-        margin-bottom: 32px;
-      }
-    }
-  }
-
-  li {
-    margin-top: 0;
-  }
-
-  ul, ol {
-    padding: 0;
-    margin-top: 27px;
-  }
-
-  ol {
-    padding-left: 20px;
-  }
-
-  // NOTE: we might need this later
-  span {
-    white-space: pre-line;
-  }
-}
-
-h1+.editorParagraph{
-  margin-top: 31px;
-}
-
-.editorParagraph+* {
-  margin-bottom: -2px !important;
-}
-
-.editorParagraph+.editorBlockquote {
-  margin-bottom: 32px !important;
-}
-
-.editorBlockquote+ul {
-  margin-top: 38px !important;
-}
-
-.editorParagraph {
-  color: #333740;
-  margin-top: 27px;
-  margin-bottom: -3px;
-  font-size: 16px;
-  font-weight: 400;
-}
-
-.editorBlockquote {
-  margin-top: 41px;
-  margin-bottom: 34px;
-  font-size: 16px;
-  font-weight: 400;
-  border-left: 5px solid #eee;
-  font-style: italic;
-  padding: 10px 20px;
-}
-
-.unorderedList {
-  padding: 0;
-  margin-left: 18px;
-}
-
-.editorCodeBlock {
-  padding: 16px;
-  margin-top: 26px;
-  padding-bottom: 0;
-  background-color: rgba(0, 0, 0, 0.05);
-  border-radius: 3px;
-
-  span {
-    font-family: Consolas, monospace !important;
-    font-size: 12px;
-    line-height: 16px;
-    white-space: pre;
-  }
-}
-
-.editorFullScreen {
-  max-height: calc(100% - 70px) !important;
-  margin-bottom: 0;
-  overflow: auto;
-}
-
-.editorInput {
-  height: 0;
-  width: 0;
-}
-
-.editorSelect {
-  min-width: 161px;
-  margin-left: 15px;
-  margin-right: 5px;
-  > select {
-    box-shadow: 0 0 0 rgba(0,0,0,0)!important;
-  }
-}
-
-.fullscreenPreviewEditor {
-  margin-top: 9px;
-  padding: 10px 20px;
-}
-
-.previewControlsWrapper {
-  display: flex;
-  height: 49px;
-  width: 100%;
-  padding: 0 17px;
-  justify-content: space-between;
-  background-color: #FAFAFB;
-  line-height: 30px;
-  font-size: 12px;
-  font-family: Lato;
-  background-color: #fff;
-  border-bottom: 1px solid #F3F4F4;
-  line-height: 49px;
-  font-size: 13px;
-  > div:first-child {
-    > span:last-child {
-      font-size: 12px;
-    }
-  }
-  cursor: pointer;
-}
-
-.selectFullscreen {
-  min-width: 115px;
-  margin-left: 15px;
-  > select {
-    min-width: 110px !important;
-    box-shadow: 0 0 0 rgba(0,0,0,0)!important;
-  }
-}
-
-.toggleModeButton {
-  height: 32px;
-  min-width: 32px;
-  padding-left: 10px;
-  padding-right: 10px;
-  border: 1px solid rgba(16,22,34,0.10);
-  border-radius: 3px;
-  background: #F3F4F4;
-  font-size: 13px;
-  font-weight: 500;
-  text-align: center;
-  cursor: pointer;
-  &:focus, &:active {
-    outline: 0;
-  }
-}
-
-.toggleModeWrapper {
-  margin-left: auto;
-  margin-right: 15px;
-  padding-top: 8px;
-}
-
-.wysiwygCollapse {
-  &:after {
-    content: '\f066';
-    font-family: FontAwesome;
-    margin-left: 8px;
-  }
-}
diff --git a/packages/strapi-helper-plugin/lib/src/components/Wysiwyg/constants.js b/packages/strapi-helper-plugin/lib/src/components/Wysiwyg/constants.js
deleted file mode 100644
index e24f01b84f..0000000000
--- a/packages/strapi-helper-plugin/lib/src/components/Wysiwyg/constants.js
+++ /dev/null
@@ -1,98 +0,0 @@
-export const SELECT_OPTIONS = [
-  { id: 'components.Wysiwyg.selectOptions.title', value: '' },
-  { id: 'components.Wysiwyg.selectOptions.H1', value: '#' },
-  { id: 'components.Wysiwyg.selectOptions.H2', value: '##' },
-  { id: 'components.Wysiwyg.selectOptions.H3', value: '###' },
-  { id: 'components.Wysiwyg.selectOptions.H4', value: '####' },
-  { id: 'components.Wysiwyg.selectOptions.H5', value: '#####' },
-  { id: 'components.Wysiwyg.selectOptions.H6', value: '######' },
-];
-
-export const CONTROLS = [
-  [
-    {
-      label: 'B',
-      style: 'BOLD',
-      className: 'styleButtonBold',
-      hideLabel: true,
-      handler: 'addContent',
-      text: '**textToReplace**',
-    },
-    {
-      label: 'I',
-      style: 'ITALIC',
-      className: 'styleButtonItalic',
-      hideLabel: true,
-      handler: 'addContent',
-      text: '*textToReplace*',
-    },
-    {
-      label: 'U',
-      style: 'UNDERLINE',
-      className: 'styleButtonUnderline',
-      hideLabel: true,
-      handler: 'addContent',
-      text: '__textToReplace__',
-    },
-    {
-      label: 'S',
-      style: 'STRIKED',
-      className: 'styleButtonStrikedOut',
-      hideLabel: true,
-      handler: 'addContent',
-      text: '~~textToReplace~~',
-    },
-    {
-      label: 'UL',
-      style: 'unordered-list-item',
-      className: 'styleButtonUL',
-      hideLabel: true,
-      handler: 'addUlBlock',
-      text: '- textToReplace',
-    },
-    {
-      label: 'OL',
-      style: 'ordered-list-item',
-      className: 'styleButtonOL',
-      hideLabel: true,
-      handler: 'addOlBlock',
-      text: '1. textToReplace',
-    },
-  ],
-  [
-    {
-      label: '<>',
-      style: 'CODE',
-      className: 'styleButtonCodeBlock',
-      hideLabel: true,
-      handler: 'addSimpleBlockWithSelection',
-      text: '```textToReplace```',
-    },
-    {
-      label: 'img',
-      style: 'IMG',
-      className: 'styleButtonImg',
-      hideLabel: true,
-      handler: 'addSimpleBlockWithSelection',
-      text: '![text](textToReplace)',
-    },
-    {
-      label: 'Link',
-      style: 'LINK',
-      className: 'styleButtonLink',
-      hideLabel: true,
-      handler: 'addContent',
-      text: '[text](textToReplace)',
-    },
-    {
-      label: 'quotes',
-      style: 'BLOCKQUOTE',
-      className: 'styleButtonBlockQuote',
-      hideLabel: true,
-      handler: 'addSimpleBlockWithSelection',
-      text: '> textToReplace',
-    },
-  ],
-];
-
-export const DEFAULT_INDENTATION = '  ';
diff --git a/packages/strapi-helper-plugin/lib/src/components/Wysiwyg/converter.js b/packages/strapi-helper-plugin/lib/src/components/Wysiwyg/converter.js
deleted file mode 100644
index a321db39d4..0000000000
--- a/packages/strapi-helper-plugin/lib/src/components/Wysiwyg/converter.js
+++ /dev/null
@@ -1,19 +0,0 @@
-import showdown from 'showdown';
-
-const converterOptions = {
-  backslashEscapesHTMLTags: true,
-  emoji: true,
-  parseImgDimensions: true,
-  simpleLineBreaks: true,
-  simplifiedAutoLink: true,
-  smoothLivePreview: true,
-  splitAdjacentBlockquotes: false,
-  strikethrough: true,
-  tables: true,
-  tasklists: true,
-  underline: true,
-};
-
-const converter = new showdown.Converter(converterOptions);
-
-export default converter;
diff --git a/packages/strapi-helper-plugin/lib/src/components/Wysiwyg/customSelect.js b/packages/strapi-helper-plugin/lib/src/components/Wysiwyg/customSelect.js
deleted file mode 100644
index 0c28f5ea8c..0000000000
--- a/packages/strapi-helper-plugin/lib/src/components/Wysiwyg/customSelect.js
+++ /dev/null
@@ -1,42 +0,0 @@
-/**
- *
- *
- * CustomSelect
- *
- */
-
-import React from 'react';
-import PropTypes from 'prop-types';
-
-import Select from 'components/InputSelect';
-import { SELECT_OPTIONS } from './constants';
-
-import styles from './componentsStyles.scss';
-
-class CustomSelect extends React.Component {
-  render() {
-    const { isPreviewMode, headerValue, isFullscreen, handleChangeSelect } = this.context;
-    const selectClassName = isFullscreen ? styles.selectFullscreen : styles.editorSelect;
-
-    return (
-      <div className={selectClassName}>
-        <Select
-          disabled={isPreviewMode}
-          name="headerSelect"
-          onChange={handleChangeSelect}
-          value={headerValue}
-          selectOptions={SELECT_OPTIONS}
-        />
-      </div>
-    );
-  }
-}
-
-CustomSelect.contextTypes = {
-  handleChangeSelect: PropTypes.func,
-  headerValue: PropTypes.string,
-  isPreviewMode: PropTypes.bool,
-  isFullscreen: PropTypes.bool,
-};
-
-export default CustomSelect;
diff --git a/packages/strapi-helper-plugin/lib/src/components/Wysiwyg/helpers.js b/packages/strapi-helper-plugin/lib/src/components/Wysiwyg/helpers.js
deleted file mode 100644
index b1e73a4cf7..0000000000
--- a/packages/strapi-helper-plugin/lib/src/components/Wysiwyg/helpers.js
+++ /dev/null
@@ -1,116 +0,0 @@
-import { trimEnd, trimStart } from 'lodash';
-/**
- * Override the editor css
- * @param  {[type]} block [description]
- * @return {[type]}       [description]
- */
-
-export function getBlockStyle() {
-  return null;
-}
-
-export function getBlockContent(style) {
-  switch (style) {
-    case 'IMG':
-      return {
-        innerContent: 'link',
-        endReplacer: ')',
-        startReplacer: '![text](',
-      };
-    case 'CODE':
-      return {
-        innerContent: 'code block',
-        endReplacer: '`',
-        startReplacer: '`',
-      };
-    case 'BLOCKQUOTE':
-      return {
-        innerContent: 'quote',
-        endReplacer: '',
-        startReplacer: '> ',
-      };
-    case 'BOLD':
-      return {
-        innerContent: 'bold text',
-        endReplacer: '*',
-        startReplacer: '*',
-      };
-    case 'ITALIC':
-      return {
-        innerContent: 'italic text',
-        endReplacer: '*',
-        startReplacer: '*',
-      };
-    case 'STRIKED':
-      return {
-        innerContent: 'striked out',
-        endReplacer: '~',
-        startReplacer: '~',
-      };
-    case 'UNDERLINE':
-      return {
-        innerContent: 'underlined text',
-        endReplacer: '_',
-        startReplacer: '_',
-      };
-    case 'LINK':
-      return {
-        innerContent: 'link',
-        endReplacer: ')',
-        startReplacer: '[text](',
-      };
-    default:
-      return {
-        innerContent: '',
-        endReplacer: '',
-        startReplacer: '',
-      };
-  }
-}
-
-export const getDefaultSelectionOffsets = (
-  content,
-  startReplacer,
-  endReplacer,
-  initPosition = 0,
-) => ({
-  anchorOffset: initPosition + content.length - trimStart(content, startReplacer).length,
-  focusOffset: initPosition + trimEnd(content, endReplacer).length,
-});
-
-/**
- * Get the start and end offset
- * @param  {Object} selection
- * @return {Object}
- */
-export function getOffSets(selection) {
-  return {
-    end: selection.getEndOffset(),
-    start: selection.getStartOffset(),
-  };
-}
-
-export function getKeyCommandData(command) {
-  let content;
-  let style;
-
-  switch (command) {
-    case 'bold':
-      content = '**textToReplace**';
-      style = 'BOLD';
-      break;
-    case 'italic':
-      content = '*textToReplace*';
-      style = 'ITALIC';
-      break;
-    case 'underline':
-      content = '__textToReplace__';
-      style = 'UNDERLINE';
-      break;
-    default:
-      content = '';
-      style = '';
-  }
-
-  return { content, style };
-}
diff --git a/packages/strapi-helper-plugin/lib/src/components/Wysiwyg/image.js b/packages/strapi-helper-plugin/lib/src/components/Wysiwyg/image.js
deleted file mode 100644
index 5ffddb180b..0000000000
--- a/packages/strapi-helper-plugin/lib/src/components/Wysiwyg/image.js
+++ /dev/null
@@ -1,22 +0,0 @@
-/**
- *
- * Image
- *
- */
-
-
-import React from 'react';
-import PropTypes from 'prop-types';
-
-const Image = props => {
-  const { alt, height, src, width } = props.contentState.getEntity(props.entityKey).getData();
-
-  return <img alt={alt} src={src} height={height} width={width} style={{ maxWidth: '100%' }} />;
-};
-
-Image.propTypes = {
-  contentState: PropTypes.object.isRequired,
-  entityKey: PropTypes.string.isRequired,
-};
-
-export default Image;
diff --git a/packages/strapi-helper-plugin/lib/src/components/Wysiwyg/index.js b/packages/strapi-helper-plugin/lib/src/components/Wysiwyg/index.js
deleted file mode 100644
index eeead5e30c..0000000000
--- a/packages/strapi-helper-plugin/lib/src/components/Wysiwyg/index.js
+++ /dev/null
@@ -1,792 +0,0 @@
-/**
- *
- * Wysiwyg
- *
- */
-import React from 'react';
-import {
-  ContentState,
-  EditorState,
-  getDefaultKeyBinding,
-  genKey,
-  Modifier,
-  RichUtils,
-  SelectionState,
-} from 'draft-js';
-import PropTypes from 'prop-types';
-import { isEmpty, isNaN, replace, words } from 'lodash';
-import cn from 'classnames';
-import Controls from 'components/WysiwygInlineControls';
-import Drop from 'components/WysiwygDropUpload';
-import WysiwygBottomControls from 'components/WysiwygBottomControls';
-import WysiwygEditor from 'components/WysiwygEditor';
-import request from 'utils/request';
-import CustomSelect from './customSelect';
-import PreviewControl from './previewControl';
-import PreviewWysiwyg from './previewWysiwyg';
-import ToggleMode from './toggleMode';
-import { CONTROLS } from './constants';
-import {
-  getBlockContent,
-  getBlockStyle,
-  getDefaultSelectionOffsets,
-  getKeyCommandData,
-  getOffSets,
-} from './helpers';
-import {
-  createNewBlock,
-  getNextBlocksList,
-  getSelectedBlocksList,
-  onTab,
-  updateSelection,
-} from './utils';
-import styles from './styles.scss';
-
-/* eslint-disable react/jsx-handler-names */
-/* eslint-disable react/sort-comp */
-class Wysiwyg extends React.Component {
-  constructor(props) {
-    super(props);
-    this.state = {
-      editorState: EditorState.createEmpty(),
-      isDraging: false,
-      isFocused: false,
-      isFullscreen: false,
-      isPreviewMode: false,
-      headerValue: '',
-    };
-    this.focus = () => {
-      this.setState({ isFocused: true });
-      return this.domEditor.focus();
-    };
-    this.blur = () => {
-      this.setState({ isFocused: false });
-      return this.domEditor.blur();
-    };
-  }
-
-  getChildContext = () => ({
-    handleChangeSelect: this.handleChangeSelect,
-    headerValue: this.state.headerValue,
-    html: this.props.value,
-    isPreviewMode: this.state.isPreviewMode,
-    isFullscreen: this.state.isFullscreen,
-    placeholder: this.props.placeholder,
-  });
-
-  componentDidMount() {
-    if (this.props.autoFocus) {
-      this.focus();
-    }
-
-    if (!isEmpty(this.props.value)) {
-      this.setInitialValue(this.props);
-    }
-  }
-
-  shouldComponentUpdate(nextProps, nextState) {
-    if (nextState.editorState !== this.state.editorState) {
-      return true;
-    }
-
-    if (nextProps.resetProps !== this.props.resetProps) {
-      return true;
-    }
-
-    if (nextState.isDraging !== this.state.isDraging) {
-      return true;
-    }
-
-    if (nextState.isFocused !== this.state.isFocused) {
-      return true;
-    }
-
-    if (nextState.isFullscreen !== this.state.isFullscreen) {
-      return true;
-    }
-
-    if (nextState.isPreviewMode !== this.state.isPreviewMode) {
-      return true;
-    }
-
-    if (nextState.headerValue !== this.state.headerValue) {
-      return true;
-    }
-
-    return false;
-  }
-
-  componentDidUpdate(prevProps) {
-    // Handle resetProps
-    if (prevProps.resetProps !== this.props.resetProps) {
-      this.setInitialValue(this.props);
-    }
-  }
-
-  /**
-   * Init the editor with data from
-   * @param {[type]} props [description]
-   */
-  setInitialValue = props => {
-    const contentState = ContentState.createFromText(props.value);
-    const newEditorState = EditorState.createWithContent(contentState);
-    const editorState = this.state.isFocused
-      ? EditorState.moveFocusToEnd(newEditorState)
-      : newEditorState;
-    return this.setState({ editorState });
-  };
-
-  /**
-   * Handler to add B, I, Strike, U, link
-   * @param {String} content usually something like **textToReplace**
-   * @param {String} style
-   */
-  addContent = (content, style) => {
-    const selectedText = this.getSelectedText();
-    // Retrieve the associated data for the type to add
-    const { innerContent, endReplacer, startReplacer } = getBlockContent(style);
-    // Replace the selected text by the markdown command or insert default text
-    const defaultContent =
-      selectedText === ''
-        ? replace(content, 'textToReplace', innerContent)
-        : replace(content, 'textToReplace', selectedText);
-    // Get the current cursor position
-    const cursorPosition = getOffSets(this.getSelection()).start;
-    const textWithEntity = this.modifyBlockContent(defaultContent);
-    // Highlight the text
-    const { anchorOffset, focusOffset } = getDefaultSelectionOffsets(
-      defaultContent,
-      startReplacer,
-      endReplacer,
-      cursorPosition,
-    );
-    // Merge the current selection with the new one
-    const updatedSelection = this.getSelection().merge({ anchorOffset, focusOffset });
-    const newEditorState = EditorState.push(
-      this.getEditorState(),
-      textWithEntity,
-      'insert-character',
-    );
-    // Update the parent reducer
-    this.sendData(newEditorState);
-    // Don't handle selection : the user has selected some text to be changed with the appropriate markdown
-    if (selectedText !== '') {
-      return this.setState(
-        {
-          // Move the cursor to the end (this line forces the cursor to be at the end of the content)
-          // It may go at the end of the last block
-          editorState: EditorState.moveFocusToEnd(newEditorState),
-        },
-        () => {
-          this.focus();
-        },
-      );
-    }
-
-    return this.setState({
-      // Highlight the text if the selection wad empty
-      editorState: EditorState.forceSelection(newEditorState, updatedSelection),
-    });
-  };
-
-  /**
-   * Create an ordered list block
-   * @return ContentBlock
-   */
-  addOlBlock = () => {
-    // Get all the selected blocks
-    const selectedBlocksList = getSelectedBlocksList(this.getEditorState());
-    let newEditorState = this.getEditorState();
-
-    // Check if the cursor is NOT at the beginning of a new line
-    // So we need to move all the next blocks
-    if (getOffSets(this.getSelection()).start !== 0) {
-      // Retrieve all the blocks after the current position
-      const nextBlocks = getNextBlocksList(newEditorState, this.getSelection().getStartKey());
-      let liNumber = 1;
-
-      // Loop to update each block after the inserted li
-      nextBlocks.map((block, index) => {
-        const previousContent =
-          index === 0
-            ? this.getEditorState()
-              .getCurrentContent()
-              .getBlockForKey(this.getCurrentAnchorKey())
-            : newEditorState.getCurrentContent().getBlockBefore(block.getKey());
-        // Check if there was an li before the position so we update the entire list bullets
-        const number = previousContent ? parseInt(previousContent.getText().split('.')[0], 10) : 0;
-        liNumber = isNaN(number) ? 1 : number + 1;
-        const nextBlockText = index === 0 ? `${liNumber}. ` : nextBlocks.get(index - 1).getText();
-        // Update the current block
-        const newBlock = createNewBlock(nextBlockText, 'block-list', block.getKey());
-        // Update the contentState
-        const newContentState = this.createNewContentStateFromBlock(
-          newBlock,
-          newEditorState.getCurrentContent(),
-        );
-        newEditorState = EditorState.push(newEditorState, newContentState);
-      });
-
-      // Move the cursor to the correct position and add a space after '.'
-      // 2 for the dot and the space after, we add the number length (10 = offset of 2)
-      const offset = 2 + liNumber.toString().length;
-      const updatedSelection = updateSelection(this.getSelection(), nextBlocks, offset);
-
-      return this.setState({
-        editorState: EditorState.acceptSelection(newEditorState, updatedSelection),
-      });
-    }
-
-    // If the cursor is at the beginning we need to move all the content after the cursor so we don't loose the data
-    selectedBlocksList.map((block, i) => {
-      const selectedText = block.getText();
-      const li = selectedText === '' ? `${i + 1}. ` : `${i + 1}. ${selectedText}`;
-      const newBlock = createNewBlock(li, 'block-list', block.getKey());
-      const newContentState = this.createNewContentStateFromBlock(
-        newBlock,
-        newEditorState.getCurrentContent(),
-      );
-      newEditorState = EditorState.push(newEditorState, newContentState);
-    });
-
-    // Update the parent reducer
-    this.sendData(newEditorState);
-
-    return this.setState({ editorState: EditorState.moveFocusToEnd(newEditorState) });
-  };
-
-  /**
-   * Create an unordered list
-   * @return ContentBlock
-   */
-  // NOTE: it's pretty much the same dynamic as above
-  // We don't use the same handler because it needs less logic than a ordered list
-  // so it's easier to maintain the code
-  addUlBlock = () => {
-    const selectedBlocksList = getSelectedBlocksList(this.getEditorState());
-    let newEditorState = this.getEditorState();
-
-    if (getOffSets(this.getSelection()).start !== 0) {
-      const nextBlocks = getNextBlocksList(newEditorState, this.getSelection().getStartKey());
-
-      nextBlocks.map((block, index) => {
-        const nextBlockText = index === 0 ? '- ' : nextBlocks.get(index - 1).getText();
-        const newBlock = createNewBlock(nextBlockText, 'block-list', block.getKey());
-        const newContentState = this.createNewContentStateFromBlock(
-          newBlock,
-          newEditorState.getCurrentContent(),
-        );
-        newEditorState = EditorState.push(newEditorState, newContentState);
-      });
-      const updatedSelection = updateSelection(this.getSelection(), nextBlocks, 2);
-
-      return this.setState({
-        editorState: EditorState.acceptSelection(newEditorState, updatedSelection),
-      });
-    }
-
-    selectedBlocksList.map(block => {
-      const selectedText = block.getText();
-      const li = selectedText === '' ? '- ' : `- ${selectedText}`;
-      const newBlock = createNewBlock(li, 'block-list', block.getKey());
-      const newContentState = this.createNewContentStateFromBlock(
-        newBlock,
-        newEditorState.getCurrentContent(),
-      );
-      newEditorState = EditorState.push(newEditorState, newContentState);
-    });
-    this.sendData(newEditorState);
-    return this.setState({ editorState: EditorState.moveFocusToEnd(newEditorState) });
-  };
-
-  /**
-   * Handler to create header
-   * @param {String} text header content
-   */
-  addBlock = text => {
-    const nextBlockKey = this.getNextBlockKey(this.getCurrentAnchorKey()) || genKey();
-    const newBlock = createNewBlock(text, 'header', nextBlockKey);
-    const newContentState = this.createNewContentStateFromBlock(newBlock);
-    const newEditorState = this.createNewEditorState(newContentState, text);
-
-    return this.setState({ editorState: EditorState.moveFocusToEnd(newEditorState) });
-  };
-
-  /**
-   * Handler used for code block and Img controls
-   * @param {String} content the text that will be added
-   * @param {String} style   the type
-   */
-  addSimpleBlockWithSelection = (content, style) => {
-    const selectedText = this.getSelectedText();
-    const { innerContent, endReplacer, startReplacer } = getBlockContent(style);
-    const defaultContent =
-      selectedText === ''
-        ? replace(content, 'textToReplace', innerContent)
-        : replace(content, 'textToReplace', selectedText);
-    const newBlock = createNewBlock(defaultContent);
-    const newContentState = this.createNewContentStateFromBlock(newBlock);
-    const { anchorOffset, focusOffset } = getDefaultSelectionOffsets(
-      defaultContent,
-      startReplacer,
-      endReplacer,
-    );
-    let newEditorState = this.createNewEditorState(newContentState, defaultContent);
-    const updatedSelection =
-      getOffSets(this.getSelection()).start === 0
-        ? this.getSelection().merge({ anchorOffset, focusOffset })
-        : new SelectionState({
-          anchorKey: newBlock.getKey(),
-          anchorOffset,
-          focusOffset,
-          focusKey: newBlock.getKey(),
-          isBackward: false,
-        });
-
-    newEditorState = EditorState.acceptSelection(newEditorState, updatedSelection);
-
-    return this.setState({
-      editorState: EditorState.forceSelection(newEditorState, newEditorState.getSelection()),
-    });
-  };
-
-  /**
-   * Update the current editorState
-   * @param  {Map} newContentState
-   * @param  {String} text            The text to add
-   * @return {Map}                 EditorState
-   */
-  createNewEditorState = (newContentState, text) => {
-    let newEditorState;
-
-    if (getOffSets(this.getSelection()).start !== 0) {
-      newEditorState = EditorState.push(this.getEditorState(), newContentState);
-    } else {
-      const textWithEntity = this.modifyBlockContent(text);
-      newEditorState = EditorState.push(this.getEditorState(), textWithEntity, 'insert-characters');
-    }
-    return newEditorState;
-  };
-
-  /**
-   * Update the content of a block
-   * @param  {Map} newBlock     The new block
-   * @param  {Map} contentState The ContentState
-   * @return {Map}              The updated block
-   */
-  createNewBlockMap = (newBlock, contentState) =>
-    contentState.getBlockMap().set(newBlock.key, newBlock);
-
-  createNewContentStateFromBlock = (
-    newBlock,
-    contentState = this.getEditorState().getCurrentContent(),
-  ) =>
-    ContentState.createFromBlockArray(this.createNewBlockMap(newBlock, contentState).toArray())
-      .set('selectionBefore', contentState.getSelectionBefore())
-      .set('selectionAfter', contentState.getSelectionAfter());
-
-  getCharactersNumber = (editorState = this.getEditorState()) => {
-    const plainText = editorState.getCurrentContent().getPlainText();
-    const spacesNumber = plainText.split(' ').length;
-
-    return words(plainText).join('').length + spacesNumber - 1;
-  };
-
-  getEditorState = () => this.state.editorState;
-
-  /**
-   * Retrieve the selected text
-   * @return {Map}
-   */
-  getSelection = () => this.getEditorState().getSelection();
-
-  /**
-   * Retrieve the cursor anchor key
-   * @return {String}
-   */
-  getCurrentAnchorKey = () => this.getSelection().getAnchorKey();
-
-  /**
-   * Retrieve the current content block
-   * @return {Map} ContentBlock
-   */
-  getCurrentContentBlock = () =>
-    this.getEditorState()
-      .getCurrentContent()
-      .getBlockForKey(this.getSelection().getAnchorKey());
-
-  /**
-   * Retrieve the block key after a specific one
-   * @param  {String} currentBlockKey
-   * @param  {Map} [editorState=this.getEditorState()]  The current EditorState or the updated one
-   * @return {String}                                    The next block key
-   */
-  getNextBlockKey = (currentBlockKey, editorState = this.getEditorState()) =>
-    editorState.getCurrentContent().getKeyAfter(currentBlockKey);
-
-  getSelectedText = ({ start, end } = getOffSets(this.getSelection())) =>
-    this.getCurrentContentBlock()
-      .getText()
-      .slice(start, end);
-
-  handleBlur = () => {
-    const target = {
-      name: this.props.name,
-      type: 'textarea',
-      value: this.getEditorState()
-        .getCurrentContent()
-        .getPlainText(),
-    };
-    this.props.onBlur({ target });
-    this.blur();
-  };
-
-  handleChangeSelect = ({ target }) => {
-    this.setState({ headerValue: target.value });
-    const selectedText = this.getSelectedText();
-    const title = selectedText === '' ? `${target.value} ` : `${target.value} ${selectedText}`;
-    this.addBlock(title);
-
-    return this.setState({ headerValue: '' });
-  };
-
-  handleClickPreview = () => this.setState({ isPreviewMode: !this.state.isPreviewMode });
-
-  handleDragEnter = e => {
-    e.preventDefault();
-    e.stopPropagation();
-
-    if (!this.state.isDraging) {
-      this.setState({ isDraging: true });
-    }
-  };
-
-  handleDragLeave = () => this.setState({ isDraging: false });
-
-  handleDragOver = e => {
-    e.preventDefault();
-    e.stopPropagation();
-  };
-
-  handleDrop = e => {
-    e.preventDefault();
-
-    if (this.state.isPreviewMode) {
-      return this.setState({ isDraging: false });
-    }
-
-    const files = e.dataTransfer ? e.dataTransfer.files : e.target.files;
-    return this.uploadFile(files);
-  };
-
-  /**
-   * Handler that listens for specific key commands
-   * @param  {String} command
-   * @param  {Map} editorState
-   * @return {Bool}
-   */
-  handleKeyCommand = (command, editorState) => {
-    const newState = RichUtils.handleKeyCommand(editorState, command);
-
-    if (command === 'bold' || command === 'italic' || command === 'underline') {
-      const { content, style } = getKeyCommandData(command);
-      this.addContent(content, style);
-      return false;
-    }
-
-    if (newState && command !== 'backspace') {
-      this.onChange(newState);
-      return true;
-    }
-
-    return false;
-  };
-
-  /**
-   * Handler to upload files on paste
-   * @param  {Array<Blob>} files [description]
-   * @return {}                  DraftHandleValue
-   */
-  handlePastedFiles = files => this.uploadFile(files);
-
-  handleReturn = (e, editorState) => {
-    const selection = editorState.getSelection();
-    const currentBlock = editorState.getCurrentContent().getBlockForKey(selection.getStartKey());
-
-    if (currentBlock.getText().split('')[0] === '-') {
-      this.addUlBlock();
-      return true;
-    }
-
-    if (
-      currentBlock.getText().split('.').length > 1 &&
-      !isNaN(parseInt(currentBlock.getText().split('.')[0], 10))
-    ) {
-      this.addOlBlock();
-      return true;
-    }
-
-    return false;
-  };
-
-  mapKeyToEditorCommand = e => {
-    if (e.keyCode === 9 /* TAB */) {
-      const newEditorState = RichUtils.onTab(e, this.state.editorState, 4 /* maxDepth */);
-      if (newEditorState !== this.state.editorState) {
-        this.onChange(newEditorState);
-      }
-      return;
-    }
-
-    return getDefaultKeyBinding(e);
-  };
-
-  /**
-   * Change the content of a block
-   * @param  {String]} text
-   * @param  {Map} [contentState=this.getEditorState().getCurrentContent()]
-   * @return {Map}
-   */
-  modifyBlockContent = (text, contentState = this.getEditorState().getCurrentContent()) =>
-    Modifier.replaceText(contentState, this.getSelection(), text);
-
-  onChange = editorState => {
-    this.setState({ editorState });
-    this.sendData(editorState);
-  };
-
-  handleTab = e => {
-    e.preventDefault();
-    const newEditorState = onTab(this.getEditorState());
-
-    return this.onChange(newEditorState);
-  };
-
-  /**
-   * Update the parent reducer
-   * @param  {Map} editorState [description]
-   */
-  sendData = editorState => {
-    if (this.getEditorState().getCurrentContent() === editorState.getCurrentContent())
-      return;
-
-    this.props.onChange({
-      target: {
-        value: editorState.getCurrentContent().getPlainText(),
-        name: this.props.name,
-        type: 'textarea',
-      },
-    });
-  }
-
-  toggleFullScreen = e => {
-    e.preventDefault();
-    this.setState({
-      isFullscreen: !this.state.isFullscreen,
-      isPreviewMode: false,
-    });
-  };
-
-  uploadFile = files => {
-    const formData = new FormData();
-    formData.append('files', files[0]);
-    const headers = {
-      'X-Forwarded-Host': 'strapi',
-    };
-
-    let newEditorState = this.getEditorState();
-
-    const nextBlocks = getNextBlocksList(newEditorState, this.getSelection().getStartKey());
-    // Loop to update each block after the inserted li
-    nextBlocks.map((block, index) => {
-      // Update the current block
-      const nextBlockText = index === 0 ? `![Uploading ${files[0].name}]()` : nextBlocks.get(index - 1).getText();
-      const newBlock = createNewBlock(nextBlockText, 'unstyled', block.getKey());
-      // Update the contentState
-      const newContentState = this.createNewContentStateFromBlock(
-        newBlock,
-        newEditorState.getCurrentContent(),
-      );
-      newEditorState = EditorState.push(newEditorState, newContentState);
-    });
-
-    const offset = `![Uploading ${files[0].name}]()`.length;
-    const updatedSelection = updateSelection(this.getSelection(), nextBlocks, offset);
-    this.setState({ editorState: EditorState.acceptSelection(newEditorState, updatedSelection) });
-
-    return request('/upload', { method: 'POST', headers, body: formData }, false, false)
-      .then(response => {
-        const nextBlockKey = newEditorState
-          .getCurrentContent()
-          .getKeyAfter(newEditorState.getSelection().getStartKey());
-        const content = `![text](${response[0].url})`;
-        const newContentState = this.createNewContentStateFromBlock(
-          createNewBlock(content, 'unstyled', nextBlockKey),
-        );
-
-        newEditorState = EditorState.push(newEditorState, newContentState);
-        const updatedSelection = updateSelection(this.getSelection(), nextBlocks, 2);
-
-        this.setState({ editorState: EditorState.acceptSelection(newEditorState, updatedSelection) });
-        this.sendData(newEditorState);
-      })
-      .catch(() => {
-        this.setState({ editorState: EditorState.undo(this.getEditorState()) });
-      })
-      .finally(() => {
-        this.setState({ isDraging: false });
-      });
-  };
-
-  renderDrop = () => (
-    <Drop
-      onDrop={this.handleDrop}
-      onDragOver={this.handleDragOver}
-      onDragLeave={this.handleDragLeave}
-    />
-  );
-
-  render() {
-    const { editorState, isPreviewMode, isFullscreen } = this.state;
-    const editorStyle = isFullscreen ? { marginTop: '0' } : this.props.style;
-
-    return (
-      <div className={cn(isFullscreen && styles.fullscreenOverlay)}>
-        {/* FIRST EDITOR WITH CONTROLS} */}
-        <div
-          className={cn(
-            styles.editorWrapper,
-            !this.props.deactivateErrorHighlight && this.props.error && styles.editorError,
-            !isEmpty(this.props.className) && this.props.className,
-          )}
-          onClick={e => {
-            if (isFullscreen) {
-              e.preventDefault();
-              e.stopPropagation();
-            }
-          }}
-          onDragEnter={this.handleDragEnter}
-          onDragOver={this.handleDragOver}
-          style={editorStyle}
-        >
-          {this.state.isDraging && this.renderDrop()}
-          <div className={styles.controlsContainer}>
-            <CustomSelect />
-            {CONTROLS.map((value, key) => (
-              <Controls
-                key={key}
-                buttons={value}
-                disabled={isPreviewMode}
-                editorState={editorState}
-                handlers={{
-                  addContent: this.addContent,
-                  addOlBlock: this.addOlBlock,
-                  addSimpleBlockWithSelection: this.addSimpleBlockWithSelection,
-                  addUlBlock: this.addUlBlock,
-                }}
-                onToggle={this.toggleInlineStyle}
-                onToggleBlock={this.toggleBlockType}
-              />
-            ))}
-            {!isFullscreen ? (
-              <ToggleMode isPreviewMode={isPreviewMode} onClick={this.handleClickPreview} />
-            ) : (
-              <div style={{ marginRight: '10px' }} />
-            )}
-          </div>
-          {/* WYSIWYG PREVIEW NOT FULLSCREEN */}
-          {isPreviewMode ? (
-            <PreviewWysiwyg data={this.props.value} />
-          ) : (
-            <div
-              className={cn(styles.editor, isFullscreen && styles.editorFullScreen)}
-              onClick={this.focus}
-            >
-              <WysiwygEditor
-                blockStyleFn={getBlockStyle}
-                editorState={editorState}
-                handleKeyCommand={this.handleKeyCommand}
-                handlePastedFiles={this.handlePastedFiles}
-                handleReturn={this.handleReturn}
-                keyBindingFn={this.mapKeyToEditorCommand}
-                onBlur={this.handleBlur}
-                onChange={this.onChange}
-                onTab={this.handleTab}
-                placeholder={this.props.placeholder}
-                setRef={editor => (this.domEditor = editor)}
-                stripPastedStyles
-                tabIndex={this.props.tabIndex}
-              />
-              <input className={styles.editorInput} value="" tabIndex="-1" />
-            </div>
-          )}
-          {!isFullscreen && (
-            <WysiwygBottomControls
-              isPreviewMode={isPreviewMode}
-              onClick={this.toggleFullScreen}
-              onChange={this.handleDrop}
-            />
-          )}
-        </div>
-        {/* PREVIEW WYSIWYG FULLSCREEN */}
-        {isFullscreen && (
-          <div
-            className={cn(styles.editorWrapper)}
-            onClick={e => {
-              e.preventDefault();
-              e.stopPropagation();
-            }}
-            style={{ marginTop: '0' }}
-          >
-            <PreviewControl
-              onClick={this.toggleFullScreen}
-              characters={this.getCharactersNumber()}
-            />
-            <PreviewWysiwyg data={this.props.value} />
-          </div>
-        )}
-      </div>
-    );
-  }
-}
-
-Wysiwyg.childContextTypes = {
-  handleChangeSelect: PropTypes.func,
-  headerValue: PropTypes.string,
-  html: PropTypes.string,
-  isFullscreen: PropTypes.bool,
-  isPreviewMode: PropTypes.bool,
-  placeholder: PropTypes.string,
-  previewHTML: PropTypes.func,
-};
-
-Wysiwyg.defaultProps = {
-  autoFocus: false,
-  className: '',
-  deactivateErrorHighlight: false,
-  error: false,
-  onBlur: () => {},
-  onChange: () => {},
-  placeholder: '',
-  resetProps: false,
-  style: {},
-  tabIndex: '0',
-  value: '',
-};
-
-Wysiwyg.propTypes = {
-  autoFocus: PropTypes.bool,
-  className: PropTypes.string,
-  deactivateErrorHighlight: PropTypes.bool,
-  error: PropTypes.bool,
-  name: PropTypes.string.isRequired,
-  onBlur: PropTypes.func,
-  onChange: PropTypes.func,
-  placeholder: PropTypes.string,
-  resetProps: PropTypes.bool,
-  style: PropTypes.object,
-  tabIndex: PropTypes.string,
-  value: PropTypes.string,
-};
-
-export default Wysiwyg;
diff --git a/packages/strapi-helper-plugin/lib/src/components/Wysiwyg/link.js b/packages/strapi-helper-plugin/lib/src/components/Wysiwyg/link.js
deleted file mode 100644
index 4205cad294..0000000000
--- a/packages/strapi-helper-plugin/lib/src/components/Wysiwyg/link.js
+++ /dev/null
@@ -1,45 +0,0 @@
-/**
- *
- * Link
- *
- */
-
-import React from 'react';
-import PropTypes from 'prop-types';
-import { includes } from 'lodash';
-
-const Link = props => {
-  const { url, aHref, aInnerHTML } = props.contentState.getEntity(props.entityKey).getData();
-  let content = aInnerHTML;
-
-  if (includes(aInnerHTML, '<img', 'src=')) {
-    const src = aInnerHTML.split('src="')[1].split('" ')[0];
-    const width = includes(aInnerHTML, 'width=') ? aInnerHTML.split('width="')[1].split('" ')[0] : '';
-    const height = includes(aInnerHTML, 'height=') ? aInnerHTML.split('height="')[1].split('" ')[0] : '';
-    content = <img src={src} alt="img" width={width} height={height} style={{ marginTop: '27px', maxWidth: '100%' }} />;
-  }
-
-  return (
-    <a
-      href={url || aHref}
-      onClick={() => {
-        window.open(url || aHref, '_blank');
-      }}
-      style={{ cursor: 'pointer' }}
-    >
-      {content || props.children}
-    </a>
-  );
-};
-
-Link.defaultProps = {
-  children: '',
-};
-
-Link.propTypes = {
-  children: PropTypes.node,
-  contentState: PropTypes.object.isRequired,
-  entityKey: PropTypes.string.isRequired,
-};
-
-export default Link;
diff --git a/packages/strapi-helper-plugin/lib/src/components/Wysiwyg/previewControl.js b/packages/strapi-helper-plugin/lib/src/components/Wysiwyg/previewControl.js
deleted file mode 100644
index f05e582bd2..0000000000
--- a/packages/strapi-helper-plugin/lib/src/components/Wysiwyg/previewControl.js
+++ /dev/null
@@ -1,29 +0,0 @@
-/**
- *
- *
- * PreviewControl
- *
- */
-import React from 'react';
-import PropTypes from 'prop-types';
-import { FormattedMessage } from 'react-intl';
-import styles from './componentsStyles.scss';
-
-const PreviewControl = ({ onClick }) => (
-  <div className={styles.previewControlsWrapper} onClick={onClick}>
-    <div />
-    <div className={styles.wysiwygCollapse}>
-      <FormattedMessage id="components.Wysiwyg.collapse" />
-    </div>
-  </div>
-);
-
-PreviewControl.defaultProps = {
-  onClick: () => {},
-};
-
-PreviewControl.propTypes = {
-  onClick: PropTypes.func,
-};
-
-export default PreviewControl;
diff --git a/packages/strapi-helper-plugin/lib/src/components/Wysiwyg/previewWysiwyg.js b/packages/strapi-helper-plugin/lib/src/components/Wysiwyg/previewWysiwyg.js
deleted file mode 100644
index 99d297b8c1..0000000000
--- a/packages/strapi-helper-plugin/lib/src/components/Wysiwyg/previewWysiwyg.js
+++ /dev/null
@@ -1,261 +0,0 @@
-/**
- *
- * PreviewWysiwyg
- *
- */
-
-import React from 'react';
-import PropTypes from 'prop-types';
-import {
-  CompositeDecorator,
-  ContentState,
-  convertFromHTML,
-  EditorState,
-  ContentBlock,
-  genKey,
-  Entity,
-  CharacterMetadata,
-} from 'draft-js';
-import { List, OrderedSet, Repeat, fromJS } from 'immutable';
-import cn from 'classnames';
-import { isEmpty, toArray } from 'lodash';
-
-import WysiwygEditor from 'components/WysiwygEditor';
-import converter from './converter';
-import {
-  findAtomicEntities,
-  findLinkEntities,
-  findImageEntities,
-  findVideoEntities,
-} from './strategies';
-
-import Image from './image';
-import Link from './link';
-import Video from './video';
-
-import styles from './componentsStyles.scss';
-/* eslint-disable react/no-unused-state */
-function getBlockStyle(block) {
-  switch (block.getType()) {
-    case 'blockquote':
-      return styles.editorBlockquote;
-    case 'code-block':
-      return styles.editorCodeBlock;
-    case 'unstyled':
-      return styles.editorParagraph;
-    case 'unordered-list-item':
-      return styles.unorderedList;
-    case 'ordered-list-item':
-    case 'header-one':
-    case 'header-two':
-    case 'header-three':
-    case 'header-four':
-    case 'header-five':
-    case 'header-six':
-    default:
-      return null;
-  }
-}
-
-const decorator = new CompositeDecorator([
-  {
-    strategy: findLinkEntities,
-    component: Link,
-  },
-  {
-    strategy: findImageEntities,
-    component: Image,
-  },
-  {
-    strategy: findVideoEntities,
-    component: Video,
-  },
-  {
-    strategy: findAtomicEntities,
-    component: Link,
-  },
-]);
-
-const getBlockSpecForElement = aElement => ({
-  contentType: 'link',
-  aHref: aElement.href,
-  aInnerHTML: aElement.innerHTML,
-});
-
-const elementToBlockSpecElement = element => wrapBlockSpec(getBlockSpecForElement(element));
-
-const wrapBlockSpec = blockSpec => {
-  if (blockSpec == null) {
-    return null;
-  }
-  const tempEl = document.createElement('blockquote');
-  // stringify meta data and insert it as text content of temp HTML element. We will later extract
-  // and parse it.
-  tempEl.innerText = JSON.stringify(blockSpec);
-  return tempEl;
-};
-
-const replaceElement = (oldEl, newEl) => {
-  if (!(newEl instanceof HTMLElement)) {
-    return;
-  }
-  const parentNode = oldEl.parentNode;
-  return parentNode.replaceChild(newEl, oldEl);
-};
-
-const aReplacer = aElement => replaceElement(aElement, elementToBlockSpecElement(aElement));
-
-const createContentBlock = (blockData = {}) => {
-  const { key, type, text, data, inlineStyles, entityData } = blockData;
-
-  let blockSpec = {
-    type: type !== null && type !== undefined ? type : 'unstyled',
-    text: text !== null && text !== undefined ? text : '',
-    key: key !== null && key !== undefined ? key : genKey(),
-  };
-
-  if (data) {
-    blockSpec.data = fromJS(data);
-  }
-
-  if (inlineStyles || entityData) {
-    let entityKey;
-    if (entityData) {
-      const { type, mutability, data } = entityData;
-      entityKey = Entity.create(type, mutability, data);
-    } else {
-      entityKey = null;
-    }
-    const style = OrderedSet(inlineStyles || []);
-    const charData = CharacterMetadata.applyEntity(
-      CharacterMetadata.create({ style, entityKey }),
-      entityKey,
-    );
-    blockSpec.characterList = List(Repeat(charData, text.length));
-  }
-  return new ContentBlock(blockSpec);
-};
-
-class PreviewWysiwyg extends React.PureComponent {
-  state = { editorState: EditorState.createEmpty(), isMounted: false };
-
-  componentDidMount() {
-    const { data } = this.props;
-    this.setState({ isMounted: true });
-
-    if (!isEmpty(data)) {
-      this.previewHTML(data);
-    }
-  }
-
-  // NOTE: This is not optimal and this lifecycle should be removed
-  // I couldn't find a better way to decrease the fullscreen preview's data conversion time
-  // Trying with componentDidUpdate didn't work
-  UNSAFE_componentWillUpdate(nextProps, nextState) {
-    if (nextProps.data !== this.props.data) {
-      new Promise(resolve => {
-        setTimeout(() => {
-          if (nextProps.data === this.props.data && nextState.isMounted) {
-            // I use an handler here to update the state wich is fine since the condition above prevent
-            // from entering into an infinite loop
-            this.previewHTML(nextProps.data);
-          }
-          resolve();
-        }, 300);
-      });
-    }
-  }
-
-  componentWillUnmount() {
-    this.setState({ isMounted: false });
-  }
-
-  getClassName = () => {
-    if (this.context.isFullscreen) {
-      return cn(styles.editor, styles.editorFullScreen, styles.fullscreenPreviewEditor);
-    }
-
-    return styles.editor;
-  };
-
-  previewHTML = rawContent => {
-    const initHtml = isEmpty(rawContent) ? '<p></p>' : rawContent;
-    const html = new DOMParser().parseFromString(converter.makeHtml(initHtml), 'text/html');
-    toArray(html.getElementsByTagName('a')) // Retrieve all the links <a> tags
-      .filter((value) => value.getElementsByTagName('img').length > 0) // Filter by checking if they have any <img> children
-      .forEach(aReplacer); // Change those links into <blockquote> elements so we can set some metacharacters with the img content
-
-    // TODO:
-    // in the same way, retrieve all <pre> tags
-    // create custom atomic block
-    // create custom code block
-    let blocksFromHTML = convertFromHTML(html.body.innerHTML);
-
-    if (blocksFromHTML.contentBlocks) {
-      blocksFromHTML = blocksFromHTML.contentBlocks.reduce((acc, block) => {
-        if (block.getType() === 'blockquote') {
-          try {
-            const { aHref, aInnerHTML } = JSON.parse(block.getText());
-            const entityData = {
-              type: 'LINK',
-              mutability: 'IMMUTABLE',
-              data: {
-                aHref,
-                aInnerHTML,
-              },
-            };
-
-            const blockSpec = Object.assign(
-              { type: 'atomic', text: ' ', key: block.getKey() },
-              { entityData },
-            );
-            const atomicBlock = createContentBlock(blockSpec); // Create an atomic block so we can identify it easily
-
-            return acc.concat([atomicBlock]);
-          } catch (err) {
-            return acc.concat(block);
-          }
-        }
-
-        return acc.concat(block);
-      }, []);
-
-      const contentState = ContentState.createFromBlockArray(blocksFromHTML);
-
-      return this.setState({ editorState: EditorState.createWithContent(contentState, decorator) });
-    }
-
-    return this.setState({ editorState: EditorState.createEmpty() });
-  };
-
-  render() {
-    const { placeholder } = this.context;
-    // this.previewHTML2(this.props.data);
-    return (
-      <div className={this.getClassName()}>
-        <WysiwygEditor
-          blockStyleFn={getBlockStyle}
-          editorState={this.state.editorState}
-          onChange={() => {}}
-          placeholder={placeholder}
-        />
-        <input className={styles.editorInput} value="" tabIndex="-1" />
-      </div>
-    );
-  }
-}
-
-PreviewWysiwyg.contextTypes = {
-  isFullscreen: PropTypes.bool,
-  placeholder: PropTypes.string,
-};
-
-PreviewWysiwyg.defaultProps = {
-  data: '',
-};
-
-PreviewWysiwyg.propTypes = {
-  data: PropTypes.string,
-};
-
-export default PreviewWysiwyg;
diff --git a/packages/strapi-helper-plugin/lib/src/components/Wysiwyg/strategies.js b/packages/strapi-helper-plugin/lib/src/components/Wysiwyg/strategies.js
deleted file mode 100644
index 0ccd95d584..0000000000
--- a/packages/strapi-helper-plugin/lib/src/components/Wysiwyg/strategies.js
+++ /dev/null
@@ -1,35 +0,0 @@
-/* eslint-disable no-unused-vars */
-
-function findLinkEntities(contentBlock, callback, contentState) {
-  contentBlock.findEntityRanges(character => {
-    const entityKey = character.getEntity();
-    return entityKey !== null && contentState.getEntity(entityKey).getType() === 'LINK';
-  }, callback);
-}
-
-function findAtomicEntities(contentBlock, callback, contentState) {
-  contentBlock.findEntityRanges(character => {
-    const entityKey = character.getEntity();
-    return entityKey !== null && contentBlock.getType() === 'atomic';
-  }, callback);
-}
-
-function findImageEntities(contentBlock, callback, contentState) {
-  contentBlock.findEntityRanges(character => {
-    const entityKey = character.getEntity();
-
-    return entityKey !== null && contentState.getEntity(entityKey).getType() === 'IMAGE' && !isVideoType(contentState.getEntity(entityKey).getData().src);
-  }, callback);
-}
-
-function findVideoEntities(contentBlock, cb, contentState) {
-  contentBlock.findEntityRanges(character => {
-    const entityKey = character.getEntity();
-
-    return entityKey !== null && contentState.getEntity(entityKey).getType() === 'IMAGE' && isVideoType(contentState.getEntity(entityKey).getData().src);
-  }, cb);
-}
-
-const isVideoType = (fileName) => /\.(mp4|mpg|mpeg|mov|avi)$/i.test(fileName);
-
-export { findAtomicEntities, findLinkEntities, findImageEntities, findVideoEntities };
diff --git a/packages/strapi-helper-plugin/lib/src/components/Wysiwyg/styles.scss b/packages/strapi-helper-plugin/lib/src/components/Wysiwyg/styles.scss
deleted file mode 100644
index 400028c10d..0000000000
--- a/packages/strapi-helper-plugin/lib/src/components/Wysiwyg/styles.scss
+++ /dev/null
@@ -1,115 +0,0 @@
-.controlsContainer {
-  display: flex;
-  background-color: #F3F4F4;
-
-  select {
-    min-height: 31px !important;
-    min-width: 161px !important;
-    font-weight: 600;
-    outline: none;
-
-    &:focus, &:active{
-      border: 1px solid #E3E9F3;
-    }
-  }
-}
-
-.editorWrapper {
-  min-height: 320px;
-  margin-top: .9rem;
-  border: 1px solid #F3F4F4;
-  border-radius: 0.25rem;
-  line-height: 18px!important;
-  font-size: 13px;
-  box-shadow: 0px 1px 1px rgba(104, 118, 142, 0.05);
-  background-color: #fff;
-  position: relative;
-}
-
-.editor {
-  min-height: 303px;
-  max-height: 555px;
-  padding: 20px 20px 0 20px;
-  font-size: 16px;
-  background-color: #fff;
-  line-height: 18px !important;
-  cursor: text;
-  overflow: auto;
-
-  h1, h2, h3, h4, h5, h6 {
-    margin: 0;
-    line-height: 18px !important;
-  }
-  h1 {
-    margin-top: 13px !important;
-    margin-bottom: 22px;
-  }
-  > div {
-    > div {
-      > div {
-        margin-bottom: 32px;
-      }
-    }
-  }
-  li {
-    margin-top: 0;
-  }
-  ul, ol {
-    margin-bottom: 18px;
-  }
-}
-
-.editorError {
-  border-color: #ff203c !important;
-}
-
-.editorInput {
-  height: 0;
-  width: 0;
-}
-
-.editorBlockquote {
-  border-left: 5px solid #eee;
-  font-family: Lato;
-  font-style: italic;
-  margin: 16px 0;
-  padding: 10px 20px;
-}
-
-.editorCodeBlock {
-  margin-bottom: 0!important;
-  padding: 5px;
-  background-color: rgba(0, 0, 0, 0.05);
-  font-family: Lato;
-}
-
-
-.fullscreenOverlay {
-  position: fixed;
-  z-index: 1040;
-  top: calc(6rem + 90px);
-  left: calc(24rem + 28px);
-  right: 28px;
-  bottom: 32px;
-  display: flex;
-  background-color: transparent;
-  z-index: 99999;
-  > div {
-    min-width: 50%;
-  }
-  > div:first-child {
-    border-top-right-radius: 0;
-    border-bottom-right-radius: 0;
-  }
-  > div:last-child {
-    border-left: 0;
-    border-top-left-radius: 0;
-    border-bottom-left-radius: 0;
-  }
-}
-
-.editorFullScreen {
-  max-height: calc(100% - 70px) !important;
-  margin-bottom: 0;
-  overflow: auto;
-}
diff --git a/packages/strapi-helper-plugin/lib/src/components/Wysiwyg/toggleMode.js b/packages/strapi-helper-plugin/lib/src/components/Wysiwyg/toggleMode.js
deleted file mode 100644
index 5d3d573664..0000000000
--- a/packages/strapi-helper-plugin/lib/src/components/Wysiwyg/toggleMode.js
+++ /dev/null
@@ -1,36 +0,0 @@
-/**
- *
- *
- * ToggleMode
- */
-
-import React from 'react';
-import { FormattedMessage } from 'react-intl';
-import PropTypes from 'prop-types';
-import styles from './componentsStyles.scss';
-
-const ToggleMode = props => {
-  const label = props.isPreviewMode
-    ? 'components.Wysiwyg.ToggleMode.markdown'
-    : 'components.Wysiwyg.ToggleMode.preview';
-
-  return (
-    <div className={styles.toggleModeWrapper}>
-      <button type="button" className={styles.toggleModeButton} onClick={props.onClick}>
-        <FormattedMessage id={label} />
-      </button>
-    </div>
-  );
-};
-
-ToggleMode.defaultProps = {
-  isPreviewMode: false,
-  onClick: () => {},
-};
-
-ToggleMode.propTypes = {
-  isPreviewMode: PropTypes.bool,
-  onClick: PropTypes.func,
-};
-
-export default ToggleMode;
diff --git a/packages/strapi-helper-plugin/lib/src/components/Wysiwyg/utils.js b/packages/strapi-helper-plugin/lib/src/components/Wysiwyg/utils.js
deleted file mode 100644
index 1ed5a91c0b..0000000000
--- a/packages/strapi-helper-plugin/lib/src/components/Wysiwyg/utils.js
+++ /dev/null
@@ -1,74 +0,0 @@
-/**
- *
- * Utils
- *
- */
-
-import { ContentBlock, EditorState, genKey, Modifier } from 'draft-js';
-import { List } from 'immutable';
-import { DEFAULT_INDENTATION } from './constants';
-
-export function createNewBlock(text = '', type = 'unstyled', key = genKey()) {
-  return new ContentBlock({ key, type, text, charaterList: List([]) });
-}
-
-export function getNextBlocksList(editorState, startKey) {
-  return editorState
-    .getCurrentContent()
-    .getBlockMap()
-    .toSeq()
-    .skipUntil((_, k) => k === startKey)
-    .toList()
-    .shift()
-    .concat([createNewBlock()]);
-}
-
-
-export function updateSelection(selection, blocks, offset) {
-  return selection.merge({
-    anchorKey: blocks.get(0).getKey(),
-    focusKey: blocks.get(0).getKey(),
-    anchorOffset: offset,
-    focusOffset: offset,
-  });
-}
-
-export function getSelectedBlocksList(editorState) {
-  const selectionState = editorState.getSelection();
-  const contentState = editorState.getCurrentContent();
-  const startKey = selectionState.getStartKey();
-  const endKey = selectionState.getEndKey();
-  const blockMap = contentState.getBlockMap();
-  return blockMap
-    .toSeq()
-    .skipUntil((_, k) => k === startKey)
-    .takeUntil((_, k) => k === endKey)
-    .concat([[endKey, blockMap.get(endKey)]])
-    .toList();
-}
-
-export function onTab(editorState) {
-  const contentState = editorState.getCurrentContent();
-  const selection = editorState.getSelection();
-  let newContentState;
-
-  if (selection.isCollapsed()) {
-    newContentState = Modifier.insertText(
-      contentState,
-      selection,
-      DEFAULT_INDENTATION,
-    );
-  } else {
-    newContentState = Modifier.replaceText(
-      contentState,
-      selection,
-      DEFAULT_INDENTATION,
-    );
-  }
-
-  return EditorState.push(
-    editorState,
-    newContentState,
-    'insert-characters'
-  );
-}
diff --git a/packages/strapi-helper-plugin/lib/src/components/Wysiwyg/video.js b/packages/strapi-helper-plugin/lib/src/components/Wysiwyg/video.js
deleted file mode 100644
index 3cdbdaa9bb..0000000000
--- a/packages/strapi-helper-plugin/lib/src/components/Wysiwyg/video.js
+++ /dev/null
@@ -1,26 +0,0 @@
-/**
- *
- * Video
- *
- */
-
-import React from 'react';
-import PropTypes from 'prop-types';
-
-/* eslint-disable jsx-a11y/media-has-caption */
-const Video = props => {
-  const { height, src, width } = props.contentState.getEntity(props.entityKey).getData();
-
-  return (
-    <video height={height} width={width} style={{ maxWidth: '100%' }} controls>
-      <source src={src} />
-    </video>
-  );
-};
-
-Video.propTypes = {
-  contentState: PropTypes.object.isRequired,
-  entityKey: PropTypes.string.isRequired,
-};
-
-export default Video;
diff --git a/packages/strapi-helper-plugin/lib/src/components/WysiwygBottomControls/index.js b/packages/strapi-helper-plugin/lib/src/components/WysiwygBottomControls/index.js
deleted file mode 100644
index bad94258d0..0000000000
--- a/packages/strapi-helper-plugin/lib/src/components/WysiwygBottomControls/index.js
+++ /dev/null
@@ -1,57 +0,0 @@
-/**
- *
- * WysiwygBottomControls
- *
- */
-
-import React from 'react';
-import PropTypes from 'prop-types';
-import { FormattedMessage } from 'react-intl';
-
-import styles from './styles.scss';
-/* eslint-disable jsx-a11y/label-has-for */
-const WysiwygBottomControls = ({ isPreviewMode, onChange, onClick }) => {
-  const browse = (
-    <FormattedMessage id="components.WysiwygBottomControls.uploadFiles.browse">
-      {(message) => <span className={styles.underline}>{message}</span>}
-    </FormattedMessage>
-  );
-
-  return (
-    <div className={styles.wysiwygBottomControlsWrapper}>
-      <div>
-        <label
-          className={styles.dropLabel}
-          onClick={(e) => {
-            if (isPreviewMode) {
-              e.preventDefault();
-            }
-          }}
-        >
-          <FormattedMessage
-            id="components.WysiwygBottomControls.uploadFiles"
-            values={{ browse }}
-          />
-          <input type="file" onChange={onChange} />
-        </label>
-      </div>
-      <div className={styles.fullScreenWrapper} onClick={onClick}>
-        <FormattedMessage id="components.WysiwygBottomControls.fullscreen" />
-      </div>
-    </div>
-  );
-};
-
-WysiwygBottomControls.defaultProps = {
-  isPreviewMode: false,
-  onChange: () => {},
-  onClick: () => {},
-};
-
-WysiwygBottomControls.propTypes = {
-  isPreviewMode: PropTypes.bool,
-  onChange: PropTypes.func,
-  onClick: PropTypes.func,
-};
-
-export default WysiwygBottomControls;
diff --git a/packages/strapi-helper-plugin/lib/src/components/WysiwygBottomControls/styles.scss b/packages/strapi-helper-plugin/lib/src/components/WysiwygBottomControls/styles.scss
deleted file mode 100644
index c4d10ab7f1..0000000000
--- a/packages/strapi-helper-plugin/lib/src/components/WysiwygBottomControls/styles.scss
+++ /dev/null
@@ -1,41 +0,0 @@
-.wysiwygBottomControlsWrapper {
-  display: flex;
-  height: 30px;
-  width: 100%;
-  padding: 0 15px;
-  justify-content: space-between;
-  background-color: #FAFAFB;
-  line-height: 30px;
-  font-size: 13px;
-  font-family: Lato;
-  border-top: 1px dashed #e3e4e4;
-  
-  > div:first-child {
-    > span:last-child {
-      font-size: 12px;
-    }
-  }
-}
-
-
-.fullScreenWrapper {
-  cursor: pointer;
-  &:after {
-    content: '\f065';
-    margin-left: 8px;
-    font-family: FontAwesome;
-    font-size: 12px;
-  }
-}
-
-.underline {
-  color: #1C5DE7;
-  text-decoration: underline;
-  cursor: pointer;
-}
-
-.dropLabel {
-  > input {
-    display: none;
-  }
-}
diff --git a/packages/strapi-helper-plugin/lib/src/components/WysiwygDropUpload/index.js b/packages/strapi-helper-plugin/lib/src/components/WysiwygDropUpload/index.js
deleted file mode 100644
index e7abcec3c9..0000000000
--- a/packages/strapi-helper-plugin/lib/src/components/WysiwygDropUpload/index.js
+++ /dev/null
@@ -1,26 +0,0 @@
-/**
- *
- * WysiwygDropUpload
- *
- */
-
-import React from 'react';
-import styles from './styles.scss';
-
-/* eslint-disable jsx-a11y/label-has-for */
-const WysiwygDropUpload = (props) => {
-  return (
-    <label
-      {...props}
-      className={styles.wysiwygDropUpload}
-    >
-      <input
-        onChange={() => {}}
-        type="file"
-        tabIndex="-1"
-      />
-    </label>
-  );
-};
-
-export default WysiwygDropUpload;
diff --git a/packages/strapi-helper-plugin/lib/src/components/WysiwygDropUpload/styles.scss b/packages/strapi-helper-plugin/lib/src/components/WysiwygDropUpload/styles.scss
deleted file mode 100644
index eefdf14ba7..0000000000
--- a/packages/strapi-helper-plugin/lib/src/components/WysiwygDropUpload/styles.scss
+++ /dev/null
@@ -1,12 +0,0 @@
-.wysiwygDropUpload {
-  position: absolute;
-  top: 0;
-  right: 0;
-  left: 0;
-  bottom: 0;
-  background-color: rgba(28,93,231,0.01);
-
-  > input {
-    display: none;
-  }
-}
diff --git a/packages/strapi-helper-plugin/lib/src/components/WysiwygEditor/index.js b/packages/strapi-helper-plugin/lib/src/components/WysiwygEditor/index.js
deleted file mode 100644
index b612662639..0000000000
--- a/packages/strapi-helper-plugin/lib/src/components/WysiwygEditor/index.js
+++ /dev/null
@@ -1,27 +0,0 @@
-/**
- *
- * WysiwygEditor
- *
- */
-
-import React from 'react';
-import { Editor } from 'draft-js';
-import PropTypes from 'prop-types';
-
-class WysiwygEditor extends React.Component {
-  render() {
-    return (
-      <Editor {...this.props} ref={this.props.setRef} />
-    );
-  }
-}
-
-WysiwygEditor.defaultProps = {
-  setRef: () => {},
-};
-
-WysiwygEditor.propTypes = {
-  setRef: PropTypes.func,
-};
-
-export default WysiwygEditor;
diff --git a/packages/strapi-helper-plugin/lib/src/components/WysiwygInlineControls/index.js b/packages/strapi-helper-plugin/lib/src/components/WysiwygInlineControls/index.js
deleted file mode 100644
index 4564ea5662..0000000000
--- a/packages/strapi-helper-plugin/lib/src/components/WysiwygInlineControls/index.js
+++ /dev/null
@@ -1,111 +0,0 @@
-/**
- *
- * WysiwygInlineControls
- *
- */
-
-import React from 'react';
-import PropTypes from 'prop-types';
-import cn from 'classnames';
-
-import styles from './styles.scss';
-
-class StyleButton extends React.Component {
-  handleClick = (e) => {
-    e.preventDefault();
-
-    if (!this.props.disabled) {
-      this.props.handlers[this.props.handler](this.props.text, this.props.style);
-    }
-  }
-
-  render() {
-    return (
-      <div
-        className={cn(
-          this.props.active && styles.styleButtonActive,
-          styles.styleButton,
-          this.props.className && styles[this.props.className],
-          this.props.disabled && styles.styleButtonDisabled,
-        )}
-        onMouseDown={this.handleClick}
-      >
-        {!this.props.hideLabel && this.props.label}
-      </div>
-    );
-  }
-}
-
-const  WysiwygInlineControls = ({ buttons, disabled, editorState, handlers, onToggle, onToggleBlock }) => {
-  const selection = editorState.getSelection();
-  const blockType = editorState
-    .getCurrentContent()
-    .getBlockForKey(selection.getStartKey())
-    .getType();
-
-  const currentStyle = editorState.getCurrentInlineStyle();
-
-  return (
-    <div className={cn(styles.wysiwygInlineControls)}>
-      {buttons.map(type => (
-        <StyleButton
-          key={type.label}
-          active={type.style === blockType || currentStyle.has(type.style)}
-          className={type.className}
-          disabled={disabled}
-          handler={type.handler}
-          handlers={handlers}
-          hideLabel={type.hideLabel || false}
-          label={type.label}
-          onToggle={onToggle}
-          onToggleBlock={onToggleBlock}
-          style={type.style}
-          text={type.text}
-        />
-      ))}
-    </div>
-  );
-};
-
-/* eslint-disable react/default-props-match-prop-types */
-StyleButton.defaultProps = {
-  active: false,
-  className: '',
-  disabled: false,
-  hideLabel: false,
-  label: '',
-  onToggle: () => {},
-  onToggleBlock: () => {},
-  style: '',
-  text: '',
-};
-
-StyleButton.propTypes = {
-  active: PropTypes.bool,
-  className: PropTypes.string,
-  disabled: PropTypes.bool,
-  handler: PropTypes.string.isRequired,
-  handlers: PropTypes.object.isRequired,
-  hideLabel: PropTypes.bool,
-  label: PropTypes.string,
-  style: PropTypes.string,
-  text: PropTypes.string,
-};
-
-WysiwygInlineControls.defaultProps = {
-  buttons: [],
-  disabled: false,
-  onToggle: () => {},
-  onToggleBlock: () => {},
-};
-
-WysiwygInlineControls.propTypes = {
-  buttons: PropTypes.array,
-  disabled: PropTypes.bool,
-  editorState: PropTypes.object.isRequired,
-  handlers: PropTypes.object.isRequired,
-  onToggle: PropTypes.func,
-  onToggleBlock: PropTypes.func,
-};
-
-export default WysiwygInlineControls;
diff --git a/packages/strapi-helper-plugin/lib/src/components/WysiwygInlineControls/styles.scss b/packages/strapi-helper-plugin/lib/src/components/WysiwygInlineControls/styles.scss
deleted file mode 100644
index 1ed0462d75..0000000000
--- a/packages/strapi-helper-plugin/lib/src/components/WysiwygInlineControls/styles.scss
+++ /dev/null
@@ -1,123 +0,0 @@
-.active {
-  background-color: red;
-}
-
-.controlsWrapper {
-  display: flex;
-  user-select: none;
-  > div:nth-child(even) {
-    border-left: 0;
-    border-right: 0;
-  }
-}
-
-.styleButton {
-  height: 32px;
-  min-width: 32px;
-  background-color: #FFFFFF;
-  border: 1px solid rgba(16,22,34,0.10);
-  font-size: 13px;
-  font-weight: 500;
-  line-height: 32px;
-  text-align: center;
-  cursor: pointer;
-
-  &:hover {
-    background-color: #F3F4F4;
-  }
-}
-
-.styleButtonActive {
-  border: 0;
-  background: rgba(16,22,34,0.00);
-  box-shadow: inset 0 -1px 0 0 rgba(16,22,34,0.04), inset 0 1px 0 0 rgba(16,22,34,0.04);
-}
-
-.styleButtonBold {
-  background-image: url('../../assets/icons/icon_bold.svg');
-  background-position: center;
-  background-repeat: no-repeat;
-}
-
-.styleButtonDisabled {
-  opacity: 0.7;
-  cursor: not-allowed;
-}
-
-.styleButtonItalic {
-  background-image: url('../../assets/icons/icon_italic.svg');
-  background-position: center;
-  background-repeat: no-repeat;
-}
-
-.styleButtonUnderline {
-  background-image: url('../../assets/icons/icon_underline.svg');
-  background-position: center 11px;
-  background-repeat: no-repeat;
-}
-
-.styleButtonUL {
-  background-image: url('../../assets/icons/icon_bullet-list.svg');
-  background-position: center;
-  background-repeat: no-repeat;
-}
-
-.styleButtonOL {
-  background-image: url('../../assets/icons/icon_numbered-list.svg');
-  background-position: center 12px;
-  background-repeat: no-repeat;
-}
-
-.styleButtonBlockQuote {
-  background-image: url('../../assets/icons/icon_quote-block.svg');
-  background-position: center;
-  background-repeat: no-repeat;
-}
-
-.styleButtonCodeBlock {
-  background-image: url('../../assets/icons/icon_code-block.svg');
-  background-position: center;
-  background-repeat: no-repeat;
-}
-
-.styleButtonLink {
-  background-image: url('../../assets/icons/icon_link.svg');
-  background-position: center;
-  background-repeat: no-repeat;
-}
-
-.styleButtonImg {
-  background-image: url('../../assets/icons/icon_media.svg');
-  background-position: center;
-}
-
-.styleButtonStrikedOut {
-  background-image: url('../../assets/icons/icon_barred.svg');
-  background-position: center;
-  background-repeat: no-repeat;
-}
-
-.wysiwygInlineControls {
-  height: 49px;
-  display: flex;
-  padding: 8px 3px 0 10px;
-  background-color: #F3F4F4;
-  user-select: none;
-  > div:nth-child(even) {
-    border-left: 0;
-    border-right: 0;
-  }
-  > div:first-child {
-    border-top-left-radius: 3px;
-    border-bottom-left-radius: 3px;
-  }
-  > div:last-child {
-    border-top-right-radius: 3px;
-    border-bottom-right-radius: 3px;
-    border-right: 1px solid rgba(16,22,34,0.10);
-  }
-}
-
-.wysiwygInlineControlsFocus {
-  border-color: #78caff;
-}
diff --git a/packages/strapi-helper-plugin/lib/src/components/WysiwygWithErrors/Loadable.js b/packages/strapi-helper-plugin/lib/src/components/WysiwygWithErrors/Loadable.js
deleted file mode 100644
index 7077e11eb5..0000000000
--- a/packages/strapi-helper-plugin/lib/src/components/WysiwygWithErrors/Loadable.js
+++ /dev/null
@@ -1,7 +0,0 @@
-import Loadable from 'react-loadable';
-import Loader from './Loader';
-
-export default Loadable({
-  loader: () => import('./index'),
-  loading: Loader,
-});
\ No newline at end of file
diff --git a/packages/strapi-helper-plugin/lib/src/components/WysiwygWithErrors/Loader.js b/packages/strapi-helper-plugin/lib/src/components/WysiwygWithErrors/Loader.js
deleted file mode 100644
index bc65882ade..0000000000
--- a/packages/strapi-helper-plugin/lib/src/components/WysiwygWithErrors/Loader.js
+++ /dev/null
@@ -1,11 +0,0 @@
-import React from 'react';
-
-import styles from './styles.scss';
-
-const Loader = () => (
-  <div className="col-md-12">
-    <div className={styles.wysLoader}><div /></div>
-  </div>
-);
-
-export default Loader;
\ No newline at end of file
diff --git a/packages/strapi-helper-plugin/lib/src/components/WysiwygWithErrors/index.js b/packages/strapi-helper-plugin/lib/src/components/WysiwygWithErrors/index.js
deleted file mode 100644
index 4e68a4a09e..0000000000
--- a/packages/strapi-helper-plugin/lib/src/components/WysiwygWithErrors/index.js
+++ /dev/null
@@ -1,222 +0,0 @@
-/**
- *
- * WysiwygWithErrors
- *
- */
-
-import React from 'react';
-import PropTypes from 'prop-types';
-import { isEmpty, isFunction } from 'lodash';
-import cn from 'classnames';
-
-// Design
-import Label from 'components/Label';
-import InputDescription from 'components/InputDescription';
-import InputErrors from 'components/InputErrors';
-import InputSpacer from 'components/InputSpacer';
-import Wysiwyg from 'components/Wysiwyg';
-
-// Utils
-import validateInput from 'utils/inputsValidations';
-
-import styles from './styles.scss';
-
-class WysiwygWithErrors extends React.Component { // eslint-disable-line react/prefer-stateless-function
-  state = { errors: [], hasInitialValue: false };
-
-  componentDidMount() {
-    const { value, errors } = this.props;
-
-    // Prevent the input from displaying an error when the user enters and leaves without filling it
-    if (!isEmpty(value)) {
-      this.setState({ hasInitialValue: true });
-    }
-
-    // Display input error if it already has some
-    if (!isEmpty(errors)) {
-      this.setState({ errors });
-    }
-  }
-
-  componentWillReceiveProps(nextProps) {
-    // Show required error if the input's value is received after the compo is mounted
-    if (!isEmpty(nextProps.value) && !this.state.hasInitialValue) {
-      this.setState({ hasInitialValue: true });
-    }
-
-    // Check if errors have been updated during validations
-    if (nextProps.didCheckErrors !== this.props.didCheckErrors) {
-      // Remove from the state the errors that have already been set
-      const errors = isEmpty(nextProps.errors) ? [] : nextProps.errors;
-      this.setState({ errors });
-    }
-  }
-
-  /**
-   * Set the errors depending on the validations given to the input
-   * @param  {Object} target
-   */
-  handleBlur = ({ target }) => {
-    // Prevent from displaying error if the input is initially isEmpty
-    if (!isEmpty(target.value) || this.state.hasInitialValue) {
-      const errors = validateInput(target.value, this.props.validations);
-      this.setState({ errors, hasInitialValue: true });
-    }
-  }
-
-  render() {
-    const {
-      autoFocus,
-      className,
-      customBootstrapClass,
-      deactivateErrorHighlight,
-      disabled,
-      errorsClassName,
-      errorsStyle,
-      inputClassName,
-      inputDescription,
-      inputDescriptionClassName,
-      inputDescriptionStyle,
-      inputStyle,
-      label,
-      labelClassName,
-      labelStyle,
-      name,
-      noErrorsDescription,
-      onBlur,
-      onChange,
-      placeholder,
-      resetProps,
-      style,
-      tabIndex,
-      value,
-    } = this.props;
-    const handleBlur = isFunction(onBlur) ? onBlur : this.handleBlur;
-
-    let spacer = !isEmpty(inputDescription) ? <InputSpacer /> : <div />;
-
-    if (!noErrorsDescription && !isEmpty(this.state.errors)) {
-      spacer = <div />;
-    }
-
-    return (
-      <div
-        className={cn(
-          styles.containerWysiwyg,
-          customBootstrapClass,
-          !isEmpty(className) && className,
-        )}
-        style={style}
-      >
-        <Label
-          className={labelClassName}
-          htmlFor={name}
-          message={label}
-          style={labelStyle}
-        />
-        <Wysiwyg
-          autoFocus={autoFocus}
-          className={inputClassName}
-          disabled={disabled}
-          deactivateErrorHighlight={deactivateErrorHighlight}
-          error={!isEmpty(this.state.errors)}
-          name={name}
-          onBlur={handleBlur}
-          onChange={onChange}
-          placeholder={placeholder}
-          resetProps={resetProps}
-          style={inputStyle}
-          tabIndex={tabIndex}
-          value={value}
-        />
-        <InputDescription
-          className={inputDescriptionClassName}
-          message={inputDescription}
-          style={inputDescriptionStyle}
-        />
-        <InputErrors
-          className={errorsClassName}
-          errors={!noErrorsDescription && this.state.errors || []}
-          style={errorsStyle}
-        />
-        {spacer}
-      </div>
-    );
-  }
-}
-
-WysiwygWithErrors.defaultProps = {
-  autoFocus: false,
-  className: '',
-  customBootstrapClass: 'col-md-12',
-  deactivateErrorHighlight: false,
-  didCheckErrors: false,
-  disabled: false,
-  errors: [],
-  errorsClassName: '',
-  errorsStyle: {},
-  inputClassName: '',
-  inputDescription: '',
-  inputDescriptionClassName: '',
-  inputDescriptionStyle: {},
-  inputStyle: {},
-  label: '',
-  labelClassName: '',
-  labelStyle: {},
-  noErrorsDescription: false,
-  onBlur: false,
-  placeholder: '',
-  resetProps: false,
-  style: {},
-  tabIndex: '0',
-  validations: {},
-};
-
-WysiwygWithErrors.propTypes = {
-  autoFocus: PropTypes.bool,
-  className: PropTypes.string,
-  customBootstrapClass: PropTypes.string,
-  deactivateErrorHighlight: PropTypes.bool,
-  didCheckErrors: PropTypes.bool,
-  disabled: PropTypes.bool,
-  errors: PropTypes.array,
-  errorsClassName: PropTypes.string,
-  errorsStyle: PropTypes.object,
-  inputClassName: PropTypes.string,
-  inputDescription: PropTypes.oneOfType([
-    PropTypes.string,
-    PropTypes.func,
-    PropTypes.shape({
-      id: PropTypes.string,
-      params: PropTypes.object,
-    }),
-  ]),
-  inputDescriptionClassName: PropTypes.string,
-  inputDescriptionStyle: PropTypes.object,
-  inputStyle: PropTypes.object,
-  label: PropTypes.oneOfType([
-    PropTypes.string,
-    PropTypes.func,
-    PropTypes.shape({
-      id: PropTypes.string,
-      params: PropTypes.object,
-    }),
-  ]),
-  labelClassName: PropTypes.string,
-  labelStyle: PropTypes.object,
-  name: PropTypes.string.isRequired,
-  noErrorsDescription: PropTypes.bool,
-  onBlur: PropTypes.oneOfType([
-    PropTypes.bool,
-    PropTypes.func,
-  ]),
-  onChange: PropTypes.func.isRequired,
-  placeholder: PropTypes.string,
-  resetProps: PropTypes.bool,
-  style: PropTypes.object,
-  tabIndex: PropTypes.string,
-  validations: PropTypes.object,
-  value: PropTypes.string.isRequired,
-};
-
-export default WysiwygWithErrors;
diff --git a/packages/strapi-helper-plugin/lib/src/components/WysiwygWithErrors/styles.scss b/packages/strapi-helper-plugin/lib/src/components/WysiwygWithErrors/styles.scss
deleted file mode 100644
index 6be2e04f9e..0000000000
--- a/packages/strapi-helper-plugin/lib/src/components/WysiwygWithErrors/styles.scss
+++ /dev/null
@@ -1,24 +0,0 @@
-.containerWysiwyg {
-  margin-bottom: 1.6rem;
-  font-size: 1.3rem;
-  font-family: 'Lato';
-}
-
-.wysLoader {
-  display: flex;
-  justify-content: space-around;
-  width: 100%;
-  > div {
-    border: 4px solid #f3f3f3; /* Light grey */
-    border-top: 4px solid #3498db; /* Blue */
-    border-radius: 50%;
-    width: 30px;
-    height: 30px;
-    animation: spin 2s linear infinite;
-  }
-}
-
-@keyframes spin {
-  0% { transform: rotate(0deg); }
-  100% { transform: rotate(360deg); }
-}
\ No newline at end of file
diff --git a/packages/strapi-helper-plugin/package.json b/packages/strapi-helper-plugin/package.json
index fb54e76d1c..243515906b 100755
--- a/packages/strapi-helper-plugin/package.json
+++ b/packages/strapi-helper-plugin/package.json
@@ -48,11 +48,9 @@
     "bootstrap": "^4.0.0-alpha.6",
     "chalk": "^2.1.0",
     "classnames": "^2.2.5",
-    "codemirror": "^5.38.0",
     "copy-webpack-plugin": "^4.3.1",
     "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",
@@ -108,7 +106,6 @@
     "rimraf": "^2.6.1",
     "sass-loader": "^6.0.6",
     "shelljs": "^0.7.8",
-    "showdown": "^1.8.6",
     "style-loader": "^0.18.2",
     "styled-components": "^3.2.6",
     "url-loader": "^0.5.9",
@@ -118,4 +115,4 @@
     "webpack-hot-middleware": "^2.18.2",
     "whatwg-fetch": "^2.0.3"
   }
-}
\ No newline at end of file
+}
diff --git a/packages/strapi-plugin-content-manager/admin/src/components/Edit/index.js b/packages/strapi-plugin-content-manager/admin/src/components/Edit/index.js
index cbc76c9427..a8897b2df9 100644
--- a/packages/strapi-plugin-content-manager/admin/src/components/Edit/index.js
+++ b/packages/strapi-plugin-content-manager/admin/src/components/Edit/index.js
@@ -22,6 +22,9 @@ import {
 // or strapi/packages/strapi-helper-plugin/lib/src
 import Input from 'components/InputsIndex';
 
+import InputJSONWithErrors from 'components/InputJSONWithErrors';
+import WysiwygWithErrors from 'components/WysiwygWithErrors';
+
 import styles from './styles.scss';
 
 const getInputType = (type = '') => {
@@ -146,6 +149,7 @@ class Edit extends React.PureComponent {
               <Input
                 autoFocus={key === 0}
                 customBootstrapClass={get(layout, 'className')}
+                customInputs={{ json: InputJSONWithErrors, wysiwyg: WysiwygWithErrors }}
                 didCheckErrors={this.props.didCheckErrors}
                 errors={this.getInputErrors(attr)}
                 key={attr}
diff --git a/packages/strapi-plugin-content-manager/config/layout.json b/packages/strapi-plugin-content-manager/config/layout.json
index 430ecb52f2..ab0414408e 100644
--- a/packages/strapi-plugin-content-manager/config/layout.json
+++ b/packages/strapi-plugin-content-manager/config/layout.json
@@ -9,6 +9,9 @@
       },
       "bool": {
         "appearance": ""
+      },
+      "description": {
+        "appearance": "WYSIWYG"
       }
     }
   }
diff --git a/packages/strapi-plugin-content-manager/package.json b/packages/strapi-plugin-content-manager/package.json
index f41b7111a5..fa9c8b7040 100755
--- a/packages/strapi-plugin-content-manager/package.json
+++ b/packages/strapi-plugin-content-manager/package.json
@@ -22,7 +22,10 @@
     "prepublishOnly": "IS_MONOREPO=true npm run build"
   },
   "devDependencies": {
+    "codemirror": "^5.39.0",
+    "draft-js": "^0.10.5",
     "react-select": "^1.0.0-rc.5",
+    "showdown": "^1.8.6",
     "strapi-helper-plugin": "3.0.0-alpha.12.5"
   },
   "author": {
@@ -46,4 +49,4 @@
     "npm": ">= 5.0.0"
   },
   "license": "MIT"
-}
\ No newline at end of file
+}

From 799c6c3f0f9d100c5a63f64bf58fc226f2638e35 Mon Sep 17 00:00:00 2001
From: cyril lopez <cyril.lpz@gmail.com>
Date: Thu, 28 Jun 2018 10:01:59 +0200
Subject: [PATCH 07/65] Remove webpack warnings and react-intl errors

---
 packages/strapi-helper-plugin/lib/src/app.js  |  18 +-
 packages/strapi-helper-plugin/package.json    |   2 +-
 .../admin/src/assets/icons/icon_barred.svg    |   1 +
 .../admin/src/assets/icons/icon_bold.svg      |   1 +
 .../src/assets/icons/icon_bullet-list.svg     |   1 +
 .../src/assets/icons/icon_code-block.svg      |   1 +
 .../admin/src/assets/icons/icon_italic.svg    |   1 +
 .../admin/src/assets/icons/icon_link.svg      |   1 +
 .../admin/src/assets/icons/icon_media.svg     |   1 +
 .../src/assets/icons/icon_numbered-list.svg   |   1 +
 .../src/assets/icons/icon_quote-block.svg     |   1 +
 .../admin/src/assets/icons/icon_underline.svg |   1 +
 .../admin/src/components/InputJSON/index.js   | 201 +++++
 .../src/components/InputJSON/jsonlint.js      | 424 ++++++++++
 .../src/components/InputJSON/styles.scss      |  40 +
 .../components/InputJSONWithErrors/index.js   | 227 +++++
 .../InputJSONWithErrors/styles.scss           |   5 +
 .../components/Wysiwyg/componentsStyles.scss  | 209 +++++
 .../admin/src/components/Wysiwyg/constants.js |  98 +++
 .../admin/src/components/Wysiwyg/converter.js |  19 +
 .../src/components/Wysiwyg/customSelect.js    |  42 +
 .../admin/src/components/Wysiwyg/helpers.js   | 116 +++
 .../admin/src/components/Wysiwyg/image.js     |  22 +
 .../admin/src/components/Wysiwyg/index.js     | 792 ++++++++++++++++++
 .../admin/src/components/Wysiwyg/link.js      |  45 +
 .../src/components/Wysiwyg/previewControl.js  |  29 +
 .../src/components/Wysiwyg/previewWysiwyg.js  | 261 ++++++
 .../src/components/Wysiwyg/strategies.js      |  35 +
 .../admin/src/components/Wysiwyg/styles.scss  | 115 +++
 .../src/components/Wysiwyg/toggleMode.js      |  36 +
 .../admin/src/components/Wysiwyg/utils.js     |  74 ++
 .../admin/src/components/Wysiwyg/video.js     |  26 +
 .../components/WysiwygBottomControls/index.js |  57 ++
 .../WysiwygBottomControls/styles.scss         |  41 +
 .../src/components/WysiwygDropUpload/index.js |  26 +
 .../components/WysiwygDropUpload/styles.scss  |  12 +
 .../src/components/WysiwygEditor/index.js     |  27 +
 .../components/WysiwygInlineControls/index.js | 111 +++
 .../WysiwygInlineControls/styles.scss         | 123 +++
 .../components/WysiwygWithErrors/Loadable.js  |   7 +
 .../components/WysiwygWithErrors/Loader.js    |  11 +
 .../src/components/WysiwygWithErrors/index.js | 222 +++++
 .../components/WysiwygWithErrors/styles.scss  |  24 +
 .../admin/src/containers/App/sagas.js         |   3 +-
 .../admin/src/injectedComponents.js           |   1 +
 .../package.json                              |   2 +-
 .../admin/src/injectedComponents.js           |   1 +
 .../admin/src/injectedComponents.js           |   1 +
 .../admin/src/injectedComponents.js           |   1 +
 .../admin/src/injectedComponents.js           |   1 +
 .../admin/src/injectedComponents.js           |   1 +
 .../admin/src/translations/it.json            |   1 +
 52 files changed, 3508 insertions(+), 11 deletions(-)
 create mode 100755 packages/strapi-plugin-content-manager/admin/src/assets/icons/icon_barred.svg
 create mode 100755 packages/strapi-plugin-content-manager/admin/src/assets/icons/icon_bold.svg
 create mode 100755 packages/strapi-plugin-content-manager/admin/src/assets/icons/icon_bullet-list.svg
 create mode 100755 packages/strapi-plugin-content-manager/admin/src/assets/icons/icon_code-block.svg
 create mode 100755 packages/strapi-plugin-content-manager/admin/src/assets/icons/icon_italic.svg
 create mode 100755 packages/strapi-plugin-content-manager/admin/src/assets/icons/icon_link.svg
 create mode 100755 packages/strapi-plugin-content-manager/admin/src/assets/icons/icon_media.svg
 create mode 100755 packages/strapi-plugin-content-manager/admin/src/assets/icons/icon_numbered-list.svg
 create mode 100755 packages/strapi-plugin-content-manager/admin/src/assets/icons/icon_quote-block.svg
 create mode 100755 packages/strapi-plugin-content-manager/admin/src/assets/icons/icon_underline.svg
 create mode 100644 packages/strapi-plugin-content-manager/admin/src/components/InputJSON/index.js
 create mode 100644 packages/strapi-plugin-content-manager/admin/src/components/InputJSON/jsonlint.js
 create mode 100644 packages/strapi-plugin-content-manager/admin/src/components/InputJSON/styles.scss
 create mode 100644 packages/strapi-plugin-content-manager/admin/src/components/InputJSONWithErrors/index.js
 create mode 100644 packages/strapi-plugin-content-manager/admin/src/components/InputJSONWithErrors/styles.scss
 create mode 100644 packages/strapi-plugin-content-manager/admin/src/components/Wysiwyg/componentsStyles.scss
 create mode 100644 packages/strapi-plugin-content-manager/admin/src/components/Wysiwyg/constants.js
 create mode 100644 packages/strapi-plugin-content-manager/admin/src/components/Wysiwyg/converter.js
 create mode 100644 packages/strapi-plugin-content-manager/admin/src/components/Wysiwyg/customSelect.js
 create mode 100644 packages/strapi-plugin-content-manager/admin/src/components/Wysiwyg/helpers.js
 create mode 100644 packages/strapi-plugin-content-manager/admin/src/components/Wysiwyg/image.js
 create mode 100644 packages/strapi-plugin-content-manager/admin/src/components/Wysiwyg/index.js
 create mode 100644 packages/strapi-plugin-content-manager/admin/src/components/Wysiwyg/link.js
 create mode 100644 packages/strapi-plugin-content-manager/admin/src/components/Wysiwyg/previewControl.js
 create mode 100644 packages/strapi-plugin-content-manager/admin/src/components/Wysiwyg/previewWysiwyg.js
 create mode 100644 packages/strapi-plugin-content-manager/admin/src/components/Wysiwyg/strategies.js
 create mode 100644 packages/strapi-plugin-content-manager/admin/src/components/Wysiwyg/styles.scss
 create mode 100644 packages/strapi-plugin-content-manager/admin/src/components/Wysiwyg/toggleMode.js
 create mode 100644 packages/strapi-plugin-content-manager/admin/src/components/Wysiwyg/utils.js
 create mode 100644 packages/strapi-plugin-content-manager/admin/src/components/Wysiwyg/video.js
 create mode 100644 packages/strapi-plugin-content-manager/admin/src/components/WysiwygBottomControls/index.js
 create mode 100644 packages/strapi-plugin-content-manager/admin/src/components/WysiwygBottomControls/styles.scss
 create mode 100644 packages/strapi-plugin-content-manager/admin/src/components/WysiwygDropUpload/index.js
 create mode 100644 packages/strapi-plugin-content-manager/admin/src/components/WysiwygDropUpload/styles.scss
 create mode 100644 packages/strapi-plugin-content-manager/admin/src/components/WysiwygEditor/index.js
 create mode 100644 packages/strapi-plugin-content-manager/admin/src/components/WysiwygInlineControls/index.js
 create mode 100644 packages/strapi-plugin-content-manager/admin/src/components/WysiwygInlineControls/styles.scss
 create mode 100644 packages/strapi-plugin-content-manager/admin/src/components/WysiwygWithErrors/Loadable.js
 create mode 100644 packages/strapi-plugin-content-manager/admin/src/components/WysiwygWithErrors/Loader.js
 create mode 100644 packages/strapi-plugin-content-manager/admin/src/components/WysiwygWithErrors/index.js
 create mode 100644 packages/strapi-plugin-content-manager/admin/src/components/WysiwygWithErrors/styles.scss
 create mode 100644 packages/strapi-plugin-content-manager/admin/src/injectedComponents.js
 create mode 100644 packages/strapi-plugin-content-type-builder/admin/src/injectedComponents.js
 create mode 100644 packages/strapi-plugin-email/admin/src/injectedComponents.js
 create mode 100644 packages/strapi-plugin-settings-manager/admin/src/injectedComponents.js
 create mode 100644 packages/strapi-plugin-upload/admin/src/injectedComponents.js
 create mode 100644 packages/strapi-plugin-users-permissions/admin/src/injectedComponents.js
 create mode 100644 packages/strapi-plugin-users-permissions/admin/src/translations/it.json

diff --git a/packages/strapi-helper-plugin/lib/src/app.js b/packages/strapi-helper-plugin/lib/src/app.js
index 69d124f6d7..cf962f451b 100755
--- a/packages/strapi-helper-plugin/lib/src/app.js
+++ b/packages/strapi-helper-plugin/lib/src/app.js
@@ -33,13 +33,15 @@ const tryRequireRoot = (source) => {
 const bootstrap = tryRequireRoot('bootstrap');
 const pluginRequirements = tryRequireRoot('requirements');
 
-const layout = (() => {
-  try {
-    return require('../../../../config/layout.js'); // eslint-disable-line import/no-unresolved
-  } catch(err) {
-    return null;
-  }
-})();
+// NOTE: I'm commenting this line for the moment since we don't use the layout in the other plugins anymore
+// Initially it was developed for the content-manager but we acces the layout via a request instead of building it
+// const layout = (() => {
+//   try {
+//     return require('../../../../config/layout.js'); // eslint-disable-line import/no-unresolved
+//   } catch(err) {
+//     return null;
+//   }
+// })();
 
 const injectedComponents = (() => {
   try {
@@ -97,7 +99,7 @@ strapi.registerPlugin({
   icon: pluginPkg.strapi.icon,
   id: pluginId,
   injectedComponents,
-  layout,
+  layout: null,
   leftMenuLinks: [],
   mainComponent: Comp,
   name: pluginPkg.strapi.name,
diff --git a/packages/strapi-helper-plugin/package.json b/packages/strapi-helper-plugin/package.json
index 243515906b..2c94c21223 100755
--- a/packages/strapi-helper-plugin/package.json
+++ b/packages/strapi-helper-plugin/package.json
@@ -115,4 +115,4 @@
     "webpack-hot-middleware": "^2.18.2",
     "whatwg-fetch": "^2.0.3"
   }
-}
+}
\ No newline at end of file
diff --git a/packages/strapi-plugin-content-manager/admin/src/assets/icons/icon_barred.svg b/packages/strapi-plugin-content-manager/admin/src/assets/icons/icon_barred.svg
new file mode 100755
index 0000000000..2f3c7b9111
--- /dev/null
+++ b/packages/strapi-plugin-content-manager/admin/src/assets/icons/icon_barred.svg
@@ -0,0 +1 @@
+<svg width="19" height="10" xmlns="http://www.w3.org/2000/svg"><g fill="none" fill-rule="evenodd"><text font-family="Lato-Semibold, Lato" font-size="11" font-weight="500" fill="#41464E" transform="translate(0 -2)"><tspan x="1" y="11">abc</tspan></text><path d="M.5 6.5h18" stroke="#2C3039" stroke-linecap="square"/></g></svg>
\ No newline at end of file
diff --git a/packages/strapi-plugin-content-manager/admin/src/assets/icons/icon_bold.svg b/packages/strapi-plugin-content-manager/admin/src/assets/icons/icon_bold.svg
new file mode 100755
index 0000000000..cee3cf4011
--- /dev/null
+++ b/packages/strapi-plugin-content-manager/admin/src/assets/icons/icon_bold.svg
@@ -0,0 +1 @@
+<svg width="9" height="10" xmlns="http://www.w3.org/2000/svg"><text transform="translate(-12 -10)" fill="#333740" fill-rule="evenodd" font-size="13" font-family="Baskerville-SemiBold, Baskerville" font-weight="500"><tspan x="12" y="20">B</tspan></text></svg>
\ No newline at end of file
diff --git a/packages/strapi-plugin-content-manager/admin/src/assets/icons/icon_bullet-list.svg b/packages/strapi-plugin-content-manager/admin/src/assets/icons/icon_bullet-list.svg
new file mode 100755
index 0000000000..6e060c39f5
--- /dev/null
+++ b/packages/strapi-plugin-content-manager/admin/src/assets/icons/icon_bullet-list.svg
@@ -0,0 +1 @@
+<svg width="13" height="7" xmlns="http://www.w3.org/2000/svg"><g fill="none" fill-rule="evenodd"><path fill="#333740" d="M5 0h8v1H5zM5 2h8v1H5zM5 4h8v1H5zM5 6h8v1H5z"/><rect stroke="#333740" x=".5" y=".5" width="2" height="2" rx="1"/><rect stroke="#333740" x=".5" y="4.5" width="2" height="2" rx="1"/></g></svg>
\ No newline at end of file
diff --git a/packages/strapi-plugin-content-manager/admin/src/assets/icons/icon_code-block.svg b/packages/strapi-plugin-content-manager/admin/src/assets/icons/icon_code-block.svg
new file mode 100755
index 0000000000..a47ca10058
--- /dev/null
+++ b/packages/strapi-plugin-content-manager/admin/src/assets/icons/icon_code-block.svg
@@ -0,0 +1 @@
+<svg width="12" height="8" xmlns="http://www.w3.org/2000/svg"><g fill="#333740" fill-rule="evenodd"><path d="M3.653 7.385a.632.632 0 0 1-.452-.191L.214 4.154a.66.66 0 0 1 0-.922L3.201.19a.632.632 0 0 1 .905 0 .66.66 0 0 1 0 .921l-2.534 2.58 2.534 2.58a.66.66 0 0 1 0 .922.632.632 0 0 1-.453.19zM8.347 7.385a.632.632 0 0 0 .452-.191l2.987-3.04a.66.66 0 0 0 0-.922L8.799.19a.632.632 0 0 0-.905 0 .66.66 0 0 0 0 .921l2.534 2.58-2.534 2.58a.66.66 0 0 0 0 .922c.125.127.289.19.453.19z"/></g></svg>
\ No newline at end of file
diff --git a/packages/strapi-plugin-content-manager/admin/src/assets/icons/icon_italic.svg b/packages/strapi-plugin-content-manager/admin/src/assets/icons/icon_italic.svg
new file mode 100755
index 0000000000..6181979e31
--- /dev/null
+++ b/packages/strapi-plugin-content-manager/admin/src/assets/icons/icon_italic.svg
@@ -0,0 +1 @@
+<svg width="6" height="9" xmlns="http://www.w3.org/2000/svg"><text transform="translate(-13 -11)" fill="#333740" fill-rule="evenodd" font-weight="500" font-size="13" font-family="Baskerville-SemiBoldItalic, Baskerville" font-style="italic"><tspan x="13" y="20">I</tspan></text></svg>
\ No newline at end of file
diff --git a/packages/strapi-plugin-content-manager/admin/src/assets/icons/icon_link.svg b/packages/strapi-plugin-content-manager/admin/src/assets/icons/icon_link.svg
new file mode 100755
index 0000000000..53b6125367
--- /dev/null
+++ b/packages/strapi-plugin-content-manager/admin/src/assets/icons/icon_link.svg
@@ -0,0 +1 @@
+<svg width="12" height="6" xmlns="http://www.w3.org/2000/svg"><g fill="none" fill-rule="evenodd"><path d="M6.063 1.5H6h.063z" fill="#000"/><path d="M9.516 0H8s.813.531.988 1.5h.528c.55 0 .984.434.984.984v1c0 .55-.434 1.016-.984 1.016h-3.5A1.03 1.03 0 0 1 5 3.484V2.5H3.5v.984A2.518 2.518 0 0 0 6.016 6h3.5C10.896 6 12 4.866 12 3.484v-1A2.473 2.473 0 0 0 9.516 0z" fill="#333740"/><path d="M8.3 1.5A2.473 2.473 0 0 0 6.016 0h-3.5C1.134 0 0 1.103 0 2.484v1A2.526 2.526 0 0 0 2.516 6H4s-.806-.531-1.003-1.5h-.481A1.03 1.03 0 0 1 1.5 3.484v-1c0-.55.466-.984 1.016-.984h3.5c.55 0 .984.434.984.984V3.5h1.5V2.484c0-.35-.072-.684-.2-.984z" fill="#333740"/></g></svg>
\ No newline at end of file
diff --git a/packages/strapi-plugin-content-manager/admin/src/assets/icons/icon_media.svg b/packages/strapi-plugin-content-manager/admin/src/assets/icons/icon_media.svg
new file mode 100755
index 0000000000..d7401730c7
--- /dev/null
+++ b/packages/strapi-plugin-content-manager/admin/src/assets/icons/icon_media.svg
@@ -0,0 +1 @@
+<svg width="12" height="11" xmlns="http://www.w3.org/2000/svg"><g fill="#333740" fill-rule="evenodd"><path d="M9 4.286a1.286 1.286 0 1 0 0-2.572 1.286 1.286 0 0 0 0 2.572z"/><path d="M11.25 0H.75C.332 0 0 .34 0 .758v8.77c0 .418.332.758.75.758h10.5c.418 0 .75-.34.75-.758V.758A.752.752 0 0 0 11.25 0zM8.488 5.296a.46.46 0 0 0-.342-.167c-.137 0-.234.065-.343.153l-.501.423c-.105.075-.188.126-.308.126a.443.443 0 0 1-.295-.11 3.5 3.5 0 0 1-.115-.11L5.143 4.054a.59.59 0 0 0-.897.008L.857 8.148V1.171a.353.353 0 0 1 .351-.314h9.581a.34.34 0 0 1 .346.322l.008 6.975-2.655-2.858z"/></g></svg>
\ No newline at end of file
diff --git a/packages/strapi-plugin-content-manager/admin/src/assets/icons/icon_numbered-list.svg b/packages/strapi-plugin-content-manager/admin/src/assets/icons/icon_numbered-list.svg
new file mode 100755
index 0000000000..79c8091f86
--- /dev/null
+++ b/packages/strapi-plugin-content-manager/admin/src/assets/icons/icon_numbered-list.svg
@@ -0,0 +1 @@
+<svg width="12" height="8" xmlns="http://www.w3.org/2000/svg"><g fill="#333740" fill-rule="evenodd"><path d="M2.4 3H.594v-.214h.137c.123 0 .212-.01.266-.032.053-.022.086-.052.1-.092a.67.67 0 0 0 .018-.188V.74a.46.46 0 0 0-.03-.194C1.064.504 1.021.476.955.46A1.437 1.437 0 0 0 .643.435H.539V.23c.332-.035.565-.067.7-.096.135-.03.258-.075.37-.134h.275v2.507c0 .104.023.177.07.218.047.04.14.061.278.061H2.4V3zM2.736 6.695l-.132.528h-.246a.261.261 0 0 0 .015-.074c0-.058-.049-.087-.146-.087H.293v-.198c.258-.173.511-.367.76-.581.25-.215.457-.437.623-.667.166-.23.249-.447.249-.653a.49.49 0 0 0-.321-.478.794.794 0 0 0-.582-.006.482.482 0 0 0-.196.138.284.284 0 0 0-.07.182c0 .074.04.17.12.289.006.008.009.015.009.02 0 .012-.041.03-.123.053l-.19.057a.693.693 0 0 1-.115.03c-.031 0-.067-.038-.108-.114a.516.516 0 0 1 .071-.586.899.899 0 0 1 .405-.238c.18-.058.4-.087.657-.087.317 0 .566.044.749.132.183.087.306.187.37.3a.64.64 0 0 1 .094.312c0 .197-.089.389-.266.575a5.296 5.296 0 0 1-.916.74 62.947 62.947 0 0 1-.62.413h1.843zM4 0h8v1H4zM4 2h8v1H4zM4 4h8v1H4zM4 6h8v1H4z"/></g></svg>
\ No newline at end of file
diff --git a/packages/strapi-plugin-content-manager/admin/src/assets/icons/icon_quote-block.svg b/packages/strapi-plugin-content-manager/admin/src/assets/icons/icon_quote-block.svg
new file mode 100755
index 0000000000..62a7990e92
--- /dev/null
+++ b/packages/strapi-plugin-content-manager/admin/src/assets/icons/icon_quote-block.svg
@@ -0,0 +1 @@
+<svg width="9" height="9" xmlns="http://www.w3.org/2000/svg"><g fill="#333740" fill-rule="evenodd"><path d="M3 0C2.047 0 1.301.263.782.782.263 1.302 0 2.047 0 3v6h3.75V3H1.5c0-.54.115-.93.343-1.157C2.07 1.615 2.46 1.5 3 1.5M8.25 0c-.953 0-1.699.263-2.218.782-.519.52-.782 1.265-.782 2.218v6H9V3H6.75c0-.54.115-.93.343-1.157.227-.228.617-.343 1.157-.343"/></g></svg>
\ No newline at end of file
diff --git a/packages/strapi-plugin-content-manager/admin/src/assets/icons/icon_underline.svg b/packages/strapi-plugin-content-manager/admin/src/assets/icons/icon_underline.svg
new file mode 100755
index 0000000000..7a9b8da4e1
--- /dev/null
+++ b/packages/strapi-plugin-content-manager/admin/src/assets/icons/icon_underline.svg
@@ -0,0 +1 @@
+<svg width="10" height="10" xmlns="http://www.w3.org/2000/svg"><text transform="translate(-10 -11)" fill="#101622" fill-rule="evenodd" font-size="13" font-family="Baskerville-SemiBold, Baskerville" font-weight="500"><tspan x="10" y="20">U</tspan></text></svg>
\ No newline at end of file
diff --git a/packages/strapi-plugin-content-manager/admin/src/components/InputJSON/index.js b/packages/strapi-plugin-content-manager/admin/src/components/InputJSON/index.js
new file mode 100644
index 0000000000..199287766e
--- /dev/null
+++ b/packages/strapi-plugin-content-manager/admin/src/components/InputJSON/index.js
@@ -0,0 +1,201 @@
+/**
+ * 
+ * InputJSON
+ * 
+ */
+
+
+import React from 'react';
+import PropTypes from 'prop-types';
+import cm from 'codemirror';
+import 'codemirror/lib/codemirror.css';
+import 'codemirror/mode/javascript/javascript';
+import 'codemirror/addon/lint/lint';
+import 'codemirror/addon/lint/javascript-lint';
+import 'codemirror/addon/edit/closebrackets';
+import 'codemirror/addon/selection/mark-selection';
+import 'codemirror/theme/liquibyte.css';
+import 'codemirror/theme/xq-dark.css';
+import 'codemirror/theme/3024-day.css';
+import 'codemirror/theme/3024-night.css';
+import 'codemirror/theme/blackboard.css';
+import 'codemirror/theme/monokai.css';
+import 'codemirror/theme/cobalt.css';
+
+import { isEmpty, isObject, trimStart } from 'lodash';
+import jsonlint from './jsonlint';
+import styles from './styles.scss';
+
+const WAIT = 600;
+const stringify = JSON.stringify;
+const parse = JSON.parse;
+const DEFAULT_THEME = 'monokai';
+const THEMES = ['blackboard', 'cobalt', 'monokai', '3024-day', '3024-night', 'liquibyte', 'xq-dark'];
+
+class InputJSON extends React.Component {
+  constructor(props) {
+    super(props);
+    this.editor = React.createRef();
+    this.state = { error: false, markedText: null };
+  }
+
+  componentDidMount() {
+    // Init codemirror component
+    this.codeMirror = cm.fromTextArea(this.editor.current, {
+      autoCloseBrackets: true,
+      lineNumbers: true,
+      matchBrackets: true,
+      mode: 'application/json',
+      smartIndent: true,
+      styleSelectedText: true,
+      tabSize: 2,
+      theme: DEFAULT_THEME,
+    });
+    this.codeMirror.on('change', this.handleChange);
+    this.codeMirror.on('blur', this.handleBlur);
+
+    this.setSize();
+    this.setInitValue();
+  }
+
+  componentDidUpdate(prevProps) {
+    if (isEmpty(prevProps.value) && !isEmpty(this.props.value) && !this.state.hasInitValue) {
+      this.setInitValue();
+    }
+  }
+
+  setInitValue = () => {
+    const { value } = this.props;
+
+    if (isObject(value) && value !== null) {
+      try {
+        parse(stringify(value));
+        this.setState({ hasInitValue: true });
+
+        return this.codeMirror.setValue(stringify(value, null, 2));
+      } catch(err) {
+
+        return this.setState({ error: true });
+      }
+    }
+  }
+
+  setSize = () => this.codeMirror.setSize('100%', 'auto');
+
+  setTheme = (theme) => this.codeMirror.setOption('theme', theme);
+
+  getContentAtLine = (line) => this.codeMirror.getLine(line);
+
+  getEditorOption = (opt) => this.codeMirror.getOption(opt);
+
+  getValue = () => this.codeMirror.getValue();
+
+  markSelection = ({ message }) => {
+    let line = parseInt(
+      message
+        .split(':')[0]
+        .split('line ')[1],
+      10,
+    ) - 1;
+
+    let content = this.getContentAtLine(line);
+
+    if (content === '{') {
+      line = line + 1;
+      content = this.getContentAtLine(line);
+    }
+    const chEnd = content.length;
+    const chStart = chEnd - trimStart(content, ' ').length;
+    const markedText = this.codeMirror.markText({ line, ch: chStart }, { line, ch: chEnd }, { className: styles.colored });
+    this.setState({ markedText });
+  }
+
+  timer = null;
+
+  handleBlur = ({ target }) => {
+    const { name, onBlur } = this.props;
+  
+    if (target === undefined) { // codemirror catches multiple events
+      onBlur({
+        target: {
+          name,
+          type: 'json',
+          value: this.getValue(),
+        },
+      });
+
+    }
+  }
+
+  handleChange = () => {
+    const { hasInitValue } = this.state;
+    const { name, onChange } = this.props;
+    let value = this.codeMirror.getValue();
+
+    try {
+      value = parse(value);
+    } catch(err) {
+      // Silent
+    }
+
+    // Update the parent
+    onChange({
+      target: {
+        name,
+        value,
+        type: 'json',
+      },
+    });
+
+    if (!hasInitValue) {
+      this.setState({ hasInitValue: true });
+    }
+
+    // Remove higlight error
+    if (this.state.markedText) {
+      this.state.markedText.clear();
+      this.setState({ markedText: null, error: null });
+    }
+    
+    clearTimeout(this.timer);
+    this.timer = setTimeout(() => this.testJSON(this.codeMirror.getValue()), WAIT);
+  }
+
+  testJSON = (value) => {
+    try {
+      jsonlint.parse(value);
+    } catch(err) {
+      this.markSelection(err);
+    }
+  }
+
+  render() {
+    if (this.state.error) {
+      return <div>error json</div>;
+    }
+
+    return (
+      <div className={styles.jsonWrapper}>
+        <textarea ref={this.editor} autoComplete='off' defaultValue="" />
+        <select className={styles.select} onChange={({ target }) => this.setTheme(target.value)} defaultValue={DEFAULT_THEME}>
+          {THEMES.sort().map(theme => <option key={theme} value={theme}>{theme}</option>)}
+        </select>
+      </div>
+    );
+  }
+}
+
+InputJSON.defaultProps = {
+  onBlur: () => {},
+  onChange: () => {},
+  value: null,
+};
+
+InputJSON.propTypes = {
+  name: PropTypes.string.isRequired,
+  onBlur: PropTypes.func,
+  onChange: PropTypes.func,
+  value: PropTypes.object,
+};
+
+export default InputJSON;
\ No newline at end of file
diff --git a/packages/strapi-plugin-content-manager/admin/src/components/InputJSON/jsonlint.js b/packages/strapi-plugin-content-manager/admin/src/components/InputJSON/jsonlint.js
new file mode 100644
index 0000000000..7081babde7
--- /dev/null
+++ b/packages/strapi-plugin-content-manager/admin/src/components/InputJSON/jsonlint.js
@@ -0,0 +1,424 @@
+/* Jison generated parser */
+/* eslint-disable */
+var jsonlint = (function(){
+  var parser = {trace: function trace() { },
+  yy: {},
+  symbols_: {"error":2,"JSONString":3,"STRING":4,"JSONNumber":5,"NUMBER":6,"JSONNullLiteral":7,"NULL":8,"JSONBooleanLiteral":9,"TRUE":10,"FALSE":11,"JSONText":12,"JSONValue":13,"EOF":14,"JSONObject":15,"JSONArray":16,"{":17,"}":18,"JSONMemberList":19,"JSONMember":20,":":21,",":22,"[":23,"]":24,"JSONElementList":25,"$accept":0,"$end":1},
+  terminals_: {2:"error",4:"STRING",6:"NUMBER",8:"NULL",10:"TRUE",11:"FALSE",14:"EOF",17:"{",18:"}",21:":",22:",",23:"[",24:"]"},
+  productions_: [0,[3,1],[5,1],[7,1],[9,1],[9,1],[12,2],[13,1],[13,1],[13,1],[13,1],[13,1],[13,1],[15,2],[15,3],[20,3],[19,1],[19,3],[16,2],[16,3],[25,1],[25,3]],
+  performAction: function anonymous(yytext,yyleng,yylineno,yy,yystate,$$,_$) {
+  
+  var $0 = $$.length - 1;
+  switch (yystate) {
+  case 1: // replace escaped characters with actual character
+            this.$ = yytext.replace(/\\(\\|")/g, "$"+"1")
+                       .replace(/\\n/g,'\n')
+                       .replace(/\\r/g,'\r')
+                       .replace(/\\t/g,'\t')
+                       .replace(/\\v/g,'\v')
+                       .replace(/\\f/g,'\f')
+                       .replace(/\\b/g,'\b');
+          
+  break;
+  case 2:this.$ = Number(yytext);
+  break;
+  case 3:this.$ = null;
+  break;
+  case 4:this.$ = true;
+  break;
+  case 5:this.$ = false;
+  break;
+  case 6:return this.$ = $$[$0-1];
+  break;
+  case 13:this.$ = {};
+  break;
+  case 14:this.$ = $$[$0-1];
+  break;
+  case 15:this.$ = [$$[$0-2], $$[$0]];
+  break;
+  case 16:this.$ = {}; this.$[$$[$0][0]] = $$[$0][1];
+  break;
+  case 17:this.$ = $$[$0-2]; $$[$0-2][$$[$0][0]] = $$[$0][1];
+  break;
+  case 18:this.$ = [];
+  break;
+  case 19:this.$ = $$[$0-1];
+  break;
+  case 20:this.$ = [$$[$0]];
+  break;
+  case 21:this.$ = $$[$0-2]; $$[$0-2].push($$[$0]);
+  break;
+  }
+  },
+  table: [{3:5,4:[1,12],5:6,6:[1,13],7:3,8:[1,9],9:4,10:[1,10],11:[1,11],12:1,13:2,15:7,16:8,17:[1,14],23:[1,15]},{1:[3]},{14:[1,16]},{14:[2,7],18:[2,7],22:[2,7],24:[2,7]},{14:[2,8],18:[2,8],22:[2,8],24:[2,8]},{14:[2,9],18:[2,9],22:[2,9],24:[2,9]},{14:[2,10],18:[2,10],22:[2,10],24:[2,10]},{14:[2,11],18:[2,11],22:[2,11],24:[2,11]},{14:[2,12],18:[2,12],22:[2,12],24:[2,12]},{14:[2,3],18:[2,3],22:[2,3],24:[2,3]},{14:[2,4],18:[2,4],22:[2,4],24:[2,4]},{14:[2,5],18:[2,5],22:[2,5],24:[2,5]},{14:[2,1],18:[2,1],21:[2,1],22:[2,1],24:[2,1]},{14:[2,2],18:[2,2],22:[2,2],24:[2,2]},{3:20,4:[1,12],18:[1,17],19:18,20:19},{3:5,4:[1,12],5:6,6:[1,13],7:3,8:[1,9],9:4,10:[1,10],11:[1,11],13:23,15:7,16:8,17:[1,14],23:[1,15],24:[1,21],25:22},{1:[2,6]},{14:[2,13],18:[2,13],22:[2,13],24:[2,13]},{18:[1,24],22:[1,25]},{18:[2,16],22:[2,16]},{21:[1,26]},{14:[2,18],18:[2,18],22:[2,18],24:[2,18]},{22:[1,28],24:[1,27]},{22:[2,20],24:[2,20]},{14:[2,14],18:[2,14],22:[2,14],24:[2,14]},{3:20,4:[1,12],20:29},{3:5,4:[1,12],5:6,6:[1,13],7:3,8:[1,9],9:4,10:[1,10],11:[1,11],13:30,15:7,16:8,17:[1,14],23:[1,15]},{14:[2,19],18:[2,19],22:[2,19],24:[2,19]},{3:5,4:[1,12],5:6,6:[1,13],7:3,8:[1,9],9:4,10:[1,10],11:[1,11],13:31,15:7,16:8,17:[1,14],23:[1,15]},{18:[2,17],22:[2,17]},{18:[2,15],22:[2,15]},{22:[2,21],24:[2,21]}],
+  defaultActions: {16:[2,6]},
+  parseError: function parseError(str, hash) {
+      throw new Error(str);
+  },
+  parse: function parse(input) {
+      var self = this,
+          stack = [0],
+          vstack = [null], // semantic value stack
+          lstack = [], // location stack
+          table = this.table,
+          yytext = '',
+          yylineno = 0,
+          yyleng = 0,
+          recovering = 0,
+          TERROR = 2,
+          EOF = 1;
+  
+      //this.reductionCount = this.shiftCount = 0;
+  
+      this.lexer.setInput(input);
+      this.lexer.yy = this.yy;
+      this.yy.lexer = this.lexer;
+      if (typeof this.lexer.yylloc == 'undefined')
+          this.lexer.yylloc = {};
+      var yyloc = this.lexer.yylloc;
+      lstack.push(yyloc);
+  
+      if (typeof this.yy.parseError === 'function')
+          this.parseError = this.yy.parseError;
+  
+      function popStack (n) {
+          stack.length = stack.length - 2*n;
+          vstack.length = vstack.length - n;
+          lstack.length = lstack.length - n;
+      }
+  
+      function lex() {
+          var token;
+          token = self.lexer.lex() || 1; // $end = 1
+          // if token isn't its numeric value, convert
+          if (typeof token !== 'number') {
+              token = self.symbols_[token] || token;
+          }
+          return token;
+      }
+  
+      var symbol, preErrorSymbol, state, action, a, r, yyval={},p,len,newState, expected;
+      while (true) {
+          // retreive state number from top of stack
+          state = stack[stack.length-1];
+  
+          // use default actions if available
+          if (this.defaultActions[state]) {
+              action = this.defaultActions[state];
+          } else {
+              if (symbol == null)
+                  symbol = lex();
+              // read action for current state and first input
+              action = table[state] && table[state][symbol];
+          }
+  
+          // handle parse error
+          _handle_error:
+          if (typeof action === 'undefined' || !action.length || !action[0]) {
+  
+              if (!recovering) {
+                  // Report error
+                  expected = [];
+                  for (p in table[state]) if (this.terminals_[p] && p > 2) {
+                      expected.push("'"+this.terminals_[p]+"'");
+                  }
+                  var errStr = '';
+                  if (this.lexer.showPosition) {
+                      errStr = 'Parse error on line '+(yylineno+1)+":\n"+this.lexer.showPosition()+"\nExpecting "+expected.join(', ') + ", got '" + this.terminals_[symbol]+ "'";
+                  } else {
+                      errStr = 'Parse error on line '+(yylineno+1)+": Unexpected " +
+                                    (symbol == 1 /*EOF*/ ? "end of input" :
+                                                ("'"+(this.terminals_[symbol] || symbol)+"'"));
+                  }
+                  this.parseError(errStr,
+                      {text: this.lexer.match, token: this.terminals_[symbol] || symbol, line: this.lexer.yylineno, loc: yyloc, expected: expected});
+              }
+  
+              // just recovered from another error
+              if (recovering == 3) {
+                  if (symbol == EOF) {
+                      throw new Error(errStr || 'Parsing halted.');
+                  }
+  
+                  // discard current lookahead and grab another
+                  yyleng = this.lexer.yyleng;
+                  yytext = this.lexer.yytext;
+                  yylineno = this.lexer.yylineno;
+                  yyloc = this.lexer.yylloc;
+                  symbol = lex();
+              }
+  
+              // try to recover from error
+              while (1) {
+                  // check for error recovery rule in this state
+                  if ((TERROR.toString()) in table[state]) {
+                      break;
+                  }
+                  if (state == 0) {
+                      throw new Error(errStr || 'Parsing halted.');
+                  }
+                  popStack(1);
+                  state = stack[stack.length-1];
+              }
+  
+              preErrorSymbol = symbol; // save the lookahead token
+              symbol = TERROR;         // insert generic error symbol as new lookahead
+              state = stack[stack.length-1];
+              action = table[state] && table[state][TERROR];
+              recovering = 3; // allow 3 real symbols to be shifted before reporting a new error
+          }
+  
+          // this shouldn't happen, unless resolve defaults are off
+          if (action[0] instanceof Array && action.length > 1) {
+              throw new Error('Parse Error: multiple actions possible at state: '+state+', token: '+symbol);
+          }
+  
+          switch (action[0]) {
+  
+              case 1: // shift
+                  //this.shiftCount++;
+  
+                  stack.push(symbol);
+                  vstack.push(this.lexer.yytext);
+                  lstack.push(this.lexer.yylloc);
+                  stack.push(action[1]); // push state
+                  symbol = null;
+                  if (!preErrorSymbol) { // normal execution/no error
+                      yyleng = this.lexer.yyleng;
+                      yytext = this.lexer.yytext;
+                      yylineno = this.lexer.yylineno;
+                      yyloc = this.lexer.yylloc;
+                      if (recovering > 0)
+                          recovering--;
+                  } else { // error just occurred, resume old lookahead f/ before error
+                      symbol = preErrorSymbol;
+                      preErrorSymbol = null;
+                  }
+                  break;
+  
+              case 2: // reduce
+                  //this.reductionCount++;
+  
+                  len = this.productions_[action[1]][1];
+  
+                  // perform semantic action
+                  yyval.$ = vstack[vstack.length-len]; // default to $$ = $1
+                  // default location, uses first token for firsts, last for lasts
+                  yyval._$ = {
+                      first_line: lstack[lstack.length-(len||1)].first_line,
+                      last_line: lstack[lstack.length-1].last_line,
+                      first_column: lstack[lstack.length-(len||1)].first_column,
+                      last_column: lstack[lstack.length-1].last_column
+                  };
+                  r = this.performAction.call(yyval, yytext, yyleng, yylineno, this.yy, action[1], vstack, lstack);
+  
+                  if (typeof r !== 'undefined') {
+                      return r;
+                  }
+  
+                  // pop off stack
+                  if (len) {
+                      stack = stack.slice(0,-1*len*2);
+                      vstack = vstack.slice(0, -1*len);
+                      lstack = lstack.slice(0, -1*len);
+                  }
+  
+                  stack.push(this.productions_[action[1]][0]);    // push nonterminal (reduce)
+                  vstack.push(yyval.$);
+                  lstack.push(yyval._$);
+                  // goto new state = table[STATE][NONTERMINAL]
+                  newState = table[stack[stack.length-2]][stack[stack.length-1]];
+                  stack.push(newState);
+                  break;
+  
+              case 3: // accept
+                  return true;
+          }
+  
+      }
+  
+      return true;
+  }};
+  /* Jison generated lexer */
+  var lexer = (function(){
+  var lexer = ({EOF:1,
+  parseError:function parseError(str, hash) {
+          if (this.yy.parseError) {
+              this.yy.parseError(str, hash);
+          } else {
+              throw new Error(str);
+          }
+      },
+  setInput:function (input) {
+          this._input = input;
+          this._more = this._less = this.done = false;
+          this.yylineno = this.yyleng = 0;
+          this.yytext = this.matched = this.match = '';
+          this.conditionStack = ['INITIAL'];
+          this.yylloc = {first_line:1,first_column:0,last_line:1,last_column:0};
+          return this;
+      },
+  input:function () {
+          var ch = this._input[0];
+          this.yytext+=ch;
+          this.yyleng++;
+          this.match+=ch;
+          this.matched+=ch;
+          var lines = ch.match(/\n/);
+          if (lines) this.yylineno++;
+          this._input = this._input.slice(1);
+          return ch;
+      },
+  unput:function (ch) {
+          this._input = ch + this._input;
+          return this;
+      },
+  more:function () {
+          this._more = true;
+          return this;
+      },
+  less:function (n) {
+          this._input = this.match.slice(n) + this._input;
+      },
+  pastInput:function () {
+          var past = this.matched.substr(0, this.matched.length - this.match.length);
+          return (past.length > 20 ? '...':'') + past.substr(-20).replace(/\n/g, "");
+      },
+  upcomingInput:function () {
+          var next = this.match;
+          if (next.length < 20) {
+              next += this._input.substr(0, 20-next.length);
+          }
+          return (next.substr(0,20)+(next.length > 20 ? '...':'')).replace(/\n/g, "");
+      },
+  showPosition:function () {
+          var pre = this.pastInput();
+          var c = new Array(pre.length + 1).join("-");
+          return pre + this.upcomingInput() + "\n" + c+"^";
+      },
+  next:function () {
+          if (this.done) {
+              return this.EOF;
+          }
+          if (!this._input) this.done = true;
+  
+          var token,
+              match,
+              tempMatch,
+              index,
+              col,
+              lines;
+          if (!this._more) {
+              this.yytext = '';
+              this.match = '';
+          }
+          var rules = this._currentRules();
+          for (var i=0;i < rules.length; i++) {
+              tempMatch = this._input.match(this.rules[rules[i]]);
+              if (tempMatch && (!match || tempMatch[0].length > match[0].length)) {
+                  match = tempMatch;
+                  index = i;
+                  if (!this.options.flex) break;
+              }
+          }
+          if (match) {
+              lines = match[0].match(/\n.*/g);
+              if (lines) this.yylineno += lines.length;
+              this.yylloc = {first_line: this.yylloc.last_line,
+                             last_line: this.yylineno+1,
+                             first_column: this.yylloc.last_column,
+                             last_column: lines ? lines[lines.length-1].length-1 : this.yylloc.last_column + match[0].length}
+              this.yytext += match[0];
+              this.match += match[0];
+              this.yyleng = this.yytext.length;
+              this._more = false;
+              this._input = this._input.slice(match[0].length);
+              this.matched += match[0];
+              token = this.performAction.call(this, this.yy, this, rules[index],this.conditionStack[this.conditionStack.length-1]);
+              if (this.done && this._input) this.done = false;
+              if (token) return token;
+              else return;
+          }
+          if (this._input === "") {
+              return this.EOF;
+          } else {
+              this.parseError('Lexical error on line '+(this.yylineno+1)+'. Unrecognized text.\n'+this.showPosition(), 
+                      {text: "", token: null, line: this.yylineno});
+          }
+      },
+  lex:function lex() {
+          var r = this.next();
+          if (typeof r !== 'undefined') {
+              return r;
+          } else {
+              return this.lex();
+          }
+      },
+  begin:function begin(condition) {
+          this.conditionStack.push(condition);
+      },
+  popState:function popState() {
+          return this.conditionStack.pop();
+      },
+  _currentRules:function _currentRules() {
+          return this.conditions[this.conditionStack[this.conditionStack.length-1]].rules;
+      },
+  topState:function () {
+          return this.conditionStack[this.conditionStack.length-2];
+      },
+  pushState:function begin(condition) {
+          this.begin(condition);
+      }});
+  lexer.options = {};
+  lexer.performAction = function anonymous(yy,yy_,$avoiding_name_collisions,YY_START) {
+  
+  var YYSTATE=YY_START
+  switch($avoiding_name_collisions) {
+  case 0:/* skip whitespace */
+  break;
+  case 1:return 6
+  break;
+  case 2:yy_.yytext = yy_.yytext.substr(1,yy_.yyleng-2); return 4
+  break;
+  case 3:return 17
+  break;
+  case 4:return 18
+  break;
+  case 5:return 23
+  break;
+  case 6:return 24
+  break;
+  case 7:return 22
+  break;
+  case 8:return 21
+  break;
+  case 9:return 10
+  break;
+  case 10:return 11
+  break;
+  case 11:return 8
+  break;
+  case 12:return 14
+  break;
+  case 13:return 'INVALID'
+  break;
+  }
+  };
+  lexer.rules = [/^(?:\s+)/,/^(?:(-?([0-9]|[1-9][0-9]+))(\.[0-9]+)?([eE][-+]?[0-9]+)?\b)/,/^(?:"(?:\\[\\"bfnrt/]|\\u[a-fA-F0-9]{4}|[^\\\0-\x09\x0a-\x1f"])*")/,/^(?:\{)/,/^(?:\})/,/^(?:\[)/,/^(?:\])/,/^(?:,)/,/^(?::)/,/^(?:true\b)/,/^(?:false\b)/,/^(?:null\b)/,/^(?:$)/,/^(?:.)/];
+  lexer.conditions = {"INITIAL":{"rules":[0,1,2,3,4,5,6,7,8,9,10,11,12,13],"inclusive":true}};
+  
+  
+  ;
+  return lexer;})()
+  parser.lexer = lexer;
+  return parser;
+  })();
+  if (typeof require !== 'undefined' && typeof exports !== 'undefined') {
+  exports.parser = jsonlint;
+  exports.parse = function () { return jsonlint.parse.apply(jsonlint, arguments); }
+  exports.main = function commonjsMain(args) {
+      if (!args[1]) {
+        throw new Error('Usage: '+args[0]+' FILE');
+      }
+  }
+}
\ No newline at end of file
diff --git a/packages/strapi-plugin-content-manager/admin/src/components/InputJSON/styles.scss b/packages/strapi-plugin-content-manager/admin/src/components/InputJSON/styles.scss
new file mode 100644
index 0000000000..da4a3bdce9
--- /dev/null
+++ b/packages/strapi-plugin-content-manager/admin/src/components/InputJSON/styles.scss
@@ -0,0 +1,40 @@
+.jsonWrapper {
+  position: relative;
+  margin-top: 14px;
+  margin-bottom: -14px;
+  line-height: 18px;
+
+  >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;
+  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;
+  }
+}
+
+.colored {
+  background-color: yellow;
+  color: black !important;
+}
\ No newline at end of file
diff --git a/packages/strapi-plugin-content-manager/admin/src/components/InputJSONWithErrors/index.js b/packages/strapi-plugin-content-manager/admin/src/components/InputJSONWithErrors/index.js
new file mode 100644
index 0000000000..184c74f748
--- /dev/null
+++ b/packages/strapi-plugin-content-manager/admin/src/components/InputJSONWithErrors/index.js
@@ -0,0 +1,227 @@
+/**
+ *
+ * InputJSONWithErrors
+ *
+ */
+
+import React from 'react';
+import PropTypes from 'prop-types';
+import { isEmpty, isFunction } from 'lodash';
+import cn from 'classnames';
+
+// Design
+import Label from 'components/Label';
+import InputDescription from 'components/InputDescription';
+import InputErrors from 'components/InputErrors';
+import InputSpacer from 'components/InputSpacer';
+import InputJSON from 'components/InputJSON';
+
+// Utils
+import validateInput from 'utils/inputsValidations';
+
+import styles from './styles.scss';
+
+class InputJSONWithErrors extends React.Component { // eslint-disable-line react/prefer-stateless-function
+  state = { errors: [], hasInitialValue: false };
+
+  componentDidMount() {
+    const { value, errors } = this.props;
+
+    // Prevent the input from displaying an error when the user enters and leaves without filling it
+    if (!isEmpty(value)) {
+      this.setState({ hasInitialValue: true });
+    }
+
+    // Display input error if it already has some
+    if (!isEmpty(errors)) {
+      this.setState({ errors });
+    }
+  }
+
+  componentDidUpdate(prevProps) {
+    // Show required error if the input's value is received after the compo is mounted
+    if (!isEmpty(this.props.value) && !this.state.hasInitialValue) {
+      this.setInit();
+    }
+
+    // Check if errors have been updated during validations
+    if (prevProps.didCheckErrors !== this.props.didCheckErrors) {
+      // Remove from the state the errors that have already been set
+      const errors = isEmpty(this.props.errors) ? [] : this.props.errors;
+      this.setErrors(errors);
+    }
+  }
+  setErrors = errors => this.setState({ errors });
+
+  setInit = () => this.setState({ hasInitialValue: true });
+
+  /**
+   * Set the errors depending on the validations given to the input
+   * @param  {Object} target
+   */
+  handleBlur = ({ target }) => {
+    // Prevent from displaying error if the input is initially isEmpty
+    if (!isEmpty(target.value) || this.state.hasInitialValue) {
+      const errors = validateInput(target.value, this.props.validations);
+      this.setErrors(errors);
+      this.setInit();
+    }
+  }
+
+  handleChange = (e) => {
+    this.setState({ errors: [] });
+    this.props.onChange(e);
+  }
+
+  render() {
+    const {
+      autoFocus,
+      className,
+      customBootstrapClass,
+      deactivateErrorHighlight,
+      disabled,
+      errorsClassName,
+      errorsStyle,
+      inputClassName,
+      inputDescription,
+      inputDescriptionClassName,
+      inputStyle,
+      label,
+      labelClassName,
+      labelStyle,
+      name,
+      noErrorsDescription,
+      onBlur,
+      placeholder,
+      resetProps,
+      style,
+      tabIndex,
+      value,
+    } = this.props;
+    const handleBlur = isFunction(onBlur) ? onBlur : this.handleBlur;
+
+    let spacer = !isEmpty(inputDescription) ? <InputSpacer /> : <div />;
+
+    if (!noErrorsDescription && !isEmpty(this.state.errors)) {
+      spacer = <div />;
+    }
+
+    return (
+      <div
+        className={cn(
+          styles.containerJSON,
+          customBootstrapClass,
+          !isEmpty(className) && className,
+        )}
+        style={style}
+      >
+        <Label
+          className={labelClassName}
+          htmlFor={name}
+          message={label}
+          style={labelStyle}
+        />
+        <InputJSON
+          autoFocus={autoFocus}
+          className={inputClassName}
+          disabled={disabled}
+          deactivateErrorHighlight={deactivateErrorHighlight}
+          name={name}
+          onBlur={handleBlur}
+          onChange={this.handleChange}
+          placeholder={placeholder}
+          resetProps={resetProps}
+          style={inputStyle}
+          tabIndex={tabIndex}
+          value={value}
+        />
+        <InputDescription
+          className={inputDescriptionClassName}
+          message={inputDescription}
+          style={{ marginTop: '3.2rem'}}
+        />
+        <InputErrors
+          className={errorsClassName}
+          errors={!noErrorsDescription && this.state.errors || []}
+          style={errorsStyle}
+        />
+        {spacer}
+      </div>
+    );
+  }
+}
+
+InputJSONWithErrors.defaultProps = {
+  autoFocus: false,
+  className: '',
+  customBootstrapClass: 'col-md-12',
+  deactivateErrorHighlight: false,
+  didCheckErrors: false,
+  disabled: false,
+  errors: [],
+  errorsClassName: '',
+  errorsStyle: {},
+  inputClassName: '',
+  inputDescription: '',
+  inputDescriptionClassName: '',
+  inputStyle: {},
+  label: '',
+  labelClassName: '',
+  labelStyle: {},
+  noErrorsDescription: false,
+  onBlur: false,
+  placeholder: '',
+  resetProps: false,
+  style: {},
+  tabIndex: '0',
+  validations: {},
+  value: null,
+};
+
+InputJSONWithErrors.propTypes = {
+  autoFocus: PropTypes.bool,
+  className: PropTypes.string,
+  customBootstrapClass: PropTypes.string,
+  deactivateErrorHighlight: PropTypes.bool,
+  didCheckErrors: PropTypes.bool,
+  disabled: PropTypes.bool,
+  errors: PropTypes.array,
+  errorsClassName: PropTypes.string,
+  errorsStyle: PropTypes.object,
+  inputClassName: PropTypes.string,
+  inputDescription: PropTypes.oneOfType([
+    PropTypes.string,
+    PropTypes.func,
+    PropTypes.shape({
+      id: PropTypes.string,
+      params: PropTypes.object,
+    }),
+  ]),
+  inputDescriptionClassName: PropTypes.string,
+  inputStyle: PropTypes.object,
+  label: PropTypes.oneOfType([
+    PropTypes.string,
+    PropTypes.func,
+    PropTypes.shape({
+      id: PropTypes.string,
+      params: PropTypes.object,
+    }),
+  ]),
+  labelClassName: PropTypes.string,
+  labelStyle: PropTypes.object,
+  name: PropTypes.string.isRequired,
+  noErrorsDescription: PropTypes.bool,
+  onBlur: PropTypes.oneOfType([
+    PropTypes.bool,
+    PropTypes.func,
+  ]),
+  onChange: PropTypes.func.isRequired,
+  placeholder: PropTypes.string,
+  resetProps: PropTypes.bool,
+  style: PropTypes.object,
+  tabIndex: PropTypes.string,
+  validations: PropTypes.object,
+  value: PropTypes.object,
+};
+
+export default InputJSONWithErrors;
diff --git a/packages/strapi-plugin-content-manager/admin/src/components/InputJSONWithErrors/styles.scss b/packages/strapi-plugin-content-manager/admin/src/components/InputJSONWithErrors/styles.scss
new file mode 100644
index 0000000000..ee2da47dc1
--- /dev/null
+++ b/packages/strapi-plugin-content-manager/admin/src/components/InputJSONWithErrors/styles.scss
@@ -0,0 +1,5 @@
+.containerJSON {
+  margin-bottom: 1.6rem;
+  font-size: 1.3rem;
+  font-family: 'Lato';
+}
diff --git a/packages/strapi-plugin-content-manager/admin/src/components/Wysiwyg/componentsStyles.scss b/packages/strapi-plugin-content-manager/admin/src/components/Wysiwyg/componentsStyles.scss
new file mode 100644
index 0000000000..8bfa287dfa
--- /dev/null
+++ b/packages/strapi-plugin-content-manager/admin/src/components/Wysiwyg/componentsStyles.scss
@@ -0,0 +1,209 @@
+.editor {
+  max-height: 555px;
+  min-height: 303px;
+  overflow: auto;
+  padding: 20px 20px 0 20px;
+  font-size: 16px;
+  background-color: #fff;
+  line-height: 24px !important;
+  font-family: "OpenSans";
+  cursor: text;
+
+  // TODO define rules for header's margin
+  h1, h2, h3, h4, h5, h6 {
+    margin: 0;
+    line-height: 24px !important;
+    font-family: "OpenSans";
+  }
+
+  h1 {
+    margin-top: 11px !important;
+    font-size: 36px;
+    font-weight: 600;
+  }
+
+  h2 {
+    margin-top: 26px;
+    font-size: 30px;
+    font-weight: 500;
+  }
+
+  h3 {
+    margin-top: 26px;
+    font-size: 24px;
+    font-weight: 500;
+  }
+
+  h4 {
+    margin-top: 26px;
+    font-size: 20px;
+    font-weight: 500;
+  }
+
+  > div {
+    > div {
+      > div {
+        margin-bottom: 32px;
+      }
+    }
+  }
+
+  li {
+    margin-top: 0;
+  }
+
+  ul, ol {
+    padding: 0;
+    margin-top: 27px;
+  }
+
+  ol {
+    padding-left: 20px;
+  }
+
+  // NOTE: we might need this later
+  span {
+    white-space: pre-line;
+  }
+}
+
+h1+.editorParagraph{
+  margin-top: 31px;
+}
+
+.editorParagraph+* {
+  margin-bottom: -2px !important;
+}
+
+.editorParagraph+.editorBlockquote {
+  margin-bottom: 32px !important;
+}
+
+.editorBlockquote+ul {
+  margin-top: 38px !important;
+}
+
+.editorParagraph {
+  color: #333740;
+  margin-top: 27px;
+  margin-bottom: -3px;
+  font-size: 16px;
+  font-weight: 400;
+}
+
+.editorBlockquote {
+  margin-top: 41px;
+  margin-bottom: 34px;
+  font-size: 16px;
+  font-weight: 400;
+  border-left: 5px solid #eee;
+  font-style: italic;
+  padding: 10px 20px;
+}
+
+.unorderedList {
+  padding: 0;
+  margin-left: 18px;
+}
+
+.editorCodeBlock {
+  padding: 16px;
+  margin-top: 26px;
+  padding-bottom: 0;
+  background-color: rgba(0, 0, 0, 0.05);
+  border-radius: 3px;
+
+  span {
+    font-family: Consolas, monospace !important;
+    font-size: 12px;
+    line-height: 16px;
+    white-space: pre;
+  }
+}
+
+.editorFullScreen {
+  max-height: calc(100% - 70px) !important;
+  margin-bottom: 0;
+  overflow: auto;
+}
+
+.editorInput {
+  height: 0;
+  width: 0;
+}
+
+.editorSelect {
+  min-width: 161px;
+  margin-left: 15px;
+  margin-right: 5px;
+  > select {
+    box-shadow: 0 0 0 rgba(0,0,0,0)!important;
+  }
+}
+
+.fullscreenPreviewEditor {
+  margin-top: 9px;
+  padding: 10px 20px;
+}
+
+.previewControlsWrapper {
+  display: flex;
+  height: 49px;
+  width: 100%;
+  padding: 0 17px;
+  justify-content: space-between;
+  background-color: #FAFAFB;
+  line-height: 30px;
+  font-size: 12px;
+  font-family: Lato;
+  background-color: #fff;
+  border-bottom: 1px solid #F3F4F4;
+  line-height: 49px;
+  font-size: 13px;
+  > div:first-child {
+    > span:last-child {
+      font-size: 12px;
+    }
+  }
+  cursor: pointer;
+}
+
+.selectFullscreen {
+  min-width: 115px;
+  margin-left: 15px;
+  > select {
+    min-width: 110px !important;
+    box-shadow: 0 0 0 rgba(0,0,0,0)!important;
+  }
+}
+
+.toggleModeButton {
+  height: 32px;
+  min-width: 32px;
+  padding-left: 10px;
+  padding-right: 10px;
+  border: 1px solid rgba(16,22,34,0.10);
+  border-radius: 3px;
+  background: #F3F4F4;
+  font-size: 13px;
+  font-weight: 500;
+  text-align: center;
+  cursor: pointer;
+  &:focus, &:active {
+    outline: 0;
+  }
+}
+
+.toggleModeWrapper {
+  margin-left: auto;
+  margin-right: 15px;
+  padding-top: 8px;
+}
+
+.wysiwygCollapse {
+  &:after {
+    content: '\f066';
+    font-family: FontAwesome;
+    margin-left: 8px;
+  }
+}
diff --git a/packages/strapi-plugin-content-manager/admin/src/components/Wysiwyg/constants.js b/packages/strapi-plugin-content-manager/admin/src/components/Wysiwyg/constants.js
new file mode 100644
index 0000000000..e24f01b84f
--- /dev/null
+++ b/packages/strapi-plugin-content-manager/admin/src/components/Wysiwyg/constants.js
@@ -0,0 +1,98 @@
+export const SELECT_OPTIONS = [
+  { id: 'components.Wysiwyg.selectOptions.title', value: '' },
+  { id: 'components.Wysiwyg.selectOptions.H1', value: '#' },
+  { id: 'components.Wysiwyg.selectOptions.H2', value: '##' },
+  { id: 'components.Wysiwyg.selectOptions.H3', value: '###' },
+  { id: 'components.Wysiwyg.selectOptions.H4', value: '####' },
+  { id: 'components.Wysiwyg.selectOptions.H5', value: '#####' },
+  { id: 'components.Wysiwyg.selectOptions.H6', value: '######' },
+];
+
+export const CONTROLS = [
+  [
+    {
+      label: 'B',
+      style: 'BOLD',
+      className: 'styleButtonBold',
+      hideLabel: true,
+      handler: 'addContent',
+      text: '**textToReplace**',
+    },
+    {
+      label: 'I',
+      style: 'ITALIC',
+      className: 'styleButtonItalic',
+      hideLabel: true,
+      handler: 'addContent',
+      text: '*textToReplace*',
+    },
+    {
+      label: 'U',
+      style: 'UNDERLINE',
+      className: 'styleButtonUnderline',
+      hideLabel: true,
+      handler: 'addContent',
+      text: '__textToReplace__',
+    },
+    {
+      label: 'S',
+      style: 'STRIKED',
+      className: 'styleButtonStrikedOut',
+      hideLabel: true,
+      handler: 'addContent',
+      text: '~~textToReplace~~',
+    },
+    {
+      label: 'UL',
+      style: 'unordered-list-item',
+      className: 'styleButtonUL',
+      hideLabel: true,
+      handler: 'addUlBlock',
+      text: '- textToReplace',
+    },
+    {
+      label: 'OL',
+      style: 'ordered-list-item',
+      className: 'styleButtonOL',
+      hideLabel: true,
+      handler: 'addOlBlock',
+      text: '1. textToReplace',
+    },
+  ],
+  [
+    {
+      label: '<>',
+      style: 'CODE',
+      className: 'styleButtonCodeBlock',
+      hideLabel: true,
+      handler: 'addSimpleBlockWithSelection',
+      text: '```textToReplace```',
+    },
+    {
+      label: 'img',
+      style: 'IMG',
+      className: 'styleButtonImg',
+      hideLabel: true,
+      handler: 'addSimpleBlockWithSelection',
+      text: '![text](textToReplace)',
+    },
+    {
+      label: 'Link',
+      style: 'LINK',
+      className: 'styleButtonLink',
+      hideLabel: true,
+      handler: 'addContent',
+      text: '[text](textToReplace)',
+    },
+    {
+      label: 'quotes',
+      style: 'BLOCKQUOTE',
+      className: 'styleButtonBlockQuote',
+      hideLabel: true,
+      handler: 'addSimpleBlockWithSelection',
+      text: '> textToReplace',
+    },
+  ],
+];
+
+export const DEFAULT_INDENTATION = '  ';
diff --git a/packages/strapi-plugin-content-manager/admin/src/components/Wysiwyg/converter.js b/packages/strapi-plugin-content-manager/admin/src/components/Wysiwyg/converter.js
new file mode 100644
index 0000000000..a321db39d4
--- /dev/null
+++ b/packages/strapi-plugin-content-manager/admin/src/components/Wysiwyg/converter.js
@@ -0,0 +1,19 @@
+import showdown from 'showdown';
+
+const converterOptions = {
+  backslashEscapesHTMLTags: true,
+  emoji: true,
+  parseImgDimensions: true,
+  simpleLineBreaks: true,
+  simplifiedAutoLink: true,
+  smoothLivePreview: true,
+  splitAdjacentBlockquotes: false,
+  strikethrough: true,
+  tables: true,
+  tasklists: true,
+  underline: true,
+};
+
+const converter = new showdown.Converter(converterOptions);
+
+export default converter;
diff --git a/packages/strapi-plugin-content-manager/admin/src/components/Wysiwyg/customSelect.js b/packages/strapi-plugin-content-manager/admin/src/components/Wysiwyg/customSelect.js
new file mode 100644
index 0000000000..0c28f5ea8c
--- /dev/null
+++ b/packages/strapi-plugin-content-manager/admin/src/components/Wysiwyg/customSelect.js
@@ -0,0 +1,42 @@
+/**
+ *
+ *
+ * CustomSelect
+ *
+ */
+
+import React from 'react';
+import PropTypes from 'prop-types';
+
+import Select from 'components/InputSelect';
+import { SELECT_OPTIONS } from './constants';
+
+import styles from './componentsStyles.scss';
+
+class CustomSelect extends React.Component {
+  render() {
+    const { isPreviewMode, headerValue, isFullscreen, handleChangeSelect } = this.context;
+    const selectClassName = isFullscreen ? styles.selectFullscreen : styles.editorSelect;
+
+    return (
+      <div className={selectClassName}>
+        <Select
+          disabled={isPreviewMode}
+          name="headerSelect"
+          onChange={handleChangeSelect}
+          value={headerValue}
+          selectOptions={SELECT_OPTIONS}
+        />
+      </div>
+    );
+  }
+}
+
+CustomSelect.contextTypes = {
+  handleChangeSelect: PropTypes.func,
+  headerValue: PropTypes.string,
+  isPreviewMode: PropTypes.bool,
+  isFullscreen: PropTypes.bool,
+};
+
+export default CustomSelect;
diff --git a/packages/strapi-plugin-content-manager/admin/src/components/Wysiwyg/helpers.js b/packages/strapi-plugin-content-manager/admin/src/components/Wysiwyg/helpers.js
new file mode 100644
index 0000000000..b1e73a4cf7
--- /dev/null
+++ b/packages/strapi-plugin-content-manager/admin/src/components/Wysiwyg/helpers.js
@@ -0,0 +1,116 @@
+import { trimEnd, trimStart } from 'lodash';
+/**
+ * Override the editor css
+ * @param  {[type]} block [description]
+ * @return {[type]}       [description]
+ */
+
+export function getBlockStyle() {
+  return null;
+}
+
+export function getBlockContent(style) {
+  switch (style) {
+    case 'IMG':
+      return {
+        innerContent: 'link',
+        endReplacer: ')',
+        startReplacer: '![text](',
+      };
+    case 'CODE':
+      return {
+        innerContent: 'code block',
+        endReplacer: '`',
+        startReplacer: '`',
+      };
+    case 'BLOCKQUOTE':
+      return {
+        innerContent: 'quote',
+        endReplacer: '',
+        startReplacer: '> ',
+      };
+    case 'BOLD':
+      return {
+        innerContent: 'bold text',
+        endReplacer: '*',
+        startReplacer: '*',
+      };
+    case 'ITALIC':
+      return {
+        innerContent: 'italic text',
+        endReplacer: '*',
+        startReplacer: '*',
+      };
+    case 'STRIKED':
+      return {
+        innerContent: 'striked out',
+        endReplacer: '~',
+        startReplacer: '~',
+      };
+    case 'UNDERLINE':
+      return {
+        innerContent: 'underlined text',
+        endReplacer: '_',
+        startReplacer: '_',
+      };
+    case 'LINK':
+      return {
+        innerContent: 'link',
+        endReplacer: ')',
+        startReplacer: '[text](',
+      };
+    default:
+      return {
+        innerContent: '',
+        endReplacer: '',
+        startReplacer: '',
+      };
+  }
+}
+
+export const getDefaultSelectionOffsets = (
+  content,
+  startReplacer,
+  endReplacer,
+  initPosition = 0,
+) => ({
+  anchorOffset: initPosition + content.length - trimStart(content, startReplacer).length,
+  focusOffset: initPosition + trimEnd(content, endReplacer).length,
+});
+
+/**
+ * Get the start and end offset
+ * @param  {Object} selection
+ * @return {Object}
+ */
+export function getOffSets(selection) {
+  return {
+    end: selection.getEndOffset(),
+    start: selection.getStartOffset(),
+  };
+}
+
+export function getKeyCommandData(command) {
+  let content;
+  let style;
+
+  switch (command) {
+    case 'bold':
+      content = '**textToReplace**';
+      style = 'BOLD';
+      break;
+    case 'italic':
+      content = '*textToReplace*';
+      style = 'ITALIC';
+      break;
+    case 'underline':
+      content = '__textToReplace__';
+      style = 'UNDERLINE';
+      break;
+    default:
+      content = '';
+      style = '';
+  }
+
+  return { content, style };
+}
diff --git a/packages/strapi-plugin-content-manager/admin/src/components/Wysiwyg/image.js b/packages/strapi-plugin-content-manager/admin/src/components/Wysiwyg/image.js
new file mode 100644
index 0000000000..5ffddb180b
--- /dev/null
+++ b/packages/strapi-plugin-content-manager/admin/src/components/Wysiwyg/image.js
@@ -0,0 +1,22 @@
+/**
+ *
+ * Image
+ *
+ */
+
+
+import React from 'react';
+import PropTypes from 'prop-types';
+
+const Image = props => {
+  const { alt, height, src, width } = props.contentState.getEntity(props.entityKey).getData();
+
+  return <img alt={alt} src={src} height={height} width={width} style={{ maxWidth: '100%' }} />;
+};
+
+Image.propTypes = {
+  contentState: PropTypes.object.isRequired,
+  entityKey: PropTypes.string.isRequired,
+};
+
+export default Image;
diff --git a/packages/strapi-plugin-content-manager/admin/src/components/Wysiwyg/index.js b/packages/strapi-plugin-content-manager/admin/src/components/Wysiwyg/index.js
new file mode 100644
index 0000000000..eeead5e30c
--- /dev/null
+++ b/packages/strapi-plugin-content-manager/admin/src/components/Wysiwyg/index.js
@@ -0,0 +1,792 @@
+/**
+ *
+ * Wysiwyg
+ *
+ */
+import React from 'react';
+import {
+  ContentState,
+  EditorState,
+  getDefaultKeyBinding,
+  genKey,
+  Modifier,
+  RichUtils,
+  SelectionState,
+} from 'draft-js';
+import PropTypes from 'prop-types';
+import { isEmpty, isNaN, replace, words } from 'lodash';
+import cn from 'classnames';
+import Controls from 'components/WysiwygInlineControls';
+import Drop from 'components/WysiwygDropUpload';
+import WysiwygBottomControls from 'components/WysiwygBottomControls';
+import WysiwygEditor from 'components/WysiwygEditor';
+import request from 'utils/request';
+import CustomSelect from './customSelect';
+import PreviewControl from './previewControl';
+import PreviewWysiwyg from './previewWysiwyg';
+import ToggleMode from './toggleMode';
+import { CONTROLS } from './constants';
+import {
+  getBlockContent,
+  getBlockStyle,
+  getDefaultSelectionOffsets,
+  getKeyCommandData,
+  getOffSets,
+} from './helpers';
+import {
+  createNewBlock,
+  getNextBlocksList,
+  getSelectedBlocksList,
+  onTab,
+  updateSelection,
+} from './utils';
+import styles from './styles.scss';
+
+/* eslint-disable react/jsx-handler-names */
+/* eslint-disable react/sort-comp */
+class Wysiwyg extends React.Component {
+  constructor(props) {
+    super(props);
+    this.state = {
+      editorState: EditorState.createEmpty(),
+      isDraging: false,
+      isFocused: false,
+      isFullscreen: false,
+      isPreviewMode: false,
+      headerValue: '',
+    };
+    this.focus = () => {
+      this.setState({ isFocused: true });
+      return this.domEditor.focus();
+    };
+    this.blur = () => {
+      this.setState({ isFocused: false });
+      return this.domEditor.blur();
+    };
+  }
+
+  getChildContext = () => ({
+    handleChangeSelect: this.handleChangeSelect,
+    headerValue: this.state.headerValue,
+    html: this.props.value,
+    isPreviewMode: this.state.isPreviewMode,
+    isFullscreen: this.state.isFullscreen,
+    placeholder: this.props.placeholder,
+  });
+
+  componentDidMount() {
+    if (this.props.autoFocus) {
+      this.focus();
+    }
+
+    if (!isEmpty(this.props.value)) {
+      this.setInitialValue(this.props);
+    }
+  }
+
+  shouldComponentUpdate(nextProps, nextState) {
+    if (nextState.editorState !== this.state.editorState) {
+      return true;
+    }
+
+    if (nextProps.resetProps !== this.props.resetProps) {
+      return true;
+    }
+
+    if (nextState.isDraging !== this.state.isDraging) {
+      return true;
+    }
+
+    if (nextState.isFocused !== this.state.isFocused) {
+      return true;
+    }
+
+    if (nextState.isFullscreen !== this.state.isFullscreen) {
+      return true;
+    }
+
+    if (nextState.isPreviewMode !== this.state.isPreviewMode) {
+      return true;
+    }
+
+    if (nextState.headerValue !== this.state.headerValue) {
+      return true;
+    }
+
+    return false;
+  }
+
+  componentDidUpdate(prevProps) {
+    // Handle resetProps
+    if (prevProps.resetProps !== this.props.resetProps) {
+      this.setInitialValue(this.props);
+    }
+  }
+
+  /**
+   * Init the editor with data from
+   * @param {[type]} props [description]
+   */
+  setInitialValue = props => {
+    const contentState = ContentState.createFromText(props.value);
+    const newEditorState = EditorState.createWithContent(contentState);
+    const editorState = this.state.isFocused
+      ? EditorState.moveFocusToEnd(newEditorState)
+      : newEditorState;
+    return this.setState({ editorState });
+  };
+
+  /**
+   * Handler to add B, I, Strike, U, link
+   * @param {String} content usually something like **textToReplace**
+   * @param {String} style
+   */
+  addContent = (content, style) => {
+    const selectedText = this.getSelectedText();
+    // Retrieve the associated data for the type to add
+    const { innerContent, endReplacer, startReplacer } = getBlockContent(style);
+    // Replace the selected text by the markdown command or insert default text
+    const defaultContent =
+      selectedText === ''
+        ? replace(content, 'textToReplace', innerContent)
+        : replace(content, 'textToReplace', selectedText);
+    // Get the current cursor position
+    const cursorPosition = getOffSets(this.getSelection()).start;
+    const textWithEntity = this.modifyBlockContent(defaultContent);
+    // Highlight the text
+    const { anchorOffset, focusOffset } = getDefaultSelectionOffsets(
+      defaultContent,
+      startReplacer,
+      endReplacer,
+      cursorPosition,
+    );
+    // Merge the current selection with the new one
+    const updatedSelection = this.getSelection().merge({ anchorOffset, focusOffset });
+    const newEditorState = EditorState.push(
+      this.getEditorState(),
+      textWithEntity,
+      'insert-character',
+    );
+    // Update the parent reducer
+    this.sendData(newEditorState);
+    // Don't handle selection : the user has selected some text to be changed with the appropriate markdown
+    if (selectedText !== '') {
+      return this.setState(
+        {
+          // Move the cursor to the end (this line forces the cursor to be at the end of the content)
+          // It may go at the end of the last block
+          editorState: EditorState.moveFocusToEnd(newEditorState),
+        },
+        () => {
+          this.focus();
+        },
+      );
+    }
+
+    return this.setState({
+      // Highlight the text if the selection wad empty
+      editorState: EditorState.forceSelection(newEditorState, updatedSelection),
+    });
+  };
+
+  /**
+   * Create an ordered list block
+   * @return ContentBlock
+   */
+  addOlBlock = () => {
+    // Get all the selected blocks
+    const selectedBlocksList = getSelectedBlocksList(this.getEditorState());
+    let newEditorState = this.getEditorState();
+
+    // Check if the cursor is NOT at the beginning of a new line
+    // So we need to move all the next blocks
+    if (getOffSets(this.getSelection()).start !== 0) {
+      // Retrieve all the blocks after the current position
+      const nextBlocks = getNextBlocksList(newEditorState, this.getSelection().getStartKey());
+      let liNumber = 1;
+
+      // Loop to update each block after the inserted li
+      nextBlocks.map((block, index) => {
+        const previousContent =
+          index === 0
+            ? this.getEditorState()
+              .getCurrentContent()
+              .getBlockForKey(this.getCurrentAnchorKey())
+            : newEditorState.getCurrentContent().getBlockBefore(block.getKey());
+        // Check if there was an li before the position so we update the entire list bullets
+        const number = previousContent ? parseInt(previousContent.getText().split('.')[0], 10) : 0;
+        liNumber = isNaN(number) ? 1 : number + 1;
+        const nextBlockText = index === 0 ? `${liNumber}. ` : nextBlocks.get(index - 1).getText();
+        // Update the current block
+        const newBlock = createNewBlock(nextBlockText, 'block-list', block.getKey());
+        // Update the contentState
+        const newContentState = this.createNewContentStateFromBlock(
+          newBlock,
+          newEditorState.getCurrentContent(),
+        );
+        newEditorState = EditorState.push(newEditorState, newContentState);
+      });
+
+      // Move the cursor to the correct position and add a space after '.'
+      // 2 for the dot and the space after, we add the number length (10 = offset of 2)
+      const offset = 2 + liNumber.toString().length;
+      const updatedSelection = updateSelection(this.getSelection(), nextBlocks, offset);
+
+      return this.setState({
+        editorState: EditorState.acceptSelection(newEditorState, updatedSelection),
+      });
+    }
+
+    // If the cursor is at the beginning we need to move all the content after the cursor so we don't loose the data
+    selectedBlocksList.map((block, i) => {
+      const selectedText = block.getText();
+      const li = selectedText === '' ? `${i + 1}. ` : `${i + 1}. ${selectedText}`;
+      const newBlock = createNewBlock(li, 'block-list', block.getKey());
+      const newContentState = this.createNewContentStateFromBlock(
+        newBlock,
+        newEditorState.getCurrentContent(),
+      );
+      newEditorState = EditorState.push(newEditorState, newContentState);
+    });
+
+    // Update the parent reducer
+    this.sendData(newEditorState);
+
+    return this.setState({ editorState: EditorState.moveFocusToEnd(newEditorState) });
+  };
+
+  /**
+   * Create an unordered list
+   * @return ContentBlock
+   */
+  // NOTE: it's pretty much the same dynamic as above
+  // We don't use the same handler because it needs less logic than a ordered list
+  // so it's easier to maintain the code
+  addUlBlock = () => {
+    const selectedBlocksList = getSelectedBlocksList(this.getEditorState());
+    let newEditorState = this.getEditorState();
+
+    if (getOffSets(this.getSelection()).start !== 0) {
+      const nextBlocks = getNextBlocksList(newEditorState, this.getSelection().getStartKey());
+
+      nextBlocks.map((block, index) => {
+        const nextBlockText = index === 0 ? '- ' : nextBlocks.get(index - 1).getText();
+        const newBlock = createNewBlock(nextBlockText, 'block-list', block.getKey());
+        const newContentState = this.createNewContentStateFromBlock(
+          newBlock,
+          newEditorState.getCurrentContent(),
+        );
+        newEditorState = EditorState.push(newEditorState, newContentState);
+      });
+      const updatedSelection = updateSelection(this.getSelection(), nextBlocks, 2);
+
+      return this.setState({
+        editorState: EditorState.acceptSelection(newEditorState, updatedSelection),
+      });
+    }
+
+    selectedBlocksList.map(block => {
+      const selectedText = block.getText();
+      const li = selectedText === '' ? '- ' : `- ${selectedText}`;
+      const newBlock = createNewBlock(li, 'block-list', block.getKey());
+      const newContentState = this.createNewContentStateFromBlock(
+        newBlock,
+        newEditorState.getCurrentContent(),
+      );
+      newEditorState = EditorState.push(newEditorState, newContentState);
+    });
+    this.sendData(newEditorState);
+    return this.setState({ editorState: EditorState.moveFocusToEnd(newEditorState) });
+  };
+
+  /**
+   * Handler to create header
+   * @param {String} text header content
+   */
+  addBlock = text => {
+    const nextBlockKey = this.getNextBlockKey(this.getCurrentAnchorKey()) || genKey();
+    const newBlock = createNewBlock(text, 'header', nextBlockKey);
+    const newContentState = this.createNewContentStateFromBlock(newBlock);
+    const newEditorState = this.createNewEditorState(newContentState, text);
+
+    return this.setState({ editorState: EditorState.moveFocusToEnd(newEditorState) });
+  };
+
+  /**
+   * Handler used for code block and Img controls
+   * @param {String} content the text that will be added
+   * @param {String} style   the type
+   */
+  addSimpleBlockWithSelection = (content, style) => {
+    const selectedText = this.getSelectedText();
+    const { innerContent, endReplacer, startReplacer } = getBlockContent(style);
+    const defaultContent =
+      selectedText === ''
+        ? replace(content, 'textToReplace', innerContent)
+        : replace(content, 'textToReplace', selectedText);
+    const newBlock = createNewBlock(defaultContent);
+    const newContentState = this.createNewContentStateFromBlock(newBlock);
+    const { anchorOffset, focusOffset } = getDefaultSelectionOffsets(
+      defaultContent,
+      startReplacer,
+      endReplacer,
+    );
+    let newEditorState = this.createNewEditorState(newContentState, defaultContent);
+    const updatedSelection =
+      getOffSets(this.getSelection()).start === 0
+        ? this.getSelection().merge({ anchorOffset, focusOffset })
+        : new SelectionState({
+          anchorKey: newBlock.getKey(),
+          anchorOffset,
+          focusOffset,
+          focusKey: newBlock.getKey(),
+          isBackward: false,
+        });
+
+    newEditorState = EditorState.acceptSelection(newEditorState, updatedSelection);
+
+    return this.setState({
+      editorState: EditorState.forceSelection(newEditorState, newEditorState.getSelection()),
+    });
+  };
+
+  /**
+   * Update the current editorState
+   * @param  {Map} newContentState
+   * @param  {String} text            The text to add
+   * @return {Map}                 EditorState
+   */
+  createNewEditorState = (newContentState, text) => {
+    let newEditorState;
+
+    if (getOffSets(this.getSelection()).start !== 0) {
+      newEditorState = EditorState.push(this.getEditorState(), newContentState);
+    } else {
+      const textWithEntity = this.modifyBlockContent(text);
+      newEditorState = EditorState.push(this.getEditorState(), textWithEntity, 'insert-characters');
+    }
+    return newEditorState;
+  };
+
+  /**
+   * Update the content of a block
+   * @param  {Map} newBlock     The new block
+   * @param  {Map} contentState The ContentState
+   * @return {Map}              The updated block
+   */
+  createNewBlockMap = (newBlock, contentState) =>
+    contentState.getBlockMap().set(newBlock.key, newBlock);
+
+  createNewContentStateFromBlock = (
+    newBlock,
+    contentState = this.getEditorState().getCurrentContent(),
+  ) =>
+    ContentState.createFromBlockArray(this.createNewBlockMap(newBlock, contentState).toArray())
+      .set('selectionBefore', contentState.getSelectionBefore())
+      .set('selectionAfter', contentState.getSelectionAfter());
+
+  getCharactersNumber = (editorState = this.getEditorState()) => {
+    const plainText = editorState.getCurrentContent().getPlainText();
+    const spacesNumber = plainText.split(' ').length;
+
+    return words(plainText).join('').length + spacesNumber - 1;
+  };
+
+  getEditorState = () => this.state.editorState;
+
+  /**
+   * Retrieve the selected text
+   * @return {Map}
+   */
+  getSelection = () => this.getEditorState().getSelection();
+
+  /**
+   * Retrieve the cursor anchor key
+   * @return {String}
+   */
+  getCurrentAnchorKey = () => this.getSelection().getAnchorKey();
+
+  /**
+   * Retrieve the current content block
+   * @return {Map} ContentBlock
+   */
+  getCurrentContentBlock = () =>
+    this.getEditorState()
+      .getCurrentContent()
+      .getBlockForKey(this.getSelection().getAnchorKey());
+
+  /**
+   * Retrieve the block key after a specific one
+   * @param  {String} currentBlockKey
+   * @param  {Map} [editorState=this.getEditorState()]  The current EditorState or the updated one
+   * @return {String}                                    The next block key
+   */
+  getNextBlockKey = (currentBlockKey, editorState = this.getEditorState()) =>
+    editorState.getCurrentContent().getKeyAfter(currentBlockKey);
+
+  getSelectedText = ({ start, end } = getOffSets(this.getSelection())) =>
+    this.getCurrentContentBlock()
+      .getText()
+      .slice(start, end);
+
+  handleBlur = () => {
+    const target = {
+      name: this.props.name,
+      type: 'textarea',
+      value: this.getEditorState()
+        .getCurrentContent()
+        .getPlainText(),
+    };
+    this.props.onBlur({ target });
+    this.blur();
+  };
+
+  handleChangeSelect = ({ target }) => {
+    this.setState({ headerValue: target.value });
+    const selectedText = this.getSelectedText();
+    const title = selectedText === '' ? `${target.value} ` : `${target.value} ${selectedText}`;
+    this.addBlock(title);
+
+    return this.setState({ headerValue: '' });
+  };
+
+  handleClickPreview = () => this.setState({ isPreviewMode: !this.state.isPreviewMode });
+
+  handleDragEnter = e => {
+    e.preventDefault();
+    e.stopPropagation();
+
+    if (!this.state.isDraging) {
+      this.setState({ isDraging: true });
+    }
+  };
+
+  handleDragLeave = () => this.setState({ isDraging: false });
+
+  handleDragOver = e => {
+    e.preventDefault();
+    e.stopPropagation();
+  };
+
+  handleDrop = e => {
+    e.preventDefault();
+
+    if (this.state.isPreviewMode) {
+      return this.setState({ isDraging: false });
+    }
+
+    const files = e.dataTransfer ? e.dataTransfer.files : e.target.files;
+    return this.uploadFile(files);
+  };
+
+  /**
+   * Handler that listens for specific key commands
+   * @param  {String} command
+   * @param  {Map} editorState
+   * @return {Bool}
+   */
+  handleKeyCommand = (command, editorState) => {
+    const newState = RichUtils.handleKeyCommand(editorState, command);
+
+    if (command === 'bold' || command === 'italic' || command === 'underline') {
+      const { content, style } = getKeyCommandData(command);
+      this.addContent(content, style);
+      return false;
+    }
+
+    if (newState && command !== 'backspace') {
+      this.onChange(newState);
+      return true;
+    }
+
+    return false;
+  };
+
+  /**
+   * Handler to upload files on paste
+   * @param  {Array<Blob>} files [description]
+   * @return {}                  DraftHandleValue
+   */
+  handlePastedFiles = files => this.uploadFile(files);
+
+  handleReturn = (e, editorState) => {
+    const selection = editorState.getSelection();
+    const currentBlock = editorState.getCurrentContent().getBlockForKey(selection.getStartKey());
+
+    if (currentBlock.getText().split('')[0] === '-') {
+      this.addUlBlock();
+      return true;
+    }
+
+    if (
+      currentBlock.getText().split('.').length > 1 &&
+      !isNaN(parseInt(currentBlock.getText().split('.')[0], 10))
+    ) {
+      this.addOlBlock();
+      return true;
+    }
+
+    return false;
+  };
+
+  mapKeyToEditorCommand = e => {
+    if (e.keyCode === 9 /* TAB */) {
+      const newEditorState = RichUtils.onTab(e, this.state.editorState, 4 /* maxDepth */);
+      if (newEditorState !== this.state.editorState) {
+        this.onChange(newEditorState);
+      }
+      return;
+    }
+
+    return getDefaultKeyBinding(e);
+  };
+
+  /**
+   * Change the content of a block
+   * @param  {String]} text
+   * @param  {Map} [contentState=this.getEditorState().getCurrentContent()]
+   * @return {Map}
+   */
+  modifyBlockContent = (text, contentState = this.getEditorState().getCurrentContent()) =>
+    Modifier.replaceText(contentState, this.getSelection(), text);
+
+  onChange = editorState => {
+    this.setState({ editorState });
+    this.sendData(editorState);
+  };
+
+  handleTab = e => {
+    e.preventDefault();
+    const newEditorState = onTab(this.getEditorState());
+
+    return this.onChange(newEditorState);
+  };
+
+  /**
+   * Update the parent reducer
+   * @param  {Map} editorState [description]
+   */
+  sendData = editorState => {
+    if (this.getEditorState().getCurrentContent() === editorState.getCurrentContent())
+      return;
+
+    this.props.onChange({
+      target: {
+        value: editorState.getCurrentContent().getPlainText(),
+        name: this.props.name,
+        type: 'textarea',
+      },
+    });
+  }
+
+  toggleFullScreen = e => {
+    e.preventDefault();
+    this.setState({
+      isFullscreen: !this.state.isFullscreen,
+      isPreviewMode: false,
+    });
+  };
+
+  uploadFile = files => {
+    const formData = new FormData();
+    formData.append('files', files[0]);
+    const headers = {
+      'X-Forwarded-Host': 'strapi',
+    };
+
+    let newEditorState = this.getEditorState();
+
+    const nextBlocks = getNextBlocksList(newEditorState, this.getSelection().getStartKey());
+    // Loop to update each block after the inserted li
+    nextBlocks.map((block, index) => {
+      // Update the current block
+      const nextBlockText = index === 0 ? `![Uploading ${files[0].name}]()` : nextBlocks.get(index - 1).getText();
+      const newBlock = createNewBlock(nextBlockText, 'unstyled', block.getKey());
+      // Update the contentState
+      const newContentState = this.createNewContentStateFromBlock(
+        newBlock,
+        newEditorState.getCurrentContent(),
+      );
+      newEditorState = EditorState.push(newEditorState, newContentState);
+    });
+
+    const offset = `![Uploading ${files[0].name}]()`.length;
+    const updatedSelection = updateSelection(this.getSelection(), nextBlocks, offset);
+    this.setState({ editorState: EditorState.acceptSelection(newEditorState, updatedSelection) });
+
+    return request('/upload', { method: 'POST', headers, body: formData }, false, false)
+      .then(response => {
+        const nextBlockKey = newEditorState
+          .getCurrentContent()
+          .getKeyAfter(newEditorState.getSelection().getStartKey());
+        const content = `![text](${response[0].url})`;
+        const newContentState = this.createNewContentStateFromBlock(
+          createNewBlock(content, 'unstyled', nextBlockKey),
+        );
+
+        newEditorState = EditorState.push(newEditorState, newContentState);
+        const updatedSelection = updateSelection(this.getSelection(), nextBlocks, 2);
+
+        this.setState({ editorState: EditorState.acceptSelection(newEditorState, updatedSelection) });
+        this.sendData(newEditorState);
+      })
+      .catch(() => {
+        this.setState({ editorState: EditorState.undo(this.getEditorState()) });
+      })
+      .finally(() => {
+        this.setState({ isDraging: false });
+      });
+  };
+
+  renderDrop = () => (
+    <Drop
+      onDrop={this.handleDrop}
+      onDragOver={this.handleDragOver}
+      onDragLeave={this.handleDragLeave}
+    />
+  );
+
+  render() {
+    const { editorState, isPreviewMode, isFullscreen } = this.state;
+    const editorStyle = isFullscreen ? { marginTop: '0' } : this.props.style;
+
+    return (
+      <div className={cn(isFullscreen && styles.fullscreenOverlay)}>
+        {/* FIRST EDITOR WITH CONTROLS} */}
+        <div
+          className={cn(
+            styles.editorWrapper,
+            !this.props.deactivateErrorHighlight && this.props.error && styles.editorError,
+            !isEmpty(this.props.className) && this.props.className,
+          )}
+          onClick={e => {
+            if (isFullscreen) {
+              e.preventDefault();
+              e.stopPropagation();
+            }
+          }}
+          onDragEnter={this.handleDragEnter}
+          onDragOver={this.handleDragOver}
+          style={editorStyle}
+        >
+          {this.state.isDraging && this.renderDrop()}
+          <div className={styles.controlsContainer}>
+            <CustomSelect />
+            {CONTROLS.map((value, key) => (
+              <Controls
+                key={key}
+                buttons={value}
+                disabled={isPreviewMode}
+                editorState={editorState}
+                handlers={{
+                  addContent: this.addContent,
+                  addOlBlock: this.addOlBlock,
+                  addSimpleBlockWithSelection: this.addSimpleBlockWithSelection,
+                  addUlBlock: this.addUlBlock,
+                }}
+                onToggle={this.toggleInlineStyle}
+                onToggleBlock={this.toggleBlockType}
+              />
+            ))}
+            {!isFullscreen ? (
+              <ToggleMode isPreviewMode={isPreviewMode} onClick={this.handleClickPreview} />
+            ) : (
+              <div style={{ marginRight: '10px' }} />
+            )}
+          </div>
+          {/* WYSIWYG PREVIEW NOT FULLSCREEN */}
+          {isPreviewMode ? (
+            <PreviewWysiwyg data={this.props.value} />
+          ) : (
+            <div
+              className={cn(styles.editor, isFullscreen && styles.editorFullScreen)}
+              onClick={this.focus}
+            >
+              <WysiwygEditor
+                blockStyleFn={getBlockStyle}
+                editorState={editorState}
+                handleKeyCommand={this.handleKeyCommand}
+                handlePastedFiles={this.handlePastedFiles}
+                handleReturn={this.handleReturn}
+                keyBindingFn={this.mapKeyToEditorCommand}
+                onBlur={this.handleBlur}
+                onChange={this.onChange}
+                onTab={this.handleTab}
+                placeholder={this.props.placeholder}
+                setRef={editor => (this.domEditor = editor)}
+                stripPastedStyles
+                tabIndex={this.props.tabIndex}
+              />
+              <input className={styles.editorInput} value="" tabIndex="-1" />
+            </div>
+          )}
+          {!isFullscreen && (
+            <WysiwygBottomControls
+              isPreviewMode={isPreviewMode}
+              onClick={this.toggleFullScreen}
+              onChange={this.handleDrop}
+            />
+          )}
+        </div>
+        {/* PREVIEW WYSIWYG FULLSCREEN */}
+        {isFullscreen && (
+          <div
+            className={cn(styles.editorWrapper)}
+            onClick={e => {
+              e.preventDefault();
+              e.stopPropagation();
+            }}
+            style={{ marginTop: '0' }}
+          >
+            <PreviewControl
+              onClick={this.toggleFullScreen}
+              characters={this.getCharactersNumber()}
+            />
+            <PreviewWysiwyg data={this.props.value} />
+          </div>
+        )}
+      </div>
+    );
+  }
+}
+
+Wysiwyg.childContextTypes = {
+  handleChangeSelect: PropTypes.func,
+  headerValue: PropTypes.string,
+  html: PropTypes.string,
+  isFullscreen: PropTypes.bool,
+  isPreviewMode: PropTypes.bool,
+  placeholder: PropTypes.string,
+  previewHTML: PropTypes.func,
+};
+
+Wysiwyg.defaultProps = {
+  autoFocus: false,
+  className: '',
+  deactivateErrorHighlight: false,
+  error: false,
+  onBlur: () => {},
+  onChange: () => {},
+  placeholder: '',
+  resetProps: false,
+  style: {},
+  tabIndex: '0',
+  value: '',
+};
+
+Wysiwyg.propTypes = {
+  autoFocus: PropTypes.bool,
+  className: PropTypes.string,
+  deactivateErrorHighlight: PropTypes.bool,
+  error: PropTypes.bool,
+  name: PropTypes.string.isRequired,
+  onBlur: PropTypes.func,
+  onChange: PropTypes.func,
+  placeholder: PropTypes.string,
+  resetProps: PropTypes.bool,
+  style: PropTypes.object,
+  tabIndex: PropTypes.string,
+  value: PropTypes.string,
+};
+
+export default Wysiwyg;
diff --git a/packages/strapi-plugin-content-manager/admin/src/components/Wysiwyg/link.js b/packages/strapi-plugin-content-manager/admin/src/components/Wysiwyg/link.js
new file mode 100644
index 0000000000..4205cad294
--- /dev/null
+++ b/packages/strapi-plugin-content-manager/admin/src/components/Wysiwyg/link.js
@@ -0,0 +1,45 @@
+/**
+ *
+ * Link
+ *
+ */
+
+import React from 'react';
+import PropTypes from 'prop-types';
+import { includes } from 'lodash';
+
+const Link = props => {
+  const { url, aHref, aInnerHTML } = props.contentState.getEntity(props.entityKey).getData();
+  let content = aInnerHTML;
+
+  if (includes(aInnerHTML, '<img', 'src=')) {
+    const src = aInnerHTML.split('src="')[1].split('" ')[0];
+    const width = includes(aInnerHTML, 'width=') ? aInnerHTML.split('width="')[1].split('" ')[0] : '';
+    const height = includes(aInnerHTML, 'height=') ? aInnerHTML.split('height="')[1].split('" ')[0] : '';
+    content = <img src={src} alt="img" width={width} height={height} style={{ marginTop: '27px', maxWidth: '100%' }} />;
+  }
+
+  return (
+    <a
+      href={url || aHref}
+      onClick={() => {
+        window.open(url || aHref, '_blank');
+      }}
+      style={{ cursor: 'pointer' }}
+    >
+      {content || props.children}
+    </a>
+  );
+};
+
+Link.defaultProps = {
+  children: '',
+};
+
+Link.propTypes = {
+  children: PropTypes.node,
+  contentState: PropTypes.object.isRequired,
+  entityKey: PropTypes.string.isRequired,
+};
+
+export default Link;
diff --git a/packages/strapi-plugin-content-manager/admin/src/components/Wysiwyg/previewControl.js b/packages/strapi-plugin-content-manager/admin/src/components/Wysiwyg/previewControl.js
new file mode 100644
index 0000000000..f05e582bd2
--- /dev/null
+++ b/packages/strapi-plugin-content-manager/admin/src/components/Wysiwyg/previewControl.js
@@ -0,0 +1,29 @@
+/**
+ *
+ *
+ * PreviewControl
+ *
+ */
+import React from 'react';
+import PropTypes from 'prop-types';
+import { FormattedMessage } from 'react-intl';
+import styles from './componentsStyles.scss';
+
+const PreviewControl = ({ onClick }) => (
+  <div className={styles.previewControlsWrapper} onClick={onClick}>
+    <div />
+    <div className={styles.wysiwygCollapse}>
+      <FormattedMessage id="components.Wysiwyg.collapse" />
+    </div>
+  </div>
+);
+
+PreviewControl.defaultProps = {
+  onClick: () => {},
+};
+
+PreviewControl.propTypes = {
+  onClick: PropTypes.func,
+};
+
+export default PreviewControl;
diff --git a/packages/strapi-plugin-content-manager/admin/src/components/Wysiwyg/previewWysiwyg.js b/packages/strapi-plugin-content-manager/admin/src/components/Wysiwyg/previewWysiwyg.js
new file mode 100644
index 0000000000..99d297b8c1
--- /dev/null
+++ b/packages/strapi-plugin-content-manager/admin/src/components/Wysiwyg/previewWysiwyg.js
@@ -0,0 +1,261 @@
+/**
+ *
+ * PreviewWysiwyg
+ *
+ */
+
+import React from 'react';
+import PropTypes from 'prop-types';
+import {
+  CompositeDecorator,
+  ContentState,
+  convertFromHTML,
+  EditorState,
+  ContentBlock,
+  genKey,
+  Entity,
+  CharacterMetadata,
+} from 'draft-js';
+import { List, OrderedSet, Repeat, fromJS } from 'immutable';
+import cn from 'classnames';
+import { isEmpty, toArray } from 'lodash';
+
+import WysiwygEditor from 'components/WysiwygEditor';
+import converter from './converter';
+import {
+  findAtomicEntities,
+  findLinkEntities,
+  findImageEntities,
+  findVideoEntities,
+} from './strategies';
+
+import Image from './image';
+import Link from './link';
+import Video from './video';
+
+import styles from './componentsStyles.scss';
+/* eslint-disable react/no-unused-state */
+function getBlockStyle(block) {
+  switch (block.getType()) {
+    case 'blockquote':
+      return styles.editorBlockquote;
+    case 'code-block':
+      return styles.editorCodeBlock;
+    case 'unstyled':
+      return styles.editorParagraph;
+    case 'unordered-list-item':
+      return styles.unorderedList;
+    case 'ordered-list-item':
+    case 'header-one':
+    case 'header-two':
+    case 'header-three':
+    case 'header-four':
+    case 'header-five':
+    case 'header-six':
+    default:
+      return null;
+  }
+}
+
+const decorator = new CompositeDecorator([
+  {
+    strategy: findLinkEntities,
+    component: Link,
+  },
+  {
+    strategy: findImageEntities,
+    component: Image,
+  },
+  {
+    strategy: findVideoEntities,
+    component: Video,
+  },
+  {
+    strategy: findAtomicEntities,
+    component: Link,
+  },
+]);
+
+const getBlockSpecForElement = aElement => ({
+  contentType: 'link',
+  aHref: aElement.href,
+  aInnerHTML: aElement.innerHTML,
+});
+
+const elementToBlockSpecElement = element => wrapBlockSpec(getBlockSpecForElement(element));
+
+const wrapBlockSpec = blockSpec => {
+  if (blockSpec == null) {
+    return null;
+  }
+  const tempEl = document.createElement('blockquote');
+  // stringify meta data and insert it as text content of temp HTML element. We will later extract
+  // and parse it.
+  tempEl.innerText = JSON.stringify(blockSpec);
+  return tempEl;
+};
+
+const replaceElement = (oldEl, newEl) => {
+  if (!(newEl instanceof HTMLElement)) {
+    return;
+  }
+  const parentNode = oldEl.parentNode;
+  return parentNode.replaceChild(newEl, oldEl);
+};
+
+const aReplacer = aElement => replaceElement(aElement, elementToBlockSpecElement(aElement));
+
+const createContentBlock = (blockData = {}) => {
+  const { key, type, text, data, inlineStyles, entityData } = blockData;
+
+  let blockSpec = {
+    type: type !== null && type !== undefined ? type : 'unstyled',
+    text: text !== null && text !== undefined ? text : '',
+    key: key !== null && key !== undefined ? key : genKey(),
+  };
+
+  if (data) {
+    blockSpec.data = fromJS(data);
+  }
+
+  if (inlineStyles || entityData) {
+    let entityKey;
+    if (entityData) {
+      const { type, mutability, data } = entityData;
+      entityKey = Entity.create(type, mutability, data);
+    } else {
+      entityKey = null;
+    }
+    const style = OrderedSet(inlineStyles || []);
+    const charData = CharacterMetadata.applyEntity(
+      CharacterMetadata.create({ style, entityKey }),
+      entityKey,
+    );
+    blockSpec.characterList = List(Repeat(charData, text.length));
+  }
+  return new ContentBlock(blockSpec);
+};
+
+class PreviewWysiwyg extends React.PureComponent {
+  state = { editorState: EditorState.createEmpty(), isMounted: false };
+
+  componentDidMount() {
+    const { data } = this.props;
+    this.setState({ isMounted: true });
+
+    if (!isEmpty(data)) {
+      this.previewHTML(data);
+    }
+  }
+
+  // NOTE: This is not optimal and this lifecycle should be removed
+  // I couldn't find a better way to decrease the fullscreen preview's data conversion time
+  // Trying with componentDidUpdate didn't work
+  UNSAFE_componentWillUpdate(nextProps, nextState) {
+    if (nextProps.data !== this.props.data) {
+      new Promise(resolve => {
+        setTimeout(() => {
+          if (nextProps.data === this.props.data && nextState.isMounted) {
+            // I use an handler here to update the state wich is fine since the condition above prevent
+            // from entering into an infinite loop
+            this.previewHTML(nextProps.data);
+          }
+          resolve();
+        }, 300);
+      });
+    }
+  }
+
+  componentWillUnmount() {
+    this.setState({ isMounted: false });
+  }
+
+  getClassName = () => {
+    if (this.context.isFullscreen) {
+      return cn(styles.editor, styles.editorFullScreen, styles.fullscreenPreviewEditor);
+    }
+
+    return styles.editor;
+  };
+
+  previewHTML = rawContent => {
+    const initHtml = isEmpty(rawContent) ? '<p></p>' : rawContent;
+    const html = new DOMParser().parseFromString(converter.makeHtml(initHtml), 'text/html');
+    toArray(html.getElementsByTagName('a')) // Retrieve all the links <a> tags
+      .filter((value) => value.getElementsByTagName('img').length > 0) // Filter by checking if they have any <img> children
+      .forEach(aReplacer); // Change those links into <blockquote> elements so we can set some metacharacters with the img content
+
+    // TODO:
+    // in the same way, retrieve all <pre> tags
+    // create custom atomic block
+    // create custom code block
+    let blocksFromHTML = convertFromHTML(html.body.innerHTML);
+
+    if (blocksFromHTML.contentBlocks) {
+      blocksFromHTML = blocksFromHTML.contentBlocks.reduce((acc, block) => {
+        if (block.getType() === 'blockquote') {
+          try {
+            const { aHref, aInnerHTML } = JSON.parse(block.getText());
+            const entityData = {
+              type: 'LINK',
+              mutability: 'IMMUTABLE',
+              data: {
+                aHref,
+                aInnerHTML,
+              },
+            };
+
+            const blockSpec = Object.assign(
+              { type: 'atomic', text: ' ', key: block.getKey() },
+              { entityData },
+            );
+            const atomicBlock = createContentBlock(blockSpec); // Create an atomic block so we can identify it easily
+
+            return acc.concat([atomicBlock]);
+          } catch (err) {
+            return acc.concat(block);
+          }
+        }
+
+        return acc.concat(block);
+      }, []);
+
+      const contentState = ContentState.createFromBlockArray(blocksFromHTML);
+
+      return this.setState({ editorState: EditorState.createWithContent(contentState, decorator) });
+    }
+
+    return this.setState({ editorState: EditorState.createEmpty() });
+  };
+
+  render() {
+    const { placeholder } = this.context;
+    // this.previewHTML2(this.props.data);
+    return (
+      <div className={this.getClassName()}>
+        <WysiwygEditor
+          blockStyleFn={getBlockStyle}
+          editorState={this.state.editorState}
+          onChange={() => {}}
+          placeholder={placeholder}
+        />
+        <input className={styles.editorInput} value="" tabIndex="-1" />
+      </div>
+    );
+  }
+}
+
+PreviewWysiwyg.contextTypes = {
+  isFullscreen: PropTypes.bool,
+  placeholder: PropTypes.string,
+};
+
+PreviewWysiwyg.defaultProps = {
+  data: '',
+};
+
+PreviewWysiwyg.propTypes = {
+  data: PropTypes.string,
+};
+
+export default PreviewWysiwyg;
diff --git a/packages/strapi-plugin-content-manager/admin/src/components/Wysiwyg/strategies.js b/packages/strapi-plugin-content-manager/admin/src/components/Wysiwyg/strategies.js
new file mode 100644
index 0000000000..0ccd95d584
--- /dev/null
+++ b/packages/strapi-plugin-content-manager/admin/src/components/Wysiwyg/strategies.js
@@ -0,0 +1,35 @@
+/* eslint-disable no-unused-vars */
+
+function findLinkEntities(contentBlock, callback, contentState) {
+  contentBlock.findEntityRanges(character => {
+    const entityKey = character.getEntity();
+    return entityKey !== null && contentState.getEntity(entityKey).getType() === 'LINK';
+  }, callback);
+}
+
+function findAtomicEntities(contentBlock, callback, contentState) {
+  contentBlock.findEntityRanges(character => {
+    const entityKey = character.getEntity();
+    return entityKey !== null && contentBlock.getType() === 'atomic';
+  }, callback);
+}
+
+function findImageEntities(contentBlock, callback, contentState) {
+  contentBlock.findEntityRanges(character => {
+    const entityKey = character.getEntity();
+
+    return entityKey !== null && contentState.getEntity(entityKey).getType() === 'IMAGE' && !isVideoType(contentState.getEntity(entityKey).getData().src);
+  }, callback);
+}
+
+function findVideoEntities(contentBlock, cb, contentState) {
+  contentBlock.findEntityRanges(character => {
+    const entityKey = character.getEntity();
+
+    return entityKey !== null && contentState.getEntity(entityKey).getType() === 'IMAGE' && isVideoType(contentState.getEntity(entityKey).getData().src);
+  }, cb);
+}
+
+const isVideoType = (fileName) => /\.(mp4|mpg|mpeg|mov|avi)$/i.test(fileName);
+
+export { findAtomicEntities, findLinkEntities, findImageEntities, findVideoEntities };
diff --git a/packages/strapi-plugin-content-manager/admin/src/components/Wysiwyg/styles.scss b/packages/strapi-plugin-content-manager/admin/src/components/Wysiwyg/styles.scss
new file mode 100644
index 0000000000..400028c10d
--- /dev/null
+++ b/packages/strapi-plugin-content-manager/admin/src/components/Wysiwyg/styles.scss
@@ -0,0 +1,115 @@
+.controlsContainer {
+  display: flex;
+  background-color: #F3F4F4;
+
+  select {
+    min-height: 31px !important;
+    min-width: 161px !important;
+    font-weight: 600;
+    outline: none;
+
+    &:focus, &:active{
+      border: 1px solid #E3E9F3;
+    }
+  }
+}
+
+.editorWrapper {
+  min-height: 320px;
+  margin-top: .9rem;
+  border: 1px solid #F3F4F4;
+  border-radius: 0.25rem;
+  line-height: 18px!important;
+  font-size: 13px;
+  box-shadow: 0px 1px 1px rgba(104, 118, 142, 0.05);
+  background-color: #fff;
+  position: relative;
+}
+
+.editor {
+  min-height: 303px;
+  max-height: 555px;
+  padding: 20px 20px 0 20px;
+  font-size: 16px;
+  background-color: #fff;
+  line-height: 18px !important;
+  cursor: text;
+  overflow: auto;
+
+  h1, h2, h3, h4, h5, h6 {
+    margin: 0;
+    line-height: 18px !important;
+  }
+  h1 {
+    margin-top: 13px !important;
+    margin-bottom: 22px;
+  }
+  > div {
+    > div {
+      > div {
+        margin-bottom: 32px;
+      }
+    }
+  }
+  li {
+    margin-top: 0;
+  }
+  ul, ol {
+    margin-bottom: 18px;
+  }
+}
+
+.editorError {
+  border-color: #ff203c !important;
+}
+
+.editorInput {
+  height: 0;
+  width: 0;
+}
+
+.editorBlockquote {
+  border-left: 5px solid #eee;
+  font-family: Lato;
+  font-style: italic;
+  margin: 16px 0;
+  padding: 10px 20px;
+}
+
+.editorCodeBlock {
+  margin-bottom: 0!important;
+  padding: 5px;
+  background-color: rgba(0, 0, 0, 0.05);
+  font-family: Lato;
+}
+
+
+.fullscreenOverlay {
+  position: fixed;
+  z-index: 1040;
+  top: calc(6rem + 90px);
+  left: calc(24rem + 28px);
+  right: 28px;
+  bottom: 32px;
+  display: flex;
+  background-color: transparent;
+  z-index: 99999;
+  > div {
+    min-width: 50%;
+  }
+  > div:first-child {
+    border-top-right-radius: 0;
+    border-bottom-right-radius: 0;
+  }
+  > div:last-child {
+    border-left: 0;
+    border-top-left-radius: 0;
+    border-bottom-left-radius: 0;
+  }
+}
+
+.editorFullScreen {
+  max-height: calc(100% - 70px) !important;
+  margin-bottom: 0;
+  overflow: auto;
+}
diff --git a/packages/strapi-plugin-content-manager/admin/src/components/Wysiwyg/toggleMode.js b/packages/strapi-plugin-content-manager/admin/src/components/Wysiwyg/toggleMode.js
new file mode 100644
index 0000000000..5d3d573664
--- /dev/null
+++ b/packages/strapi-plugin-content-manager/admin/src/components/Wysiwyg/toggleMode.js
@@ -0,0 +1,36 @@
+/**
+ *
+ *
+ * ToggleMode
+ */
+
+import React from 'react';
+import { FormattedMessage } from 'react-intl';
+import PropTypes from 'prop-types';
+import styles from './componentsStyles.scss';
+
+const ToggleMode = props => {
+  const label = props.isPreviewMode
+    ? 'components.Wysiwyg.ToggleMode.markdown'
+    : 'components.Wysiwyg.ToggleMode.preview';
+
+  return (
+    <div className={styles.toggleModeWrapper}>
+      <button type="button" className={styles.toggleModeButton} onClick={props.onClick}>
+        <FormattedMessage id={label} />
+      </button>
+    </div>
+  );
+};
+
+ToggleMode.defaultProps = {
+  isPreviewMode: false,
+  onClick: () => {},
+};
+
+ToggleMode.propTypes = {
+  isPreviewMode: PropTypes.bool,
+  onClick: PropTypes.func,
+};
+
+export default ToggleMode;
diff --git a/packages/strapi-plugin-content-manager/admin/src/components/Wysiwyg/utils.js b/packages/strapi-plugin-content-manager/admin/src/components/Wysiwyg/utils.js
new file mode 100644
index 0000000000..1ed5a91c0b
--- /dev/null
+++ b/packages/strapi-plugin-content-manager/admin/src/components/Wysiwyg/utils.js
@@ -0,0 +1,74 @@
+/**
+ *
+ * Utils
+ *
+ */
+
+import { ContentBlock, EditorState, genKey, Modifier } from 'draft-js';
+import { List } from 'immutable';
+import { DEFAULT_INDENTATION } from './constants';
+
+export function createNewBlock(text = '', type = 'unstyled', key = genKey()) {
+  return new ContentBlock({ key, type, text, charaterList: List([]) });
+}
+
+export function getNextBlocksList(editorState, startKey) {
+  return editorState
+    .getCurrentContent()
+    .getBlockMap()
+    .toSeq()
+    .skipUntil((_, k) => k === startKey)
+    .toList()
+    .shift()
+    .concat([createNewBlock()]);
+}
+
+
+export function updateSelection(selection, blocks, offset) {
+  return selection.merge({
+    anchorKey: blocks.get(0).getKey(),
+    focusKey: blocks.get(0).getKey(),
+    anchorOffset: offset,
+    focusOffset: offset,
+  });
+}
+
+export function getSelectedBlocksList(editorState) {
+  const selectionState = editorState.getSelection();
+  const contentState = editorState.getCurrentContent();
+  const startKey = selectionState.getStartKey();
+  const endKey = selectionState.getEndKey();
+  const blockMap = contentState.getBlockMap();
+  return blockMap
+    .toSeq()
+    .skipUntil((_, k) => k === startKey)
+    .takeUntil((_, k) => k === endKey)
+    .concat([[endKey, blockMap.get(endKey)]])
+    .toList();
+}
+
+export function onTab(editorState) {
+  const contentState = editorState.getCurrentContent();
+  const selection = editorState.getSelection();
+  let newContentState;
+
+  if (selection.isCollapsed()) {
+    newContentState = Modifier.insertText(
+      contentState,
+      selection,
+      DEFAULT_INDENTATION,
+    );
+  } else {
+    newContentState = Modifier.replaceText(
+      contentState,
+      selection,
+      DEFAULT_INDENTATION,
+    );
+  }
+
+  return EditorState.push(
+    editorState,
+    newContentState,
+    'insert-characters'
+  );
+}
diff --git a/packages/strapi-plugin-content-manager/admin/src/components/Wysiwyg/video.js b/packages/strapi-plugin-content-manager/admin/src/components/Wysiwyg/video.js
new file mode 100644
index 0000000000..3cdbdaa9bb
--- /dev/null
+++ b/packages/strapi-plugin-content-manager/admin/src/components/Wysiwyg/video.js
@@ -0,0 +1,26 @@
+/**
+ *
+ * Video
+ *
+ */
+
+import React from 'react';
+import PropTypes from 'prop-types';
+
+/* eslint-disable jsx-a11y/media-has-caption */
+const Video = props => {
+  const { height, src, width } = props.contentState.getEntity(props.entityKey).getData();
+
+  return (
+    <video height={height} width={width} style={{ maxWidth: '100%' }} controls>
+      <source src={src} />
+    </video>
+  );
+};
+
+Video.propTypes = {
+  contentState: PropTypes.object.isRequired,
+  entityKey: PropTypes.string.isRequired,
+};
+
+export default Video;
diff --git a/packages/strapi-plugin-content-manager/admin/src/components/WysiwygBottomControls/index.js b/packages/strapi-plugin-content-manager/admin/src/components/WysiwygBottomControls/index.js
new file mode 100644
index 0000000000..bad94258d0
--- /dev/null
+++ b/packages/strapi-plugin-content-manager/admin/src/components/WysiwygBottomControls/index.js
@@ -0,0 +1,57 @@
+/**
+ *
+ * WysiwygBottomControls
+ *
+ */
+
+import React from 'react';
+import PropTypes from 'prop-types';
+import { FormattedMessage } from 'react-intl';
+
+import styles from './styles.scss';
+/* eslint-disable jsx-a11y/label-has-for */
+const WysiwygBottomControls = ({ isPreviewMode, onChange, onClick }) => {
+  const browse = (
+    <FormattedMessage id="components.WysiwygBottomControls.uploadFiles.browse">
+      {(message) => <span className={styles.underline}>{message}</span>}
+    </FormattedMessage>
+  );
+
+  return (
+    <div className={styles.wysiwygBottomControlsWrapper}>
+      <div>
+        <label
+          className={styles.dropLabel}
+          onClick={(e) => {
+            if (isPreviewMode) {
+              e.preventDefault();
+            }
+          }}
+        >
+          <FormattedMessage
+            id="components.WysiwygBottomControls.uploadFiles"
+            values={{ browse }}
+          />
+          <input type="file" onChange={onChange} />
+        </label>
+      </div>
+      <div className={styles.fullScreenWrapper} onClick={onClick}>
+        <FormattedMessage id="components.WysiwygBottomControls.fullscreen" />
+      </div>
+    </div>
+  );
+};
+
+WysiwygBottomControls.defaultProps = {
+  isPreviewMode: false,
+  onChange: () => {},
+  onClick: () => {},
+};
+
+WysiwygBottomControls.propTypes = {
+  isPreviewMode: PropTypes.bool,
+  onChange: PropTypes.func,
+  onClick: PropTypes.func,
+};
+
+export default WysiwygBottomControls;
diff --git a/packages/strapi-plugin-content-manager/admin/src/components/WysiwygBottomControls/styles.scss b/packages/strapi-plugin-content-manager/admin/src/components/WysiwygBottomControls/styles.scss
new file mode 100644
index 0000000000..c4d10ab7f1
--- /dev/null
+++ b/packages/strapi-plugin-content-manager/admin/src/components/WysiwygBottomControls/styles.scss
@@ -0,0 +1,41 @@
+.wysiwygBottomControlsWrapper {
+  display: flex;
+  height: 30px;
+  width: 100%;
+  padding: 0 15px;
+  justify-content: space-between;
+  background-color: #FAFAFB;
+  line-height: 30px;
+  font-size: 13px;
+  font-family: Lato;
+  border-top: 1px dashed #e3e4e4;
+  
+  > div:first-child {
+    > span:last-child {
+      font-size: 12px;
+    }
+  }
+}
+
+
+.fullScreenWrapper {
+  cursor: pointer;
+  &:after {
+    content: '\f065';
+    margin-left: 8px;
+    font-family: FontAwesome;
+    font-size: 12px;
+  }
+}
+
+.underline {
+  color: #1C5DE7;
+  text-decoration: underline;
+  cursor: pointer;
+}
+
+.dropLabel {
+  > input {
+    display: none;
+  }
+}
diff --git a/packages/strapi-plugin-content-manager/admin/src/components/WysiwygDropUpload/index.js b/packages/strapi-plugin-content-manager/admin/src/components/WysiwygDropUpload/index.js
new file mode 100644
index 0000000000..e7abcec3c9
--- /dev/null
+++ b/packages/strapi-plugin-content-manager/admin/src/components/WysiwygDropUpload/index.js
@@ -0,0 +1,26 @@
+/**
+ *
+ * WysiwygDropUpload
+ *
+ */
+
+import React from 'react';
+import styles from './styles.scss';
+
+/* eslint-disable jsx-a11y/label-has-for */
+const WysiwygDropUpload = (props) => {
+  return (
+    <label
+      {...props}
+      className={styles.wysiwygDropUpload}
+    >
+      <input
+        onChange={() => {}}
+        type="file"
+        tabIndex="-1"
+      />
+    </label>
+  );
+};
+
+export default WysiwygDropUpload;
diff --git a/packages/strapi-plugin-content-manager/admin/src/components/WysiwygDropUpload/styles.scss b/packages/strapi-plugin-content-manager/admin/src/components/WysiwygDropUpload/styles.scss
new file mode 100644
index 0000000000..eefdf14ba7
--- /dev/null
+++ b/packages/strapi-plugin-content-manager/admin/src/components/WysiwygDropUpload/styles.scss
@@ -0,0 +1,12 @@
+.wysiwygDropUpload {
+  position: absolute;
+  top: 0;
+  right: 0;
+  left: 0;
+  bottom: 0;
+  background-color: rgba(28,93,231,0.01);
+
+  > input {
+    display: none;
+  }
+}
diff --git a/packages/strapi-plugin-content-manager/admin/src/components/WysiwygEditor/index.js b/packages/strapi-plugin-content-manager/admin/src/components/WysiwygEditor/index.js
new file mode 100644
index 0000000000..b612662639
--- /dev/null
+++ b/packages/strapi-plugin-content-manager/admin/src/components/WysiwygEditor/index.js
@@ -0,0 +1,27 @@
+/**
+ *
+ * WysiwygEditor
+ *
+ */
+
+import React from 'react';
+import { Editor } from 'draft-js';
+import PropTypes from 'prop-types';
+
+class WysiwygEditor extends React.Component {
+  render() {
+    return (
+      <Editor {...this.props} ref={this.props.setRef} />
+    );
+  }
+}
+
+WysiwygEditor.defaultProps = {
+  setRef: () => {},
+};
+
+WysiwygEditor.propTypes = {
+  setRef: PropTypes.func,
+};
+
+export default WysiwygEditor;
diff --git a/packages/strapi-plugin-content-manager/admin/src/components/WysiwygInlineControls/index.js b/packages/strapi-plugin-content-manager/admin/src/components/WysiwygInlineControls/index.js
new file mode 100644
index 0000000000..4564ea5662
--- /dev/null
+++ b/packages/strapi-plugin-content-manager/admin/src/components/WysiwygInlineControls/index.js
@@ -0,0 +1,111 @@
+/**
+ *
+ * WysiwygInlineControls
+ *
+ */
+
+import React from 'react';
+import PropTypes from 'prop-types';
+import cn from 'classnames';
+
+import styles from './styles.scss';
+
+class StyleButton extends React.Component {
+  handleClick = (e) => {
+    e.preventDefault();
+
+    if (!this.props.disabled) {
+      this.props.handlers[this.props.handler](this.props.text, this.props.style);
+    }
+  }
+
+  render() {
+    return (
+      <div
+        className={cn(
+          this.props.active && styles.styleButtonActive,
+          styles.styleButton,
+          this.props.className && styles[this.props.className],
+          this.props.disabled && styles.styleButtonDisabled,
+        )}
+        onMouseDown={this.handleClick}
+      >
+        {!this.props.hideLabel && this.props.label}
+      </div>
+    );
+  }
+}
+
+const  WysiwygInlineControls = ({ buttons, disabled, editorState, handlers, onToggle, onToggleBlock }) => {
+  const selection = editorState.getSelection();
+  const blockType = editorState
+    .getCurrentContent()
+    .getBlockForKey(selection.getStartKey())
+    .getType();
+
+  const currentStyle = editorState.getCurrentInlineStyle();
+
+  return (
+    <div className={cn(styles.wysiwygInlineControls)}>
+      {buttons.map(type => (
+        <StyleButton
+          key={type.label}
+          active={type.style === blockType || currentStyle.has(type.style)}
+          className={type.className}
+          disabled={disabled}
+          handler={type.handler}
+          handlers={handlers}
+          hideLabel={type.hideLabel || false}
+          label={type.label}
+          onToggle={onToggle}
+          onToggleBlock={onToggleBlock}
+          style={type.style}
+          text={type.text}
+        />
+      ))}
+    </div>
+  );
+};
+
+/* eslint-disable react/default-props-match-prop-types */
+StyleButton.defaultProps = {
+  active: false,
+  className: '',
+  disabled: false,
+  hideLabel: false,
+  label: '',
+  onToggle: () => {},
+  onToggleBlock: () => {},
+  style: '',
+  text: '',
+};
+
+StyleButton.propTypes = {
+  active: PropTypes.bool,
+  className: PropTypes.string,
+  disabled: PropTypes.bool,
+  handler: PropTypes.string.isRequired,
+  handlers: PropTypes.object.isRequired,
+  hideLabel: PropTypes.bool,
+  label: PropTypes.string,
+  style: PropTypes.string,
+  text: PropTypes.string,
+};
+
+WysiwygInlineControls.defaultProps = {
+  buttons: [],
+  disabled: false,
+  onToggle: () => {},
+  onToggleBlock: () => {},
+};
+
+WysiwygInlineControls.propTypes = {
+  buttons: PropTypes.array,
+  disabled: PropTypes.bool,
+  editorState: PropTypes.object.isRequired,
+  handlers: PropTypes.object.isRequired,
+  onToggle: PropTypes.func,
+  onToggleBlock: PropTypes.func,
+};
+
+export default WysiwygInlineControls;
diff --git a/packages/strapi-plugin-content-manager/admin/src/components/WysiwygInlineControls/styles.scss b/packages/strapi-plugin-content-manager/admin/src/components/WysiwygInlineControls/styles.scss
new file mode 100644
index 0000000000..1ed0462d75
--- /dev/null
+++ b/packages/strapi-plugin-content-manager/admin/src/components/WysiwygInlineControls/styles.scss
@@ -0,0 +1,123 @@
+.active {
+  background-color: red;
+}
+
+.controlsWrapper {
+  display: flex;
+  user-select: none;
+  > div:nth-child(even) {
+    border-left: 0;
+    border-right: 0;
+  }
+}
+
+.styleButton {
+  height: 32px;
+  min-width: 32px;
+  background-color: #FFFFFF;
+  border: 1px solid rgba(16,22,34,0.10);
+  font-size: 13px;
+  font-weight: 500;
+  line-height: 32px;
+  text-align: center;
+  cursor: pointer;
+
+  &:hover {
+    background-color: #F3F4F4;
+  }
+}
+
+.styleButtonActive {
+  border: 0;
+  background: rgba(16,22,34,0.00);
+  box-shadow: inset 0 -1px 0 0 rgba(16,22,34,0.04), inset 0 1px 0 0 rgba(16,22,34,0.04);
+}
+
+.styleButtonBold {
+  background-image: url('../../assets/icons/icon_bold.svg');
+  background-position: center;
+  background-repeat: no-repeat;
+}
+
+.styleButtonDisabled {
+  opacity: 0.7;
+  cursor: not-allowed;
+}
+
+.styleButtonItalic {
+  background-image: url('../../assets/icons/icon_italic.svg');
+  background-position: center;
+  background-repeat: no-repeat;
+}
+
+.styleButtonUnderline {
+  background-image: url('../../assets/icons/icon_underline.svg');
+  background-position: center 11px;
+  background-repeat: no-repeat;
+}
+
+.styleButtonUL {
+  background-image: url('../../assets/icons/icon_bullet-list.svg');
+  background-position: center;
+  background-repeat: no-repeat;
+}
+
+.styleButtonOL {
+  background-image: url('../../assets/icons/icon_numbered-list.svg');
+  background-position: center 12px;
+  background-repeat: no-repeat;
+}
+
+.styleButtonBlockQuote {
+  background-image: url('../../assets/icons/icon_quote-block.svg');
+  background-position: center;
+  background-repeat: no-repeat;
+}
+
+.styleButtonCodeBlock {
+  background-image: url('../../assets/icons/icon_code-block.svg');
+  background-position: center;
+  background-repeat: no-repeat;
+}
+
+.styleButtonLink {
+  background-image: url('../../assets/icons/icon_link.svg');
+  background-position: center;
+  background-repeat: no-repeat;
+}
+
+.styleButtonImg {
+  background-image: url('../../assets/icons/icon_media.svg');
+  background-position: center;
+}
+
+.styleButtonStrikedOut {
+  background-image: url('../../assets/icons/icon_barred.svg');
+  background-position: center;
+  background-repeat: no-repeat;
+}
+
+.wysiwygInlineControls {
+  height: 49px;
+  display: flex;
+  padding: 8px 3px 0 10px;
+  background-color: #F3F4F4;
+  user-select: none;
+  > div:nth-child(even) {
+    border-left: 0;
+    border-right: 0;
+  }
+  > div:first-child {
+    border-top-left-radius: 3px;
+    border-bottom-left-radius: 3px;
+  }
+  > div:last-child {
+    border-top-right-radius: 3px;
+    border-bottom-right-radius: 3px;
+    border-right: 1px solid rgba(16,22,34,0.10);
+  }
+}
+
+.wysiwygInlineControlsFocus {
+  border-color: #78caff;
+}
diff --git a/packages/strapi-plugin-content-manager/admin/src/components/WysiwygWithErrors/Loadable.js b/packages/strapi-plugin-content-manager/admin/src/components/WysiwygWithErrors/Loadable.js
new file mode 100644
index 0000000000..7077e11eb5
--- /dev/null
+++ b/packages/strapi-plugin-content-manager/admin/src/components/WysiwygWithErrors/Loadable.js
@@ -0,0 +1,7 @@
+import Loadable from 'react-loadable';
+import Loader from './Loader';
+
+export default Loadable({
+  loader: () => import('./index'),
+  loading: Loader,
+});
\ No newline at end of file
diff --git a/packages/strapi-plugin-content-manager/admin/src/components/WysiwygWithErrors/Loader.js b/packages/strapi-plugin-content-manager/admin/src/components/WysiwygWithErrors/Loader.js
new file mode 100644
index 0000000000..bc65882ade
--- /dev/null
+++ b/packages/strapi-plugin-content-manager/admin/src/components/WysiwygWithErrors/Loader.js
@@ -0,0 +1,11 @@
+import React from 'react';
+
+import styles from './styles.scss';
+
+const Loader = () => (
+  <div className="col-md-12">
+    <div className={styles.wysLoader}><div /></div>
+  </div>
+);
+
+export default Loader;
\ No newline at end of file
diff --git a/packages/strapi-plugin-content-manager/admin/src/components/WysiwygWithErrors/index.js b/packages/strapi-plugin-content-manager/admin/src/components/WysiwygWithErrors/index.js
new file mode 100644
index 0000000000..4e68a4a09e
--- /dev/null
+++ b/packages/strapi-plugin-content-manager/admin/src/components/WysiwygWithErrors/index.js
@@ -0,0 +1,222 @@
+/**
+ *
+ * WysiwygWithErrors
+ *
+ */
+
+import React from 'react';
+import PropTypes from 'prop-types';
+import { isEmpty, isFunction } from 'lodash';
+import cn from 'classnames';
+
+// Design
+import Label from 'components/Label';
+import InputDescription from 'components/InputDescription';
+import InputErrors from 'components/InputErrors';
+import InputSpacer from 'components/InputSpacer';
+import Wysiwyg from 'components/Wysiwyg';
+
+// Utils
+import validateInput from 'utils/inputsValidations';
+
+import styles from './styles.scss';
+
+class WysiwygWithErrors extends React.Component { // eslint-disable-line react/prefer-stateless-function
+  state = { errors: [], hasInitialValue: false };
+
+  componentDidMount() {
+    const { value, errors } = this.props;
+
+    // Prevent the input from displaying an error when the user enters and leaves without filling it
+    if (!isEmpty(value)) {
+      this.setState({ hasInitialValue: true });
+    }
+
+    // Display input error if it already has some
+    if (!isEmpty(errors)) {
+      this.setState({ errors });
+    }
+  }
+
+  componentWillReceiveProps(nextProps) {
+    // Show required error if the input's value is received after the compo is mounted
+    if (!isEmpty(nextProps.value) && !this.state.hasInitialValue) {
+      this.setState({ hasInitialValue: true });
+    }
+
+    // Check if errors have been updated during validations
+    if (nextProps.didCheckErrors !== this.props.didCheckErrors) {
+      // Remove from the state the errors that have already been set
+      const errors = isEmpty(nextProps.errors) ? [] : nextProps.errors;
+      this.setState({ errors });
+    }
+  }
+
+  /**
+   * Set the errors depending on the validations given to the input
+   * @param  {Object} target
+   */
+  handleBlur = ({ target }) => {
+    // Prevent from displaying error if the input is initially isEmpty
+    if (!isEmpty(target.value) || this.state.hasInitialValue) {
+      const errors = validateInput(target.value, this.props.validations);
+      this.setState({ errors, hasInitialValue: true });
+    }
+  }
+
+  render() {
+    const {
+      autoFocus,
+      className,
+      customBootstrapClass,
+      deactivateErrorHighlight,
+      disabled,
+      errorsClassName,
+      errorsStyle,
+      inputClassName,
+      inputDescription,
+      inputDescriptionClassName,
+      inputDescriptionStyle,
+      inputStyle,
+      label,
+      labelClassName,
+      labelStyle,
+      name,
+      noErrorsDescription,
+      onBlur,
+      onChange,
+      placeholder,
+      resetProps,
+      style,
+      tabIndex,
+      value,
+    } = this.props;
+    const handleBlur = isFunction(onBlur) ? onBlur : this.handleBlur;
+
+    let spacer = !isEmpty(inputDescription) ? <InputSpacer /> : <div />;
+
+    if (!noErrorsDescription && !isEmpty(this.state.errors)) {
+      spacer = <div />;
+    }
+
+    return (
+      <div
+        className={cn(
+          styles.containerWysiwyg,
+          customBootstrapClass,
+          !isEmpty(className) && className,
+        )}
+        style={style}
+      >
+        <Label
+          className={labelClassName}
+          htmlFor={name}
+          message={label}
+          style={labelStyle}
+        />
+        <Wysiwyg
+          autoFocus={autoFocus}
+          className={inputClassName}
+          disabled={disabled}
+          deactivateErrorHighlight={deactivateErrorHighlight}
+          error={!isEmpty(this.state.errors)}
+          name={name}
+          onBlur={handleBlur}
+          onChange={onChange}
+          placeholder={placeholder}
+          resetProps={resetProps}
+          style={inputStyle}
+          tabIndex={tabIndex}
+          value={value}
+        />
+        <InputDescription
+          className={inputDescriptionClassName}
+          message={inputDescription}
+          style={inputDescriptionStyle}
+        />
+        <InputErrors
+          className={errorsClassName}
+          errors={!noErrorsDescription && this.state.errors || []}
+          style={errorsStyle}
+        />
+        {spacer}
+      </div>
+    );
+  }
+}
+
+WysiwygWithErrors.defaultProps = {
+  autoFocus: false,
+  className: '',
+  customBootstrapClass: 'col-md-12',
+  deactivateErrorHighlight: false,
+  didCheckErrors: false,
+  disabled: false,
+  errors: [],
+  errorsClassName: '',
+  errorsStyle: {},
+  inputClassName: '',
+  inputDescription: '',
+  inputDescriptionClassName: '',
+  inputDescriptionStyle: {},
+  inputStyle: {},
+  label: '',
+  labelClassName: '',
+  labelStyle: {},
+  noErrorsDescription: false,
+  onBlur: false,
+  placeholder: '',
+  resetProps: false,
+  style: {},
+  tabIndex: '0',
+  validations: {},
+};
+
+WysiwygWithErrors.propTypes = {
+  autoFocus: PropTypes.bool,
+  className: PropTypes.string,
+  customBootstrapClass: PropTypes.string,
+  deactivateErrorHighlight: PropTypes.bool,
+  didCheckErrors: PropTypes.bool,
+  disabled: PropTypes.bool,
+  errors: PropTypes.array,
+  errorsClassName: PropTypes.string,
+  errorsStyle: PropTypes.object,
+  inputClassName: PropTypes.string,
+  inputDescription: PropTypes.oneOfType([
+    PropTypes.string,
+    PropTypes.func,
+    PropTypes.shape({
+      id: PropTypes.string,
+      params: PropTypes.object,
+    }),
+  ]),
+  inputDescriptionClassName: PropTypes.string,
+  inputDescriptionStyle: PropTypes.object,
+  inputStyle: PropTypes.object,
+  label: PropTypes.oneOfType([
+    PropTypes.string,
+    PropTypes.func,
+    PropTypes.shape({
+      id: PropTypes.string,
+      params: PropTypes.object,
+    }),
+  ]),
+  labelClassName: PropTypes.string,
+  labelStyle: PropTypes.object,
+  name: PropTypes.string.isRequired,
+  noErrorsDescription: PropTypes.bool,
+  onBlur: PropTypes.oneOfType([
+    PropTypes.bool,
+    PropTypes.func,
+  ]),
+  onChange: PropTypes.func.isRequired,
+  placeholder: PropTypes.string,
+  resetProps: PropTypes.bool,
+  style: PropTypes.object,
+  tabIndex: PropTypes.string,
+  validations: PropTypes.object,
+  value: PropTypes.string.isRequired,
+};
+
+export default WysiwygWithErrors;
diff --git a/packages/strapi-plugin-content-manager/admin/src/components/WysiwygWithErrors/styles.scss b/packages/strapi-plugin-content-manager/admin/src/components/WysiwygWithErrors/styles.scss
new file mode 100644
index 0000000000..6be2e04f9e
--- /dev/null
+++ b/packages/strapi-plugin-content-manager/admin/src/components/WysiwygWithErrors/styles.scss
@@ -0,0 +1,24 @@
+.containerWysiwyg {
+  margin-bottom: 1.6rem;
+  font-size: 1.3rem;
+  font-family: 'Lato';
+}
+
+.wysLoader {
+  display: flex;
+  justify-content: space-around;
+  width: 100%;
+  > div {
+    border: 4px solid #f3f3f3; /* Light grey */
+    border-top: 4px solid #3498db; /* Blue */
+    border-radius: 50%;
+    width: 30px;
+    height: 30px;
+    animation: spin 2s linear infinite;
+  }
+}
+
+@keyframes spin {
+  0% { transform: rotate(0deg); }
+  100% { transform: rotate(360deg); }
+}
\ No newline at end of file
diff --git a/packages/strapi-plugin-content-manager/admin/src/containers/App/sagas.js b/packages/strapi-plugin-content-manager/admin/src/containers/App/sagas.js
index 3e0651e20f..5caad15e3a 100755
--- a/packages/strapi-plugin-content-manager/admin/src/containers/App/sagas.js
+++ b/packages/strapi-plugin-content-manager/admin/src/containers/App/sagas.js
@@ -47,6 +47,7 @@ export function* getModels() {
       method: 'GET',
     });
 
+    // console.log('getModels', response);
     yield put(loadedModels(response));
   } catch (err) {
     strapi.notification.error('content-manager.error.model.fetch');
@@ -56,7 +57,7 @@ export function* getModels() {
 export function* modelsLoaded() {
   const models = yield select(makeSelectModels());
   let schema;
-
+  // console.log('modelsLoaded',  models);
   try {
     schema = generateSchema(models);
   } catch (err) {
diff --git a/packages/strapi-plugin-content-manager/admin/src/injectedComponents.js b/packages/strapi-plugin-content-manager/admin/src/injectedComponents.js
new file mode 100644
index 0000000000..109fa8b38c
--- /dev/null
+++ b/packages/strapi-plugin-content-manager/admin/src/injectedComponents.js
@@ -0,0 +1 @@
+export default [];
\ No newline at end of file
diff --git a/packages/strapi-plugin-content-manager/package.json b/packages/strapi-plugin-content-manager/package.json
index fa9c8b7040..2fc39648de 100755
--- a/packages/strapi-plugin-content-manager/package.json
+++ b/packages/strapi-plugin-content-manager/package.json
@@ -49,4 +49,4 @@
     "npm": ">= 5.0.0"
   },
   "license": "MIT"
-}
+}
\ No newline at end of file
diff --git a/packages/strapi-plugin-content-type-builder/admin/src/injectedComponents.js b/packages/strapi-plugin-content-type-builder/admin/src/injectedComponents.js
new file mode 100644
index 0000000000..109fa8b38c
--- /dev/null
+++ b/packages/strapi-plugin-content-type-builder/admin/src/injectedComponents.js
@@ -0,0 +1 @@
+export default [];
\ No newline at end of file
diff --git a/packages/strapi-plugin-email/admin/src/injectedComponents.js b/packages/strapi-plugin-email/admin/src/injectedComponents.js
new file mode 100644
index 0000000000..109fa8b38c
--- /dev/null
+++ b/packages/strapi-plugin-email/admin/src/injectedComponents.js
@@ -0,0 +1 @@
+export default [];
\ No newline at end of file
diff --git a/packages/strapi-plugin-settings-manager/admin/src/injectedComponents.js b/packages/strapi-plugin-settings-manager/admin/src/injectedComponents.js
new file mode 100644
index 0000000000..109fa8b38c
--- /dev/null
+++ b/packages/strapi-plugin-settings-manager/admin/src/injectedComponents.js
@@ -0,0 +1 @@
+export default [];
\ No newline at end of file
diff --git a/packages/strapi-plugin-upload/admin/src/injectedComponents.js b/packages/strapi-plugin-upload/admin/src/injectedComponents.js
new file mode 100644
index 0000000000..109fa8b38c
--- /dev/null
+++ b/packages/strapi-plugin-upload/admin/src/injectedComponents.js
@@ -0,0 +1 @@
+export default [];
\ No newline at end of file
diff --git a/packages/strapi-plugin-users-permissions/admin/src/injectedComponents.js b/packages/strapi-plugin-users-permissions/admin/src/injectedComponents.js
new file mode 100644
index 0000000000..109fa8b38c
--- /dev/null
+++ b/packages/strapi-plugin-users-permissions/admin/src/injectedComponents.js
@@ -0,0 +1 @@
+export default [];
\ No newline at end of file
diff --git a/packages/strapi-plugin-users-permissions/admin/src/translations/it.json b/packages/strapi-plugin-users-permissions/admin/src/translations/it.json
new file mode 100644
index 0000000000..9e26dfeeb6
--- /dev/null
+++ b/packages/strapi-plugin-users-permissions/admin/src/translations/it.json
@@ -0,0 +1 @@
+{}
\ No newline at end of file

From b396b29624d0b534acfd4a12abe31d8b72d46ea4 Mon Sep 17 00:00:00 2001
From: cyril lopez <cyril.lpz@gmail.com>
Date: Thu, 28 Jun 2018 12:12:54 +0200
Subject: [PATCH 08/65] Fix ListView with new data

---
 packages/strapi-helper-plugin/lib/src/app.js  | 18 +++---
 .../admin/src/bootstrap.js                    | 19 ++++--
 .../admin/src/components/Table/index.js       |  2 +-
 .../admin/src/containers/App/index.js         | 13 ++---
 .../admin/src/containers/App/reducer.js       |  6 +-
 .../admin/src/containers/App/sagas.js         | 48 ++-------------
 .../admin/src/containers/App/selectors.js     |  2 +-
 .../admin/src/containers/ListPage/index.js    | 58 +++++++------------
 .../config/functions/bootstrap.js             | 12 +++-
 .../controllers/ContentManager.js             | 54 ++++++++++-------
 10 files changed, 102 insertions(+), 130 deletions(-)

diff --git a/packages/strapi-helper-plugin/lib/src/app.js b/packages/strapi-helper-plugin/lib/src/app.js
index cf962f451b..69d124f6d7 100755
--- a/packages/strapi-helper-plugin/lib/src/app.js
+++ b/packages/strapi-helper-plugin/lib/src/app.js
@@ -33,15 +33,13 @@ const tryRequireRoot = (source) => {
 const bootstrap = tryRequireRoot('bootstrap');
 const pluginRequirements = tryRequireRoot('requirements');
 
-// NOTE: I'm commenting this line for the moment since we don't use the layout in the other plugins anymore
-// Initially it was developed for the content-manager but we acces the layout via a request instead of building it
-// const layout = (() => {
-//   try {
-//     return require('../../../../config/layout.js'); // eslint-disable-line import/no-unresolved
-//   } catch(err) {
-//     return null;
-//   }
-// })();
+const layout = (() => {
+  try {
+    return require('../../../../config/layout.js'); // eslint-disable-line import/no-unresolved
+  } catch(err) {
+    return null;
+  }
+})();
 
 const injectedComponents = (() => {
   try {
@@ -99,7 +97,7 @@ strapi.registerPlugin({
   icon: pluginPkg.strapi.icon,
   id: pluginId,
   injectedComponents,
-  layout: null,
+  layout,
   leftMenuLinks: [],
   mainComponent: Comp,
   name: pluginPkg.strapi.name,
diff --git a/packages/strapi-plugin-content-manager/admin/src/bootstrap.js b/packages/strapi-plugin-content-manager/admin/src/bootstrap.js
index dd8585d266..cff6c2deaf 100644
--- a/packages/strapi-plugin-content-manager/admin/src/bootstrap.js
+++ b/packages/strapi-plugin-content-manager/admin/src/bootstrap.js
@@ -1,13 +1,24 @@
-import { generateMenu } from 'containers/App/sagas';
+import { map, omit } from 'lodash';
+import request from 'utils/request';
 
 // This method is executed before the load of the plugin
 const bootstrap = (plugin) => new Promise((resolve, reject) => {
-  generateMenu()
-    .then(menu => {
+  request('/content-manager/models', { method: 'GET' })
+    .then(models => {
+      const menu = [{
+        name: 'Content Types',
+        links: map(omit(models.models, 'plugins'), (model, key) => ({
+          label: model.labelPlural || model.label || key,
+          destination: key,
+        })),
+      }];
       plugin.leftMenuSections = menu;
       resolve(plugin);
     })
-    .catch(e => reject(e));
+    .catch(e => {
+      strapi.notification.error('content-manager.error.model.fetch');
+      reject(e);
+    });
 });
 
 export default bootstrap;
diff --git a/packages/strapi-plugin-content-manager/admin/src/components/Table/index.js b/packages/strapi-plugin-content-manager/admin/src/components/Table/index.js
index d9cd09701e..97f5a79fef 100755
--- a/packages/strapi-plugin-content-manager/admin/src/components/Table/index.js
+++ b/packages/strapi-plugin-content-manager/admin/src/components/Table/index.js
@@ -42,7 +42,7 @@ class Table extends React.Component {
         />
       ));
     const entriesToDeleteNumber = this.props.entriesToDelete.length;
-    
+
     return (
       <table className={`table ${styles.table}`}>
         <TableHeader
diff --git a/packages/strapi-plugin-content-manager/admin/src/containers/App/index.js b/packages/strapi-plugin-content-manager/admin/src/containers/App/index.js
index bdce95e523..42a5560383 100755
--- a/packages/strapi-plugin-content-manager/admin/src/containers/App/index.js
+++ b/packages/strapi-plugin-content-manager/admin/src/containers/App/index.js
@@ -25,7 +25,7 @@ import EmptyAttributesView from 'components/EmptyAttributesView';
 import {
   loadModels,
 } from './actions';
-import { makeSelectLoading, makeSelectModels, makeSelectModelEntries } from './selectors';
+import { makeSelectLoading, makeSelectModelEntries, makeSelectSchema } from './selectors';
 
 import saga from './sagas';
 
@@ -41,11 +41,10 @@ class App extends React.Component {
 
     const currentModelName = this.props.location.pathname.split('/')[3];
     const source = getQueryParameters(this.props.location.search, 'source');
+    const attrPath = source === 'content-manager' ? [currentModelName, 'fields'] : ['plugins', source, currentModelName, 'fields'];
 
-    if (currentModelName && source && isEmpty(get(this.props.models.plugins, [source, 'models', currentModelName, 'attributes']))) {
-      if (currentModelName && isEmpty(get(this.props.models.models, [currentModelName, 'attributes']))) {
-        return <EmptyAttributesView currentModelName={currentModelName} history={this.props.history} modelEntries={this.props.modelEntries} />;
-      }
+    if (currentModelName && source && isEmpty(get(this.props.schema, attrPath))) {
+      return <EmptyAttributesView currentModelName={currentModelName} history={this.props.history} modelEntries={this.props.modelEntries} />;
     }
 
     return (
@@ -70,7 +69,7 @@ App.propTypes = {
   loadModels: PropTypes.func.isRequired,
   location: PropTypes.object.isRequired,
   modelEntries: PropTypes.number.isRequired,
-  models: PropTypes.oneOfType([
+  schema: PropTypes.oneOfType([
     PropTypes.bool,
     PropTypes.object,
   ]).isRequired,
@@ -88,7 +87,7 @@ export function mapDispatchToProps(dispatch) {
 const mapStateToProps = createStructuredSelector({
   loading: makeSelectLoading(),
   modelEntries: makeSelectModelEntries(),
-  models: makeSelectModels(),
+  schema: makeSelectSchema(),
 });
 
 const withConnect = connect(mapStateToProps, mapDispatchToProps);
diff --git a/packages/strapi-plugin-content-manager/admin/src/containers/App/reducer.js b/packages/strapi-plugin-content-manager/admin/src/containers/App/reducer.js
index 9ed373bfe9..08a9e13019 100755
--- a/packages/strapi-plugin-content-manager/admin/src/containers/App/reducer.js
+++ b/packages/strapi-plugin-content-manager/admin/src/containers/App/reducer.js
@@ -12,7 +12,7 @@ const initialState = fromJS({
   modelEntries: 0,
   loading: true,
   models: false,
-  schema: false,
+  schema: fromJS({}),
   formValidations: List(),
 });
 
@@ -26,7 +26,9 @@ function appReducer(state = initialState, action) {
       return state;
     case LOADED_MODELS:
       return state
-        .set('models', action.models);
+        .set('models', action.models.models)
+        .set('schema', fromJS(action.models.models))
+        .set('loading', false);
     case UPDATE_SCHEMA:
       return state
         .set('loading', false)
diff --git a/packages/strapi-plugin-content-manager/admin/src/containers/App/sagas.js b/packages/strapi-plugin-content-manager/admin/src/containers/App/sagas.js
index 5caad15e3a..2b497175fa 100755
--- a/packages/strapi-plugin-content-manager/admin/src/containers/App/sagas.js
+++ b/packages/strapi-plugin-content-manager/admin/src/containers/App/sagas.js
@@ -1,18 +1,14 @@
 import { LOCATION_CHANGE } from 'react-router-redux';
-import { map, omit } from 'lodash';
-import { fork, put, select, call, takeLatest, take, cancel } from 'redux-saga/effects';
-
+import { fork, put, call, takeLatest, take, cancel } from 'redux-saga/effects';
 import request from 'utils/request';
-import { generateSchema } from 'utils/schema';
 
-import { getModelEntriesSucceeded, loadedModels, updateSchema } from './actions';
-import { GET_MODEL_ENTRIES, LOAD_MODELS, LOADED_MODELS } from './constants';
-import { makeSelectModels } from './selectors';
+
+import { getModelEntriesSucceeded, loadedModels } from './actions';
+import { GET_MODEL_ENTRIES, LOAD_MODELS } from './constants';
 
 export function* modelEntriesGet(action) {
   try {
     const requestUrl = `/content-manager/explorer/${action.modelName}/count${action.source !== undefined ? `?source=${action.source}`: ''}`;
-
     const response = yield call(request, requestUrl, { method: 'GET' });
 
     yield put(getModelEntriesSucceeded(response.count));
@@ -21,57 +17,21 @@ export function* modelEntriesGet(action) {
   }
 }
 
-export const generateMenu = function () {
-  return request(`/content-manager/models`, {
-    method: 'GET',
-  })
-    .then(response => generateSchema(response))
-    .then(displayedModels => {
-      return [{
-        name: 'Content Types',
-        links: map(omit(displayedModels, 'plugins'), (model, key) => ({
-          label: model.labelPlural || model.label || key,
-          destination: key,
-        })),
-      }];
-    })
-    .catch((error) => {
-      strapi.notification.error('content-manager.error.model.fetch');
-      throw Error(error);
-    });
-};
-
 export function* getModels() {
   try {
     const response = yield call(request, `/content-manager/models`, {
       method: 'GET',
     });
 
-    // console.log('getModels', response);
     yield put(loadedModels(response));
   } catch (err) {
     strapi.notification.error('content-manager.error.model.fetch');
   }
 }
 
-export function* modelsLoaded() {
-  const models = yield select(makeSelectModels());
-  let schema;
-  // console.log('modelsLoaded',  models);
-  try {
-    schema = generateSchema(models);
-  } catch (err) {
-    strapi.notification.error('content-manager.error.schema.generation');
-    throw new Error(err);
-  }
-
-  yield put(updateSchema(schema));
-}
-
 // Individual exports for testing
 export function* defaultSaga() {
   const loadModelsWatcher = yield fork(takeLatest, LOAD_MODELS, getModels);
-  const loadedModelsWatcher = yield fork(takeLatest, LOADED_MODELS, modelsLoaded);
   const loadEntriesWatcher = yield fork(takeLatest, GET_MODEL_ENTRIES, modelEntriesGet);
 
   yield take(LOCATION_CHANGE);
diff --git a/packages/strapi-plugin-content-manager/admin/src/containers/App/selectors.js b/packages/strapi-plugin-content-manager/admin/src/containers/App/selectors.js
index 85cad8f781..ae213c335b 100755
--- a/packages/strapi-plugin-content-manager/admin/src/containers/App/selectors.js
+++ b/packages/strapi-plugin-content-manager/admin/src/containers/App/selectors.js
@@ -43,7 +43,7 @@ const makeSelectLoading = () =>
   createSelector(selectGlobalDomain(), substate => substate.get('loading'));
 
 const makeSelectSchema = () =>
-  createSelector(selectGlobalDomain(), substate => substate.get('schema'));
+  createSelector(selectGlobalDomain(), substate => substate.get('schema').toJS());
 
 export {
   selectGlobalDomain,
diff --git a/packages/strapi-plugin-content-manager/admin/src/containers/ListPage/index.js b/packages/strapi-plugin-content-manager/admin/src/containers/ListPage/index.js
index 07d392eb55..601669154a 100644
--- a/packages/strapi-plugin-content-manager/admin/src/containers/ListPage/index.js
+++ b/packages/strapi-plugin-content-manager/admin/src/containers/ListPage/index.js
@@ -9,11 +9,11 @@ import PropTypes from 'prop-types';
 import { connect } from 'react-redux';
 import { bindActionCreators, compose } from 'redux';
 import { createStructuredSelector } from 'reselect';
-import { capitalize, get, isUndefined, map, toInteger } from 'lodash';
+import { capitalize, get, isUndefined, toInteger } from 'lodash';
 import cn from 'classnames';
 
 // App selectors
-import { makeSelectModels, makeSelectSchema } from 'containers/App/selectors';
+import { makeSelectSchema } from 'containers/App/selectors';
 
 // You can find these components in either
 // ./node_modules/strapi-helper-plugin/lib/src
@@ -106,9 +106,10 @@ export class ListPage extends React.Component {
    * Helper to retrieve the current model data
    * @return {Object} the current model
    */
-  getCurrentModel = () =>
-    get(this.props.models, ['models', this.getCurrentModelName()]) ||
-    get(this.props.models, ['plugins', this.getSource(), 'models', this.getCurrentModelName()]);
+  getCurrentModel = () => (
+    get(this.props.schema, [this.getCurrentModelName()]) ||
+    get(this.props.schema, ['plugins', this.getSource(), this.getCurrentModelName()])
+  );
 
   /**
    * Helper to retrieve the current model name
@@ -153,6 +154,14 @@ export class ListPage extends React.Component {
       : 'content-manager.popUpWarning.bodyMessage.contentType.delete'
   );
 
+  getModelPrimaryKey = () => (
+    get(this.getCurrentModel(), ['primaryKey'], '_id')
+  );
+
+  getTableHeaders = () => (
+    get(this.getCurrentModel(), ['listDisplay'], [])
+  );
+
   /**
    * Generate the redirect URI when editing an entry
    * @type {String}
@@ -169,29 +178,6 @@ export class ListPage extends React.Component {
     return `?${generateSearchFromParams(params)}&source=${this.getSource()}${generateSearchFromFilters(filters)}`;
   }
 
-  /**
-   *  Function to generate the Table's headers
-   * @return {Array}
-   */
-  generateTableHeaders = () => {
-    const currentSchema =
-      get(this.props.schema, [this.getCurrentModelName()]) ||
-      get(this.props.schema, ['plugins', this.getSource(), this.getCurrentModelName()]);
-    const tableHeaders = map(currentSchema.list, value => ({
-      name: value,
-      label: currentSchema.fields[value].label,
-      type: currentSchema.fields[value].type,
-    }));
-
-    tableHeaders.splice(0, 0, {
-      name: this.getCurrentModel().primaryKey || 'id',
-      label: 'Id',
-      type: 'string',
-    });
-
-    return tableHeaders;
-  };
-
   areAllEntriesSelected = () => {
     const { listPage: { entriesToDelete, records } } = this.props;
 
@@ -210,15 +196,14 @@ export class ListPage extends React.Component {
       },
     } = props;
     const source = this.getSource();
-    const modelPrimaryKey = get(props.models, ['models', slug.toLowerCase(), 'primaryKey']);
+    const modelPrimaryKey = get(props.schema, [slug.toLowerCase(), 'primaryKey']);  
     // Check if the model is in a plugin
-    const pluginModelPrimaryKey = get(props.models.plugins, [
+    const pluginModelPrimaryKey = get(props.schema.plugins, [
       source,
-      'models',
       slug.toLowerCase(),
       'primaryKey',
     ]);
-
+  
     return (
       getQueryParameters(props.location.search, '_sort') ||
       modelPrimaryKey ||
@@ -337,6 +322,7 @@ export class ListPage extends React.Component {
       removeAllFilters,
       removeFilter,
     } = this.props;
+
     const pluginHeaderActions = [
       {
         label: 'content-manager.containers.List.addAnEntry',
@@ -419,13 +405,15 @@ export class ListPage extends React.Component {
                   entriesToDelete={entriesToDelete}
                   filters={filters}
                   handleDelete={this.toggleModalWarning}
-                  headers={this.generateTableHeaders()}
+                  // headers={this.generateTableHeaders()}
+                  headers={this.getTableHeaders()}
                   history={this.props.history}
                   onChangeSort={this.handleChangeSort}
                   onClickSelectAll={onClickSelectAll}
                   onClickSelect={onClickSelect}
                   onToggleDeleteAll={onToggleDeleteAll}
-                  primaryKey={this.getCurrentModel().primaryKey || 'id'}
+                  // primaryKey={this.getCurrentModel().primaryKey || 'id'}
+                  primaryKey={this.getModelPrimaryKey()}
                   records={get(records, this.getCurrentModelName(), [])}
                   redirectUrl={this.generateRedirectURI()}
                   route={this.props.match}
@@ -485,7 +473,6 @@ ListPage.propTypes = {
   listPage: PropTypes.object.isRequired,
   location: PropTypes.object.isRequired,
   match: PropTypes.object.isRequired,
-  models: PropTypes.object.isRequired,
   onChange: PropTypes.func.isRequired,
   onClickRemove: PropTypes.func.isRequired,
   onClickSelect: PropTypes.func.isRequired,
@@ -526,7 +513,6 @@ function mapDispatchToProps(dispatch) {
 
 const mapStateToProps = createStructuredSelector({
   listPage: makeSelectListPage(),
-  models: makeSelectModels(),
   schema: makeSelectSchema(),
 });
 
diff --git a/packages/strapi-plugin-content-manager/config/functions/bootstrap.js b/packages/strapi-plugin-content-manager/config/functions/bootstrap.js
index 90a4836412..626edd6434 100644
--- a/packages/strapi-plugin-content-manager/config/functions/bootstrap.js
+++ b/packages/strapi-plugin-content-manager/config/functions/bootstrap.js
@@ -31,7 +31,7 @@ module.exports = async cb => {
   
   const buildSchema = (model, name, plugin = false) => {
     // Model data
-    const schemaModel = {
+    const schemaModel = Object.assign({
       label: _.upperFirst(name),
       labelPlural: _.upperFirst(pluralize(name)),
       orm: model.orm || 'mongoose',
@@ -40,7 +40,7 @@ module.exports = async cb => {
       bulkActions: true,
       pageEntries: 20,
       defaultSort: 'id'
-    };
+    }, model);
   
     // Fields (non relation)
     schemaModel.fields = _.mapValues(_.pickBy(model.attributes, attribute =>
@@ -59,6 +59,12 @@ module.exports = async cb => {
       .map(attr => Object.assign(schemaModel.fields[attr], { name: attr, sortable: true, searchable: true }))
       // Retrieve only the fourth first items
       .slice(0, 4);
+      
+    schemaModel.listDisplay.splice(0, 0, {
+      name: model.primaryKey || 'id',
+      label: 'Id',
+      type: 'string',
+    });
     
     if (model.associations) {
       // Model relations
@@ -101,7 +107,7 @@ module.exports = async cb => {
   });
   
   const pluginStore = strapi.store({
-    environment: strapi.config.environment,
+    environment: '',
     type: 'plugin',
     name: 'content-manager'
   });
diff --git a/packages/strapi-plugin-content-manager/controllers/ContentManager.js b/packages/strapi-plugin-content-manager/controllers/ContentManager.js
index 3bb5684dd7..916ccd4a77 100755
--- a/packages/strapi-plugin-content-manager/controllers/ContentManager.js
+++ b/packages/strapi-plugin-content-manager/controllers/ContentManager.js
@@ -14,32 +14,42 @@ module.exports = {
   },
 
   models: async ctx => {
-    const pickData = (model) => _.pick(model, [
-      'info',
-      'connection',
-      'collectionName',
-      'attributes',
-      'identity',
-      'globalId',
-      'globalName',
-      'orm',
-      'loadedModel',
-      'primaryKey',
-      'associations'
-    ]);
+    // const pickData = (model) => _.pick(model, [
+    //   'info',
+    //   'connection',
+    //   'collectionName',
+    //   'attributes',
+    //   'identity',
+    //   'globalId',
+    //   'globalName',
+    //   'orm',
+    //   'loadedModel',
+    //   'primaryKey',
+    //   'associations'
+    // ]);
 
-    const models = _.mapValues(strapi.models, pickData);
-    delete models['core_store'];
+    // const models = _.mapValues(strapi.models, pickData);
+    // delete models['core_store'];
 
+    // ctx.body = {
+    //   models,
+    //   plugins: Object.keys(strapi.plugins).reduce((acc, current) => {
+    //     acc[current] = {
+    //       models: _.mapValues(strapi.plugins[current].models, pickData)
+    //     };
+
+    //     return acc;
+    //   }, {})
+    // };
+    const pluginsStore = strapi.store({
+      environment: '',
+      type: 'plugin',
+      name: 'content-manager',
+    });
+
+    const models = await pluginsStore.get({ key: 'schema' });
     ctx.body = {
       models,
-      plugins: Object.keys(strapi.plugins).reduce((acc, current) => {
-        acc[current] = {
-          models: _.mapValues(strapi.plugins[current].models, pickData)
-        };
-
-        return acc;
-      }, {})
     };
   },
 

From 2bd990794ec409ed7c69cdd25a40e0539edeb217 Mon Sep 17 00:00:00 2001
From: cyril lopez <cyril.lpz@gmail.com>
Date: Thu, 28 Jun 2018 12:27:15 +0200
Subject: [PATCH 09/65] Fix content-manager with new data type

---
 .../admin/src/containers/App/actions.js           |  8 --------
 .../admin/src/containers/App/constants.js         |  1 -
 .../admin/src/containers/App/reducer.js           | 12 +++---------
 .../admin/src/containers/App/selectors.js         |  5 -----
 .../admin/src/containers/EditPage/index.js        | 15 +++++++++------
 5 files changed, 12 insertions(+), 29 deletions(-)

diff --git a/packages/strapi-plugin-content-manager/admin/src/containers/App/actions.js b/packages/strapi-plugin-content-manager/admin/src/containers/App/actions.js
index 5a4bbb306c..5703e94589 100755
--- a/packages/strapi-plugin-content-manager/admin/src/containers/App/actions.js
+++ b/packages/strapi-plugin-content-manager/admin/src/containers/App/actions.js
@@ -10,7 +10,6 @@ import {
   GET_MODEL_ENTRIES_SUCCEEDED,
   LOAD_MODELS,
   LOADED_MODELS,
-  UPDATE_SCHEMA,
 } from './constants';
 
 export function emptyStore() {
@@ -46,10 +45,3 @@ export function loadedModels(models) {
     models,
   };
 }
-
-export function updateSchema(schema) {
-  return {
-    type: UPDATE_SCHEMA,
-    schema,
-  };
-}
diff --git a/packages/strapi-plugin-content-manager/admin/src/containers/App/constants.js b/packages/strapi-plugin-content-manager/admin/src/containers/App/constants.js
index fd3bc00938..b0473f834e 100755
--- a/packages/strapi-plugin-content-manager/admin/src/containers/App/constants.js
+++ b/packages/strapi-plugin-content-manager/admin/src/containers/App/constants.js
@@ -9,4 +9,3 @@ export const GET_MODEL_ENTRIES = 'contentManager/App/GET_MODEL_ENTRIES';
 export const GET_MODEL_ENTRIES_SUCCEEDED = 'contentManager/App/GET_MODEL_ENTRIES_SUCCEEDED';
 export const LOAD_MODELS = 'contentManager/App/LOAD_MODELS';
 export const LOADED_MODELS = 'contentManager/App/LOADED_MODELS';
-export const UPDATE_SCHEMA = 'contentManager/App/UPDATE_SCHEMA';
diff --git a/packages/strapi-plugin-content-manager/admin/src/containers/App/reducer.js b/packages/strapi-plugin-content-manager/admin/src/containers/App/reducer.js
index 08a9e13019..bc68aa3c95 100755
--- a/packages/strapi-plugin-content-manager/admin/src/containers/App/reducer.js
+++ b/packages/strapi-plugin-content-manager/admin/src/containers/App/reducer.js
@@ -6,14 +6,13 @@
 
 import { fromJS, List } from 'immutable';
 
-import { EMPTY_STORE, GET_MODEL_ENTRIES_SUCCEEDED, LOAD_MODELS, LOADED_MODELS, UPDATE_SCHEMA } from './constants';
+import { EMPTY_STORE, GET_MODEL_ENTRIES_SUCCEEDED, LOAD_MODELS, LOADED_MODELS } from './constants';
 
 const initialState = fromJS({
   modelEntries: 0,
   loading: true,
-  models: false,
   schema: fromJS({}),
-  formValidations: List(),
+  formValidations: List([]),
 });
 
 function appReducer(state = initialState, action) {
@@ -26,13 +25,8 @@ function appReducer(state = initialState, action) {
       return state;
     case LOADED_MODELS:
       return state
-        .set('models', action.models.models)
-        .set('schema', fromJS(action.models.models))
+        .update('schema', () => fromJS(action.models.models))
         .set('loading', false);
-    case UPDATE_SCHEMA:
-      return state
-        .set('loading', false)
-        .set('schema', action.schema);
     default:
       return state;
   }
diff --git a/packages/strapi-plugin-content-manager/admin/src/containers/App/selectors.js b/packages/strapi-plugin-content-manager/admin/src/containers/App/selectors.js
index ae213c335b..6f0fa11763 100755
--- a/packages/strapi-plugin-content-manager/admin/src/containers/App/selectors.js
+++ b/packages/strapi-plugin-content-manager/admin/src/containers/App/selectors.js
@@ -29,10 +29,6 @@ const selectLocationState = () => {
  * Default selector used by List
  */
 
-const makeSelectModels = () =>
-  createSelector(selectGlobalDomain(), globalState =>
-    globalState.get('models')
-  );
 
 const makeSelectModelEntries = () =>
   createSelector(selectGlobalDomain(), globalState =>
@@ -50,6 +46,5 @@ export {
   selectLocationState,
   makeSelectLoading,
   makeSelectModelEntries,
-  makeSelectModels,
   makeSelectSchema,
 };
diff --git a/packages/strapi-plugin-content-manager/admin/src/containers/EditPage/index.js b/packages/strapi-plugin-content-manager/admin/src/containers/EditPage/index.js
index 798ea607e6..72b6ad8ac5 100644
--- a/packages/strapi-plugin-content-manager/admin/src/containers/EditPage/index.js
+++ b/packages/strapi-plugin-content-manager/admin/src/containers/EditPage/index.js
@@ -25,7 +25,7 @@ import Edit from 'components/Edit';
 import EditRelations from 'components/EditRelations';
 
 // App selectors
-import { makeSelectModels, makeSelectSchema } from 'containers/App/selectors';
+import { makeSelectSchema } from 'containers/App/selectors';
 
 import injectReducer from 'utils/injectReducer';
 import injectSaga from 'utils/injectSaga';
@@ -100,6 +100,11 @@ export class EditPage extends React.Component {
     }
   }
 
+  componentDidCatch(error, info) {
+    console.log('err', err);
+    console.log('info', info);
+  }
+
   componentWillUnmount() {
     this.props.resetProps();
   }
@@ -123,7 +128,7 @@ export class EditPage extends React.Component {
    * Retrieve the model
    * @type {Object}
    */
-  getModel = () => get(this.props.models, ['models', this.getModelName()]) || get(this.props.models, ['plugins', this.getSource(), 'models', this.getModelName()]);
+  getModel = () => get(this.props.schema, [this.getModelName()]) || get(this.props.schema, ['plugins', this.getSource(), this.getModelName()]);
 
   /**
    * Retrieve specific attribute
@@ -327,7 +332,7 @@ EditPage.contextTypes = {
 };
 
 EditPage.defaultProps = {
-  models: {},
+  schema: {},
 };
 
 EditPage.propTypes = {
@@ -339,10 +344,9 @@ EditPage.propTypes = {
   initModelProps: PropTypes.func.isRequired,
   location: PropTypes.object.isRequired,
   match: PropTypes.object.isRequired,
-  models: PropTypes.object,
   onCancel: PropTypes.func.isRequired,
   resetProps: PropTypes.func.isRequired,
-  schema: PropTypes.object.isRequired,
+  schema: PropTypes.object,
   setFileRelations: PropTypes.func.isRequired,
   setFormErrors: PropTypes.func.isRequired,
   submit: PropTypes.func.isRequired,
@@ -367,7 +371,6 @@ function mapDispatchToProps(dispatch) {
 
 const mapStateToProps = createStructuredSelector({
   editPage: makeSelectEditPage(),
-  models: makeSelectModels(),
   schema: makeSelectSchema(),
 });
 

From f152e0cac87862bfb9e3c96487d4d43c782fe34e Mon Sep 17 00:00:00 2001
From: cyril lopez <cyril.lpz@gmail.com>
Date: Thu, 28 Jun 2018 12:49:26 +0200
Subject: [PATCH 10/65] Add ctm in plugins container and add its icon in
 pluginsPage. Change LeftMenu to functionnal component

---
 .../components/LeftMenuLinkContainer/index.js  |  8 ++++++--
 .../admin/src/components/ListPlugins/index.js  |  2 +-
 .../admin/src/components/Row/index.js          | 10 +++++++---
 .../admin/src/containers/LeftMenu/index.js     | 18 ++++++++----------
 .../admin/src/containers/App/index.js          |  2 +-
 5 files changed, 23 insertions(+), 17 deletions(-)

diff --git a/packages/strapi-admin/admin/src/components/LeftMenuLinkContainer/index.js b/packages/strapi-admin/admin/src/components/LeftMenuLinkContainer/index.js
index 5ea571e596..ce156f2cbe 100755
--- a/packages/strapi-admin/admin/src/components/LeftMenuLinkContainer/index.js
+++ b/packages/strapi-admin/admin/src/components/LeftMenuLinkContainer/index.js
@@ -69,13 +69,17 @@ function LeftMenuLinkContainer({ layout, plugins }) {
   // Check if the plugins list is empty or not and display plugins by name
   const pluginsLinks = !isEmpty(pluginsObject) ? (
     map(sortBy(pluginsObject, 'name'), plugin => {
-      if (plugin.id !== 'email' && plugin.id !== 'content-manager' && plugin.id !== 'settings-manager') {
+      if (plugin.id !== 'email' && plugin.id !== 'settings-manager') {
+        const basePath = `/plugins/${get(plugin, 'id')}`;
+        // NOTE: this should be dynamic
+        const destination = plugin.id === 'content-manager' ? `${basePath}/ctm-configurations` : basePath;
+
         return (
           <LeftMenuLink
             key={get(plugin, 'id')}
             icon={get(plugin, 'icon') || 'plug'}
             label={get(plugin, 'name')}
-            destination={`/plugins/${get(plugin, 'id')}`}
+            destination={destination}
           />
         );
       }
diff --git a/packages/strapi-admin/admin/src/components/ListPlugins/index.js b/packages/strapi-admin/admin/src/components/ListPlugins/index.js
index 6a448a878a..64a6ead46d 100644
--- a/packages/strapi-admin/admin/src/components/ListPlugins/index.js
+++ b/packages/strapi-admin/admin/src/components/ListPlugins/index.js
@@ -16,7 +16,7 @@ import Row from 'components/Row';
 
 import styles from './styles.scss';
 
-class ListPlugins extends React.Component {
+class ListPlugins extends React.PureComponent {
   render() {
     const listSize = size(this.props.plugins);
     let titleType = listSize === 1 ? 'singular' : 'plural';
diff --git a/packages/strapi-admin/admin/src/components/Row/index.js b/packages/strapi-admin/admin/src/components/Row/index.js
index 8ad6128e6c..47b5ef279b 100644
--- a/packages/strapi-admin/admin/src/components/Row/index.js
+++ b/packages/strapi-admin/admin/src/components/Row/index.js
@@ -8,7 +8,7 @@ import React from 'react';
 import PropTypes from 'prop-types';
 import cn from 'classnames';
 import { FormattedMessage } from 'react-intl';
-import { isEmpty } from 'lodash';
+import { includes, isEmpty } from 'lodash';
 
 // Design
 import IcoContainer from 'components/IcoContainer';
@@ -17,6 +17,8 @@ import PopUpWarning from 'components/PopUpWarning';
 
 import styles from './styles.scss';
 
+const PLUGINS_WITH_CONFIG = ['content-manager', 'email', 'upload'];
+
 class Row extends React.Component {
   state = { showModal: false };
 
@@ -33,8 +35,10 @@ class Row extends React.Component {
 
   render() {
     // const uploadPath = `/plugins/upload/configurations/${this.context.currentEnvironment}`;
-    const settingsPath = `/plugins/${this.props.name}/configurations/${this.context.currentEnvironment}`; 
-    const icons = this.props.name === 'upload' || this.props.name === 'email' ? [
+    // Make sure to match the ctm config URI instead of content-type view URI
+    const settingsPath = this.props.name === 'content-manager' ? '/plugins/content-manager/ctm-configurations' : `/plugins/${this.props.name}/configurations/${this.context.currentEnvironment}`; 
+    // const icons = this.props.name === 'upload' || this.props.name === 'email' ? [
+    const icons = includes(PLUGINS_WITH_CONFIG, this.props.name) ? [
       {
         icoType: 'cog',
         onClick: (e) => {
diff --git a/packages/strapi-admin/admin/src/containers/LeftMenu/index.js b/packages/strapi-admin/admin/src/containers/LeftMenu/index.js
index ba940f7f3d..3303b61d6a 100755
--- a/packages/strapi-admin/admin/src/containers/LeftMenu/index.js
+++ b/packages/strapi-admin/admin/src/containers/LeftMenu/index.js
@@ -14,16 +14,14 @@ import LeftMenuFooter from 'components/LeftMenuFooter';
 
 import styles from './styles.scss';
 
-export class LeftMenu extends React.Component { // eslint-disable-line react/prefer-stateless-function
-  render() {
-    return (
-      <div className={styles.leftMenu}>
-        <LeftMenuHeader />
-        <LeftMenuLinkContainer {...this.props} />
-        <LeftMenuFooter plugins={this.props.plugins} version={this.props.version} />
-      </div>
-    );
-  }
+function LeftMenu(props) {
+  return (
+    <div className={styles.leftMenu}>
+      <LeftMenuHeader />
+      <LeftMenuLinkContainer {...props} />
+      <LeftMenuFooter plugins={props.plugins} version={props.version} />
+    </div>
+  );
 }
 
 LeftMenu.defaultProps = {
diff --git a/packages/strapi-plugin-content-manager/admin/src/containers/App/index.js b/packages/strapi-plugin-content-manager/admin/src/containers/App/index.js
index 42a5560383..4b5554f9bf 100755
--- a/packages/strapi-plugin-content-manager/admin/src/containers/App/index.js
+++ b/packages/strapi-plugin-content-manager/admin/src/containers/App/index.js
@@ -50,9 +50,9 @@ class App extends React.Component {
     return (
       <div className="content-manager">
         <Switch>
+          <Route path="/plugins/content-manager/ctm-configurations" component={Home} />
           <Route path="/plugins/content-manager/:slug/:id" component={EditPage} />
           <Route path="/plugins/content-manager/:slug" component={ListPage} />
-          <Route path="/plugins/content-manager" component={Home} />
         </Switch>
       </div>
     );

From cc49c29f9984998719889cbb3a377cd93e56a7d2 Mon Sep 17 00:00:00 2001
From: cyril lopez <cyril.lpz@gmail.com>
Date: Thu, 28 Jun 2018 17:54:24 +0200
Subject: [PATCH 11/65] Update recursively schema on change

---
 .../admin/src/bootstrap.js                    |   2 +-
 .../admin/src/components/Block/index.js       |  39 ++++++
 .../admin/src/components/Block/styles.scss    |  21 +++
 .../admin/src/containers/App/actions.js       |  12 ++
 .../admin/src/containers/App/constants.js     |   1 +
 .../admin/src/containers/App/index.js         |   6 +-
 .../admin/src/containers/App/reducer.js       |  35 ++++-
 .../admin/src/containers/EditPage/index.js    |  11 +-
 .../admin/src/containers/ListPage/index.js    |   4 +-
 .../src/containers/SettingsPage/actions.js    |   0
 .../src/containers/SettingsPage/constants.js  |   0
 .../src/containers/SettingsPage/forms.json    |  42 ++++++
 .../src/containers/SettingsPage/index.js      | 125 ++++++++++++++++++
 .../src/containers/SettingsPage/reducer.js    |  19 +++
 .../admin/src/containers/SettingsPage/saga.js |  14 ++
 .../src/containers/SettingsPage/selectors.js  |  24 ++++
 .../src/containers/SettingsPage/styles.scss   |  21 +++
 .../admin/src/translations/en.json            |   9 ++
 .../admin/src/translations/fr.json            |   9 ++
 .../config/functions/bootstrap.js             |  33 +++--
 20 files changed, 403 insertions(+), 24 deletions(-)
 create mode 100644 packages/strapi-plugin-content-manager/admin/src/components/Block/index.js
 create mode 100644 packages/strapi-plugin-content-manager/admin/src/components/Block/styles.scss
 create mode 100644 packages/strapi-plugin-content-manager/admin/src/containers/SettingsPage/actions.js
 create mode 100644 packages/strapi-plugin-content-manager/admin/src/containers/SettingsPage/constants.js
 create mode 100644 packages/strapi-plugin-content-manager/admin/src/containers/SettingsPage/forms.json
 create mode 100644 packages/strapi-plugin-content-manager/admin/src/containers/SettingsPage/index.js
 create mode 100644 packages/strapi-plugin-content-manager/admin/src/containers/SettingsPage/reducer.js
 create mode 100644 packages/strapi-plugin-content-manager/admin/src/containers/SettingsPage/saga.js
 create mode 100644 packages/strapi-plugin-content-manager/admin/src/containers/SettingsPage/selectors.js
 create mode 100644 packages/strapi-plugin-content-manager/admin/src/containers/SettingsPage/styles.scss

diff --git a/packages/strapi-plugin-content-manager/admin/src/bootstrap.js b/packages/strapi-plugin-content-manager/admin/src/bootstrap.js
index cff6c2deaf..524be693df 100644
--- a/packages/strapi-plugin-content-manager/admin/src/bootstrap.js
+++ b/packages/strapi-plugin-content-manager/admin/src/bootstrap.js
@@ -7,7 +7,7 @@ const bootstrap = (plugin) => new Promise((resolve, reject) => {
     .then(models => {
       const menu = [{
         name: 'Content Types',
-        links: map(omit(models.models, 'plugins'), (model, key) => ({
+        links: map(omit(models.models.models, 'plugins'), (model, key) => ({
           label: model.labelPlural || model.label || key,
           destination: key,
         })),
diff --git a/packages/strapi-plugin-content-manager/admin/src/components/Block/index.js b/packages/strapi-plugin-content-manager/admin/src/components/Block/index.js
new file mode 100644
index 0000000000..042ede09d0
--- /dev/null
+++ b/packages/strapi-plugin-content-manager/admin/src/components/Block/index.js
@@ -0,0 +1,39 @@
+/**
+ * 
+ * Block
+ */
+
+import React from 'react';
+import PropTypes from 'prop-types';
+import { FormattedMessage } from 'react-intl';
+
+import styles from './styles.scss';
+
+const Block = ({ children, description, title }) => (
+  <div className="col-md-12">
+    <div className={styles.ctmBlock}>
+      <div className={styles.ctmBlockTitle}>
+        <FormattedMessage id={title} />
+        <FormattedMessage id={description}>
+          {msg => <p>{msg}</p>}
+        </FormattedMessage>
+      </div>
+      {children}
+    </div>
+  </div>
+);
+
+
+Block.defaultProps = {
+  children: null,
+  description: 'app.utils.defaultMessage',
+  title: 'app.utils.defaultMessage',
+};
+
+Block.propTypes = {
+  children: PropTypes.any,
+  description: PropTypes.string,
+  title: PropTypes.string,
+};
+
+export default Block;
\ No newline at end of file
diff --git a/packages/strapi-plugin-content-manager/admin/src/components/Block/styles.scss b/packages/strapi-plugin-content-manager/admin/src/components/Block/styles.scss
new file mode 100644
index 0000000000..b014a7f2d8
--- /dev/null
+++ b/packages/strapi-plugin-content-manager/admin/src/components/Block/styles.scss
@@ -0,0 +1,21 @@
+.ctmBlock{
+  background: #ffffff;
+  padding: 22px 28px 0px;
+  border-radius: 2px;
+  box-shadow: 0 2px 4px #E3E9F3;
+  webkit-font-smoothing: antialiased;
+}
+
+.ctmBlockTitle {
+  padding-top: 0px;
+  line-height: 18px;
+  font-weight: 400;
+  > span {
+    color: #333740;
+    font-size: 18px;
+  }
+  > p {
+    color: #787E8F;
+    font-size: 13px;
+  }
+}
\ No newline at end of file
diff --git a/packages/strapi-plugin-content-manager/admin/src/containers/App/actions.js b/packages/strapi-plugin-content-manager/admin/src/containers/App/actions.js
index 5703e94589..6553e76f68 100755
--- a/packages/strapi-plugin-content-manager/admin/src/containers/App/actions.js
+++ b/packages/strapi-plugin-content-manager/admin/src/containers/App/actions.js
@@ -4,12 +4,14 @@
  *
  */
 
+import { includes } from 'lodash';
 import {
   EMPTY_STORE,
   GET_MODEL_ENTRIES,
   GET_MODEL_ENTRIES_SUCCEEDED,
   LOAD_MODELS,
   LOADED_MODELS,
+  ON_CHANGE,
 } from './constants';
 
 export function emptyStore() {
@@ -45,3 +47,13 @@ export function loadedModels(models) {
     models,
   };
 }
+
+export function onChange({ target }) {
+  const value = includes(target.name, 'pageEntries') ? parseInt(target.value, 10) : target.value;
+
+  return {
+    type: ON_CHANGE,
+    keys: target.name.split('.'),
+    value,
+  };
+}
\ No newline at end of file
diff --git a/packages/strapi-plugin-content-manager/admin/src/containers/App/constants.js b/packages/strapi-plugin-content-manager/admin/src/containers/App/constants.js
index b0473f834e..5c420cba8e 100755
--- a/packages/strapi-plugin-content-manager/admin/src/containers/App/constants.js
+++ b/packages/strapi-plugin-content-manager/admin/src/containers/App/constants.js
@@ -9,3 +9,4 @@ export const GET_MODEL_ENTRIES = 'contentManager/App/GET_MODEL_ENTRIES';
 export const GET_MODEL_ENTRIES_SUCCEEDED = 'contentManager/App/GET_MODEL_ENTRIES_SUCCEEDED';
 export const LOAD_MODELS = 'contentManager/App/LOAD_MODELS';
 export const LOADED_MODELS = 'contentManager/App/LOADED_MODELS';
+export const ON_CHANGE = 'contentManager/App/ON_CHANGE';
diff --git a/packages/strapi-plugin-content-manager/admin/src/containers/App/index.js b/packages/strapi-plugin-content-manager/admin/src/containers/App/index.js
index 4b5554f9bf..4a6b0af01b 100755
--- a/packages/strapi-plugin-content-manager/admin/src/containers/App/index.js
+++ b/packages/strapi-plugin-content-manager/admin/src/containers/App/index.js
@@ -16,9 +16,9 @@ import { Switch, Route } from 'react-router-dom';
 import injectSaga from 'utils/injectSaga';
 import getQueryParameters from 'utils/getQueryParameters';
 
-import Home from 'containers/Home';
 import EditPage from 'containers/EditPage';
 import ListPage from 'containers/ListPage';
+import SettingsPage from 'containers/SettingsPage';
 import LoadingIndicatorPage from 'components/LoadingIndicatorPage';
 import EmptyAttributesView from 'components/EmptyAttributesView';
 
@@ -41,7 +41,7 @@ class App extends React.Component {
 
     const currentModelName = this.props.location.pathname.split('/')[3];
     const source = getQueryParameters(this.props.location.search, 'source');
-    const attrPath = source === 'content-manager' ? [currentModelName, 'fields'] : ['plugins', source, currentModelName, 'fields'];
+    const attrPath = source === 'content-manager' ? ['models', currentModelName, 'fields'] : ['models', 'plugins', source, currentModelName, 'fields'];
 
     if (currentModelName && source && isEmpty(get(this.props.schema, attrPath))) {
       return <EmptyAttributesView currentModelName={currentModelName} history={this.props.history} modelEntries={this.props.modelEntries} />;
@@ -50,7 +50,7 @@ class App extends React.Component {
     return (
       <div className="content-manager">
         <Switch>
-          <Route path="/plugins/content-manager/ctm-configurations" component={Home} />
+          <Route path="/plugins/content-manager/ctm-configurations" component={SettingsPage} />
           <Route path="/plugins/content-manager/:slug/:id" component={EditPage} />
           <Route path="/plugins/content-manager/:slug" component={ListPage} />
         </Switch>
diff --git a/packages/strapi-plugin-content-manager/admin/src/containers/App/reducer.js b/packages/strapi-plugin-content-manager/admin/src/containers/App/reducer.js
index bc68aa3c95..65426c21f4 100755
--- a/packages/strapi-plugin-content-manager/admin/src/containers/App/reducer.js
+++ b/packages/strapi-plugin-content-manager/admin/src/containers/App/reducer.js
@@ -5,8 +5,13 @@
  */
 
 import { fromJS, List } from 'immutable';
-
-import { EMPTY_STORE, GET_MODEL_ENTRIES_SUCCEEDED, LOAD_MODELS, LOADED_MODELS } from './constants';
+import {
+  EMPTY_STORE,
+  GET_MODEL_ENTRIES_SUCCEEDED,
+  LOAD_MODELS,
+  LOADED_MODELS,
+  ON_CHANGE,
+} from './constants';
 
 const initialState = fromJS({
   modelEntries: 0,
@@ -27,6 +32,32 @@ function appReducer(state = initialState, action) {
       return state
         .update('schema', () => fromJS(action.models.models))
         .set('loading', false);
+    case ON_CHANGE:
+      return state
+        .updateIn(['schema'].concat(action.keys), () => action.value)
+        .updateIn(['schema', 'models'], models => {
+          return models
+            .keySeq()
+            .reduce((acc, current) => {
+
+              if (current !== 'plugins') {
+                return acc.setIn([current, action.keys[1]], action.value);
+              }
+              
+              return acc
+                .get(current)
+                .keySeq()
+                .reduce((acc1, curr) => {
+                  return acc1
+                    .getIn([current, curr])
+                    .keySeq()
+                    .reduce((acc2, curr1) => {
+                  
+                      return acc2.setIn([ current, curr, curr1, action.keys[1]], action.value);
+                    }, acc1);
+                }, acc);
+            }, models);
+        });
     default:
       return state;
   }
diff --git a/packages/strapi-plugin-content-manager/admin/src/containers/EditPage/index.js b/packages/strapi-plugin-content-manager/admin/src/containers/EditPage/index.js
index 72b6ad8ac5..9adcb7a892 100644
--- a/packages/strapi-plugin-content-manager/admin/src/containers/EditPage/index.js
+++ b/packages/strapi-plugin-content-manager/admin/src/containers/EditPage/index.js
@@ -100,11 +100,6 @@ export class EditPage extends React.Component {
     }
   }
 
-  componentDidCatch(error, info) {
-    console.log('err', err);
-    console.log('info', info);
-  }
-
   componentWillUnmount() {
     this.props.resetProps();
   }
@@ -128,7 +123,7 @@ export class EditPage extends React.Component {
    * Retrieve the model
    * @type {Object}
    */
-  getModel = () => get(this.props.schema, [this.getModelName()]) || get(this.props.schema, ['plugins', this.getSource(), this.getModelName()]);
+  getModel = () => get(this.props.schema, ['models', this.getModelName()]) || get(this.props.schema, ['models', 'plugins', this.getSource(), this.getModelName()]);
 
   /**
    * Retrieve specific attribute
@@ -153,8 +148,8 @@ export class EditPage extends React.Component {
    * @return {Object}
    */
   getSchema = () => this.getSource() !== 'content-manager' ?
-    get(this.props.schema, ['plugins', this.getSource(), this.getModelName()])
-    : get(this.props.schema, [this.getModelName()]);
+    get(this.props.schema, ['models', 'plugins', this.getSource(), this.getModelName()])
+    : get(this.props.schema, ['models', this.getModelName()]);
 
   getPluginHeaderTitle = () => {
     if (this.isCreating()) {
diff --git a/packages/strapi-plugin-content-manager/admin/src/containers/ListPage/index.js b/packages/strapi-plugin-content-manager/admin/src/containers/ListPage/index.js
index 601669154a..7cf91b42ec 100644
--- a/packages/strapi-plugin-content-manager/admin/src/containers/ListPage/index.js
+++ b/packages/strapi-plugin-content-manager/admin/src/containers/ListPage/index.js
@@ -107,8 +107,8 @@ export class ListPage extends React.Component {
    * @return {Object} the current model
    */
   getCurrentModel = () => (
-    get(this.props.schema, [this.getCurrentModelName()]) ||
-    get(this.props.schema, ['plugins', this.getSource(), this.getCurrentModelName()])
+    get(this.props.schema, ['models', this.getCurrentModelName()]) ||
+    get(this.props.schema, ['models', 'plugins', this.getSource(), this.getCurrentModelName()])
   );
 
   /**
diff --git a/packages/strapi-plugin-content-manager/admin/src/containers/SettingsPage/actions.js b/packages/strapi-plugin-content-manager/admin/src/containers/SettingsPage/actions.js
new file mode 100644
index 0000000000..e69de29bb2
diff --git a/packages/strapi-plugin-content-manager/admin/src/containers/SettingsPage/constants.js b/packages/strapi-plugin-content-manager/admin/src/containers/SettingsPage/constants.js
new file mode 100644
index 0000000000..e69de29bb2
diff --git a/packages/strapi-plugin-content-manager/admin/src/containers/SettingsPage/forms.json b/packages/strapi-plugin-content-manager/admin/src/containers/SettingsPage/forms.json
new file mode 100644
index 0000000000..93392fa681
--- /dev/null
+++ b/packages/strapi-plugin-content-manager/admin/src/containers/SettingsPage/forms.json
@@ -0,0 +1,42 @@
+{
+  "inputs": [
+    {
+      "label": { "id": "content-manager.form.Input.search" },
+      "customBootstrapClass": "col-md-5",
+      "didCheckErrors": false,
+      "errors": [],
+      "name": "generalSettings.search",
+      "type": "toggle",
+      "validations": {}
+    },
+    {
+      "label": { "id": "content-manager.form.Input.filters" },
+      "customBootstrapClass": "col-md-5",
+      "didCheckErrors": false,
+      "errors": [],
+      "name": "generalSettings.filters",
+      "type": "toggle",
+      "validations": {}
+    },
+    {
+      "label": { "id": "content-manager.form.Input.bulkActions" },
+      "customBootstrapClass": "col-md-2",
+      "didCheckErrors": false,
+      "errors": [],
+      "name": "generalSettings.bulkActions",
+      "type": "toggle",
+      "validations": {}
+    },
+    {
+      "label": { "id": "content-manager.form.Input.pageEntries" },
+      "customBootstrapClass": "col-md-3",
+      "didCheckErrors": false,
+      "errors": [],
+      "inputDescription": { "id": "content-manager.form.Input.pageEntries.inputDescription" },
+      "name": "generalSettings.pageEntries",
+      "selectOptions": ["10", "20", "50", "100"],
+      "type": "select",
+      "validations": {}
+    }
+  ]
+}
\ No newline at end of file
diff --git a/packages/strapi-plugin-content-manager/admin/src/containers/SettingsPage/index.js b/packages/strapi-plugin-content-manager/admin/src/containers/SettingsPage/index.js
new file mode 100644
index 0000000000..1a9fec6632
--- /dev/null
+++ b/packages/strapi-plugin-content-manager/admin/src/containers/SettingsPage/index.js
@@ -0,0 +1,125 @@
+/**
+ * 
+ * SettingsPage
+ */
+
+import React from 'react';
+import { connect } from 'react-redux';
+import { bindActionCreators, compose } from 'redux';
+import { createStructuredSelector } from 'reselect';
+import cn from 'classnames';
+import { get } from 'lodash';
+import PropTypes from 'prop-types';
+
+import { onChange } from 'containers/App/actions';
+import { makeSelectSchema } from 'containers/App/selectors';
+
+import PluginHeader from 'components/PluginHeader';
+import Input from 'components/InputsIndex';
+
+import Block from 'components/Block';
+
+import injectReducer from 'utils/injectReducer';
+import injectSaga from 'utils/injectSaga';
+
+import reducer from './reducer';
+import saga from './saga';
+import makeSelectSettingsPage from './selectors';
+import styles from './styles.scss';
+
+import forms from './forms.json';
+
+class SettingsPage extends React.PureComponent {
+  getPluginHeaderActions = () => (
+    [
+      {
+        label: 'content-manager.popUpWarning.button.cancel',
+        kind: 'secondary',
+        onClick: () => {},
+        type: 'button',
+      },
+      {
+        kind: 'primary',
+        label: 'content-manager.containers.Edit.submit',
+        onClick: () => {},
+        type: 'submit',
+      },
+    ]
+  );
+
+  getValue = (input) => {
+    const { schema: { generalSettings } } = this.props;
+    const value = get(generalSettings, input.name.split('.')[1], input.type === 'toggle' ? false : 10);
+
+    return input.type === 'toggle' ? value : value.toString();
+  }
+
+  render() {
+    return (
+      <div className={cn('container-fluid', styles.containerFluid)}>
+        <PluginHeader
+          actions={this.getPluginHeaderActions()}
+          title="Content Manager"
+          description={{ id: 'content-manager.containers.SettingsPage.pluginHeaderDescription' }}
+        />
+        <div className={cn('row', styles.container)}>
+          <Block
+            description="content-manager.containers.SettingsPage.Block.generalSettings.description"
+            title="content-manager.containers.SettingsPage.Block.generalSettings.title"
+          >
+            <form onSubmit={(e) => e.preventDefault()} className={styles.ctmForm}>
+              <div className="row">
+                <div className="col-md-10">
+                  <div className="row">
+                    {forms.inputs.map(input => {
+
+                      return (
+                        <Input
+                          key={input.name}
+                          onChange={this.props.onChange}
+                          value={this.getValue(input)}
+                          {...input}
+                        />
+                      );
+                    })}
+                  </div>
+                </div>
+              </div>
+            </form>
+          </Block>
+        </div>
+      </div>
+    );
+  }
+}
+
+SettingsPage.defaultProps = {};
+
+SettingsPage.propTypes = {
+  onChange: PropTypes.func.isRequired,
+  schema: PropTypes.object.isRequired,
+};
+
+const mapDispatchToProps = (dispatch) => (
+  bindActionCreators(
+    {
+      onChange,
+    },
+    dispatch,
+  )
+);
+
+const mapStateToProps = createStructuredSelector({
+  schema: makeSelectSchema(),
+  settingsPage: makeSelectSettingsPage(),
+});
+
+const withConnect = connect(mapStateToProps, mapDispatchToProps);
+const withReducer = injectReducer({ key: 'settingsPage', reducer });
+const withSaga = injectSaga({ key: 'settingsPage', saga });
+
+export default compose(
+  withReducer,
+  withSaga,
+  withConnect,
+)(SettingsPage);
diff --git a/packages/strapi-plugin-content-manager/admin/src/containers/SettingsPage/reducer.js b/packages/strapi-plugin-content-manager/admin/src/containers/SettingsPage/reducer.js
new file mode 100644
index 0000000000..0649137672
--- /dev/null
+++ b/packages/strapi-plugin-content-manager/admin/src/containers/SettingsPage/reducer.js
@@ -0,0 +1,19 @@
+/**
+ * 
+ * SettingsPage reducer
+ */
+
+import { fromJS } from 'immutable';
+
+const initialState = fromJS({
+  foo: 'bar',
+});
+
+function settingsPageReducer(state = initialState, action) {
+  switch (action.type) {
+    default:
+      return state;
+  }
+}
+
+export default settingsPageReducer;
\ No newline at end of file
diff --git a/packages/strapi-plugin-content-manager/admin/src/containers/SettingsPage/saga.js b/packages/strapi-plugin-content-manager/admin/src/containers/SettingsPage/saga.js
new file mode 100644
index 0000000000..4c7caa7fa2
--- /dev/null
+++ b/packages/strapi-plugin-content-manager/admin/src/containers/SettingsPage/saga.js
@@ -0,0 +1,14 @@
+// import { LOCATION_CHANGE } from 'react-router-redux'
+// import {
+//   call,
+//   cancel,
+//   fork,
+//   put,
+//   select,
+//   take,
+//   takeLatest,
+// } from 'redux-saga/effects';
+
+function* defaultSaga() {}
+
+export default defaultSaga;
\ No newline at end of file
diff --git a/packages/strapi-plugin-content-manager/admin/src/containers/SettingsPage/selectors.js b/packages/strapi-plugin-content-manager/admin/src/containers/SettingsPage/selectors.js
new file mode 100644
index 0000000000..8153dd3770
--- /dev/null
+++ b/packages/strapi-plugin-content-manager/admin/src/containers/SettingsPage/selectors.js
@@ -0,0 +1,24 @@
+/**
+ * 
+ * SettingsPage selectors
+ */
+
+import { createSelector } from 'reselect';
+
+/**
+* Direct selector to the settingsPage state domain
+*/
+const selectSettingsPageDomain = () => state => state.get('settingsPage');
+
+
+/**
+ * Default selector used by EditPage
+ */
+
+const makeSelectSettingsPage = () => createSelector(
+  selectSettingsPageDomain(),
+  (substate) => substate.toJS()
+);
+
+
+export default makeSelectSettingsPage;
\ No newline at end of file
diff --git a/packages/strapi-plugin-content-manager/admin/src/containers/SettingsPage/styles.scss b/packages/strapi-plugin-content-manager/admin/src/containers/SettingsPage/styles.scss
new file mode 100644
index 0000000000..944eb6d40f
--- /dev/null
+++ b/packages/strapi-plugin-content-manager/admin/src/containers/SettingsPage/styles.scss
@@ -0,0 +1,21 @@
+.containerFluid {
+  padding: 18px 30px;
+  > div:first-child {
+    max-height: 33px;
+  }
+}
+
+.container {
+  padding-top: 18px;
+}
+
+.main_wrapper{
+  background: #ffffff;
+  padding: 22px 28px 0px;
+  border-radius: 2px;
+  box-shadow: 0 2px 4px #E3E9F3;
+}
+
+.ctmForm {
+  padding-top: 2.6rem;
+}
\ No newline at end of file
diff --git a/packages/strapi-plugin-content-manager/admin/src/translations/en.json b/packages/strapi-plugin-content-manager/admin/src/translations/en.json
index a44c540879..760b7eda7c 100755
--- a/packages/strapi-plugin-content-manager/admin/src/translations/en.json
+++ b/packages/strapi-plugin-content-manager/admin/src/translations/en.json
@@ -14,6 +14,9 @@
   "containers.List.pluginHeaderDescription.singular": "{label} entry found",
   "components.LimitSelect.itemsPerPage": "Items per page",
   "containers.List.errorFetchRecords": "Error",
+  "containers.SettingsPage.pluginHeaderDescription": "Configure the default settings for all your content types",
+  "containers.SettingsPage.Block.generalSettings.description": "Configure the default options for your content types",
+  "containers.SettingsPage.Block.generalSettings.title": "General",
 
   "components.AddFilterCTA.add": "Filters",
   "components.AddFilterCTA.hide": "Filters",
@@ -71,6 +74,12 @@
   "error.validation.minSupMax": "Can't be superior",
   "error.validation.json": "This is not a JSON",
 
+  "form.Input.search": "Enable search",
+  "form.Input.filters": "Enable filters",
+  "form.Input.bulkActions": "Enable bulk actions",
+  "form.Input.pageEntries": "Entries per page",
+  "form.Input.pageEntries.inputDescription": "Note: You can override this value in the Content Type settings page.",
+
   "notification.error.relationship.fetch": "An error occurred during relationship fetch.",
 
   "success.record.delete": "Deleted",
diff --git a/packages/strapi-plugin-content-manager/admin/src/translations/fr.json b/packages/strapi-plugin-content-manager/admin/src/translations/fr.json
index 6fe8272067..6d3727164b 100755
--- a/packages/strapi-plugin-content-manager/admin/src/translations/fr.json
+++ b/packages/strapi-plugin-content-manager/admin/src/translations/fr.json
@@ -15,6 +15,9 @@
   "containers.List.pluginHeaderDescription.singular": "{label} entrée trouvée",
   "components.LimitSelect.itemsPerPage": "Éléments par page",
   "containers.List.errorFetchRecords": "Erreur",
+  "containers.SettingsPage.pluginHeaderDescription": "Configurez les paramètres par défaut de vos modèles",
+  "containers.SettingsPage.Block.generalSettings.description": "Configurez  les options par défault de vos modèles",
+  "containers.SettingsPage.Block.generalSettings.title": "Général",
 
   "components.AddFilterCTA.add": "Filtres",
   "components.AddFilterCTA.hide": "Filtres",
@@ -71,6 +74,12 @@
   "error.validation.minSupMax": "Ne peut pas être plus grand",
   "error.validation.json": "Le format JSON n'est pas respecté",
 
+  "form.Input.search": "Autoriser la search",
+  "form.Input.filters": "Autoriser les filtres",
+  "form.Input.bulkActions": "Autoriser les bulk actions",
+  "form.Input.pageEntries": "Nombre d'entrées par page",
+  "form.Input.pageEntries.inputDescription": "Note: Vous pouvez les modifier ces valeurs par modèle",
+
   "notification.error.relationship.fetch": "Une erreur est survenue en récupérant les relations.",
 
   "success.record.delete": "Supprimé",
diff --git a/packages/strapi-plugin-content-manager/config/functions/bootstrap.js b/packages/strapi-plugin-content-manager/config/functions/bootstrap.js
index 626edd6434..f740d37dc6 100644
--- a/packages/strapi-plugin-content-manager/config/functions/bootstrap.js
+++ b/packages/strapi-plugin-content-manager/config/functions/bootstrap.js
@@ -27,7 +27,17 @@ module.exports = async cb => {
   }, {});
   
   // Init schema
-  const schema = { plugins: {} };
+  const schema = {
+    generalSettings: {
+      search: true,
+      filters: true,
+      bulkActions: true,
+      pageEntries: 10,
+    },
+    models: {
+      plugins: {},
+    },
+  };
   
   const buildSchema = (model, name, plugin = false) => {
     // Model data
@@ -38,7 +48,7 @@ module.exports = async cb => {
       search: true,
       filters: true,
       bulkActions: true,
-      pageEntries: 20,
+      pageEntries: 10,
       defaultSort: 'id'
     }, model);
   
@@ -56,7 +66,12 @@ module.exports = async cb => {
     schemaModel.listDisplay = Object.keys(schemaModel.fields)
       // Construct Array of attr ex { type: 'string', label: 'Foo', name: 'Foo', description: '' }
       // NOTE: Do we allow sort on boolean?
-      .map(attr => Object.assign(schemaModel.fields[attr], { name: attr, sortable: true, searchable: true }))
+      .map(attr => {
+        const attrType = schemaModel.fields[attr].type;
+        const sortable = attrType !== 'json' && attrType !== 'array';
+
+        return Object.assign(schemaModel.fields[attr], { name: attr, sortable, searchable: sortable });
+      })
       // Retrieve only the fourth first items
       .slice(0, 4);
       
@@ -64,6 +79,8 @@ module.exports = async cb => {
       name: model.primaryKey || 'id',
       label: 'Id',
       type: 'string',
+      sortable: true,
+      searchable: true,
     });
     
     if (model.associations) {
@@ -88,11 +105,11 @@ module.exports = async cb => {
     }
   
     if (plugin) {
-      return _.set(schema.plugins, `${plugin}.${name}`, schemaModel);
+      return _.set(schema.models.plugins, `${plugin}.${name}`, schemaModel);
     }
   
     // Set the formatted model to the schema
-    schema[name] = schemaModel;
+    schema.models[name] = schemaModel;
   };
   
   _.forEach(pluginsModel, (plugin, pluginName) => {
@@ -130,11 +147,11 @@ module.exports = async cb => {
   
     if (!prevSchema) {
       pluginStore.set({ key: 'schema', value: schema });
-      cb(); 
+      return cb(); 
     }
   
-    const prevSchemaKeys = buildSchemaKeys(prevSchema);
-    const schemaKeys = buildSchemaKeys(schema);
+    const prevSchemaKeys = buildSchemaKeys(prevSchema.models);
+    const schemaKeys = buildSchemaKeys(schema.models);
   
     // Update the store with the new created APIs
     if (!_.isEqual(prevSchemaKeys, schemaKeys)) {

From f857f2be8b5e5660a496b9b864927bec82bea354 Mon Sep 17 00:00:00 2001
From: cyril lopez <cyril.lpz@gmail.com>
Date: Thu, 28 Jun 2018 18:39:36 +0200
Subject: [PATCH 12/65] Apply settings in list view

---
 .../admin/src/components/Table/index.js       |  4 +
 .../admin/src/components/TableHeader/index.js | 33 ++++---
 .../src/components/TableHeader/styles.scss    |  8 ++
 .../admin/src/components/TableRow/index.js    | 29 ++++--
 .../admin/src/components/TableRow/styles.scss |  2 +-
 .../admin/src/containers/App/actions.js       | 14 +++
 .../admin/src/containers/App/constants.js     |  2 +
 .../admin/src/containers/App/reducer.js       | 14 ++-
 .../admin/src/containers/App/selectors.js     |  4 +
 .../admin/src/containers/ListPage/index.js    | 97 +++++++++++--------
 .../src/containers/SettingsPage/index.js      | 48 +++++++--
 .../admin/src/translations/en.json            |  3 +-
 .../admin/src/translations/fr.json            |  3 +-
 13 files changed, 183 insertions(+), 78 deletions(-)

diff --git a/packages/strapi-plugin-content-manager/admin/src/components/Table/index.js b/packages/strapi-plugin-content-manager/admin/src/components/Table/index.js
index 97f5a79fef..d8f3b7d678 100755
--- a/packages/strapi-plugin-content-manager/admin/src/components/Table/index.js
+++ b/packages/strapi-plugin-content-manager/admin/src/components/Table/index.js
@@ -29,6 +29,7 @@ class Table extends React.Component {
       ) :
       this.props.records.map((record, key) => (
         <TableRow
+          enableBulkActions={this.props.enableBulkActions}
           onChange={this.props.onClickSelect}
           key={key}
           destination={`${this.props.route.path.replace(':slug', this.props.routeParams.slug)}/${record[this.props.primaryKey]}`}
@@ -46,6 +47,7 @@ class Table extends React.Component {
     return (
       <table className={`table ${styles.table}`}>
         <TableHeader
+          enableBulkActions={this.props.enableBulkActions}
           onClickSelectAll={this.props.onClickSelectAll}
           value={this.props.deleteAllValue}
           headers={this.props.headers}
@@ -74,6 +76,7 @@ Table.contextTypes = {
 };
 
 Table.defaultProps = {
+  enableBulkActions: true,
   entriesToDelete: [],
   handleDelete: () => {},
   search: '',
@@ -82,6 +85,7 @@ Table.defaultProps = {
 
 Table.propTypes = {
   deleteAllValue: PropTypes.bool.isRequired,
+  enableBulkActions: PropTypes.bool,
   entriesToDelete: PropTypes.array,
   filters: PropTypes.array.isRequired,
   handleDelete: PropTypes.func,
diff --git a/packages/strapi-plugin-content-manager/admin/src/components/TableHeader/index.js b/packages/strapi-plugin-content-manager/admin/src/components/TableHeader/index.js
index f7fe1923c2..fdb2f8731b 100755
--- a/packages/strapi-plugin-content-manager/admin/src/components/TableHeader/index.js
+++ b/packages/strapi-plugin-content-manager/admin/src/components/TableHeader/index.js
@@ -6,6 +6,7 @@
 
 import React from 'react';
 import PropTypes from 'prop-types';
+import cn from 'classnames';
 
 import CustomInputCheckbox from 'components/CustomInputCheckbox';
 
@@ -22,17 +23,23 @@ class TableHeader extends React.Component {
     }
   }
 
-  renderBulk = () => (
-    <th key="bulk_action">
-      <CustomInputCheckbox
-        entriesToDelete={this.props.entriesToDelete}
-        isAll
-        name="all"
-        onChange={this.props.onClickSelectAll}
-        value={this.props.value}
-      />
-    </th>
-  );
+  renderBulk = () => {
+    if (this.props.enableBulkActions) {
+      return (
+        <th key="bulk_action">
+          <CustomInputCheckbox
+            entriesToDelete={this.props.entriesToDelete}
+            isAll
+            name="all"
+            onChange={this.props.onClickSelectAll}
+            value={this.props.value}
+          />
+        </th>
+      );
+    }
+
+    return null;
+  }
 
   render() {
     // Generate headers list
@@ -64,7 +71,7 @@ class TableHeader extends React.Component {
     headers.push(<th key="th_action"></th>);
 
     return (
-      <thead className={styles.tableHeader}>
+      <thead className={cn(styles.tableHeader, this.props.enableBulkActions && styles.withBulk)}>
         <tr >
           {[this.renderBulk()].concat(headers)}
         </tr>
@@ -74,10 +81,12 @@ class TableHeader extends React.Component {
 }
 
 TableHeader.defaultProps = {
+  enableBulkActions: true,
   value: false,
 };
 
 TableHeader.propTypes = {
+  enableBulkActions: PropTypes.bool,
   entriesToDelete: PropTypes.array.isRequired,
   headers: PropTypes.array.isRequired,
   onChangeSort: PropTypes.func.isRequired,
diff --git a/packages/strapi-plugin-content-manager/admin/src/components/TableHeader/styles.scss b/packages/strapi-plugin-content-manager/admin/src/components/TableHeader/styles.scss
index 9b5d95c27b..82765f2cfe 100755
--- a/packages/strapi-plugin-content-manager/admin/src/components/TableHeader/styles.scss
+++ b/packages/strapi-plugin-content-manager/admin/src/components/TableHeader/styles.scss
@@ -15,6 +15,14 @@
     }
   }
 
+  // > tr {
+  //   th:first-child {
+  //     width: 50px;
+  //   }
+  // }
+}
+
+.withBulk {
   > tr {
     th:first-child {
       width: 50px;
diff --git a/packages/strapi-plugin-content-manager/admin/src/components/TableRow/index.js b/packages/strapi-plugin-content-manager/admin/src/components/TableRow/index.js
index c724b57d8a..50bb74aedf 100755
--- a/packages/strapi-plugin-content-manager/admin/src/components/TableRow/index.js
+++ b/packages/strapi-plugin-content-manager/admin/src/components/TableRow/index.js
@@ -8,6 +8,7 @@ import React from 'react';
 import PropTypes from 'prop-types';
 import moment from 'moment';
 import { isEmpty, isObject, toString } from 'lodash';
+import cn from 'classnames';
 
 import CustomInputCheckbox from 'components/CustomInputCheckbox';
 import IcoContainer from 'components/IcoContainer';
@@ -100,19 +101,25 @@ class TableRow extends React.Component {
       .concat([this.renderAction()]);
   }
 
-  renderDelete = () => (
-    <td onClick={(e) => e.stopPropagation()} key="i">
-      <CustomInputCheckbox
-        name={this.props.record.id}
-        onChange={this.props.onChange}
-        value={this.props.value}
-      />
-    </td>
-  );
+  renderDelete = () => {
+    if (this.props.enableBulkActions) {
+      return (
+        <td onClick={(e) => e.stopPropagation()} key="i">
+          <CustomInputCheckbox
+            name={this.props.record.id}
+            onChange={this.props.onChange}
+            value={this.props.value}
+          />
+        </td>
+      );
+    }
+
+    return null;
+  }
 
   render() {
     return (
-      <tr className={styles.tableRow} onClick={() => this.handleClick(this.props.destination)}>
+      <tr className={cn(styles.tableRow, this.props.enableBulkActions && styles.tableRowWithBulk)} onClick={() => this.handleClick(this.props.destination)}>
         {this.renderCells()}
       </tr>
     );
@@ -124,11 +131,13 @@ TableRow.contextTypes = {
 };
 
 TableRow.defaultProps = {
+  enableBulkActions: true,
   value: false,
 };
 
 TableRow.propTypes = {
   destination: PropTypes.string.isRequired,
+  enableBulkActions: PropTypes.bool,
   headers: PropTypes.array.isRequired,
   onChange: PropTypes.func.isRequired,
   onDelete: PropTypes.func,
diff --git a/packages/strapi-plugin-content-manager/admin/src/components/TableRow/styles.scss b/packages/strapi-plugin-content-manager/admin/src/components/TableRow/styles.scss
index d7433c1466..70dfed74f2 100755
--- a/packages/strapi-plugin-content-manager/admin/src/components/TableRow/styles.scss
+++ b/packages/strapi-plugin-content-manager/admin/src/components/TableRow/styles.scss
@@ -17,7 +17,7 @@
     border-top: 1px solid #F1F1F2 !important;
   }
   > td:first-child {
-    width: 50px;    
+    // width: 50px;    
   }
 }
 
diff --git a/packages/strapi-plugin-content-manager/admin/src/containers/App/actions.js b/packages/strapi-plugin-content-manager/admin/src/containers/App/actions.js
index 6553e76f68..95440ee724 100755
--- a/packages/strapi-plugin-content-manager/admin/src/containers/App/actions.js
+++ b/packages/strapi-plugin-content-manager/admin/src/containers/App/actions.js
@@ -12,6 +12,8 @@ import {
   LOAD_MODELS,
   LOADED_MODELS,
   ON_CHANGE,
+  ON_RESET,
+  ON_SUBMIT,
 } from './constants';
 
 export function emptyStore() {
@@ -56,4 +58,16 @@ export function onChange({ target }) {
     keys: target.name.split('.'),
     value,
   };
+}
+
+export function onReset() {
+  return {
+    type: ON_RESET,
+  };
+}
+
+export function onSubmit() {
+  return {
+    type: ON_SUBMIT,
+  };
 }
\ No newline at end of file
diff --git a/packages/strapi-plugin-content-manager/admin/src/containers/App/constants.js b/packages/strapi-plugin-content-manager/admin/src/containers/App/constants.js
index 5c420cba8e..2731d7aeb5 100755
--- a/packages/strapi-plugin-content-manager/admin/src/containers/App/constants.js
+++ b/packages/strapi-plugin-content-manager/admin/src/containers/App/constants.js
@@ -10,3 +10,5 @@ export const GET_MODEL_ENTRIES_SUCCEEDED = 'contentManager/App/GET_MODEL_ENTRIES
 export const LOAD_MODELS = 'contentManager/App/LOAD_MODELS';
 export const LOADED_MODELS = 'contentManager/App/LOADED_MODELS';
 export const ON_CHANGE = 'contentManager/App/ON_CHANGE';
+export const ON_RESET = 'contentManager/App/ON_RESET';
+export const ON_SUBMIT = 'contentManager/App/ON_SUBMIT';
diff --git a/packages/strapi-plugin-content-manager/admin/src/containers/App/reducer.js b/packages/strapi-plugin-content-manager/admin/src/containers/App/reducer.js
index 65426c21f4..d9f653c1b3 100755
--- a/packages/strapi-plugin-content-manager/admin/src/containers/App/reducer.js
+++ b/packages/strapi-plugin-content-manager/admin/src/containers/App/reducer.js
@@ -11,11 +11,14 @@ import {
   LOAD_MODELS,
   LOADED_MODELS,
   ON_CHANGE,
+  ON_RESET,
+  ON_SUBMIT,
 } from './constants';
 
 const initialState = fromJS({
   modelEntries: 0,
   loading: true,
+  modifiedSchema: fromJS({}),
   schema: fromJS({}),
   formValidations: List([]),
 });
@@ -31,11 +34,12 @@ function appReducer(state = initialState, action) {
     case LOADED_MODELS:
       return state
         .update('schema', () => fromJS(action.models.models))
+        .update('modifiedSchema', () => fromJS(action.models.models))
         .set('loading', false);
     case ON_CHANGE:
       return state
-        .updateIn(['schema'].concat(action.keys), () => action.value)
-        .updateIn(['schema', 'models'], models => {
+        .updateIn(['modifiedSchema'].concat(action.keys), () => action.value)
+        .updateIn(['modifiedSchema', 'models'], models => {
           return models
             .keySeq()
             .reduce((acc, current) => {
@@ -58,6 +62,12 @@ function appReducer(state = initialState, action) {
                 }, acc);
             }, models);
         });
+    case ON_RESET:
+      return state
+        .update('modifiedSchema', () => state.get('schema'));
+    case ON_SUBMIT:
+      return state
+        .update('schema', () => state.get('modifiedSchema'));
     default:
       return state;
   }
diff --git a/packages/strapi-plugin-content-manager/admin/src/containers/App/selectors.js b/packages/strapi-plugin-content-manager/admin/src/containers/App/selectors.js
index 6f0fa11763..943df4d4dc 100755
--- a/packages/strapi-plugin-content-manager/admin/src/containers/App/selectors.js
+++ b/packages/strapi-plugin-content-manager/admin/src/containers/App/selectors.js
@@ -41,10 +41,14 @@ const makeSelectLoading = () =>
 const makeSelectSchema = () =>
   createSelector(selectGlobalDomain(), substate => substate.get('schema').toJS());
 
+const makeSelectModifiedSchema = () =>
+  createSelector(selectGlobalDomain(), substate => substate.get('modifiedSchema').toJS());
+
 export {
   selectGlobalDomain,
   selectLocationState,
   makeSelectLoading,
   makeSelectModelEntries,
+  makeSelectModifiedSchema,
   makeSelectSchema,
 };
diff --git a/packages/strapi-plugin-content-manager/admin/src/containers/ListPage/index.js b/packages/strapi-plugin-content-manager/admin/src/containers/ListPage/index.js
index 7cf91b42ec..5c060fecbf 100644
--- a/packages/strapi-plugin-content-manager/admin/src/containers/ListPage/index.js
+++ b/packages/strapi-plugin-content-manager/admin/src/containers/ListPage/index.js
@@ -145,8 +145,8 @@ export class ListPage extends React.Component {
    * @return {Object} Fields
    */
   getCurrentSchema = () =>
-    get(this.props.schema, [this.getCurrentModelName(), 'fields']) ||
-    get(this.props.schema, ['plugins', this.getSource(), this.getCurrentModelName(), 'fields']);
+    get(this.props.schema, ['models', this.getCurrentModelName(), 'fields']) ||
+    get(this.props.schema, ['models', 'plugins', this.getSource(), this.getCurrentModelName(), 'fields']);
 
   getPopUpDeleteAllMsg = () => (
     this.props.listPage.entriesToDelete.length > 1 ?
@@ -296,6 +296,12 @@ export class ListPage extends React.Component {
     return updatingParams || isLoading && get(records, this.getCurrentModelName()) === undefined;
   }
 
+  showSearch = () => get(this.getCurrentModel(), ['search']);
+
+  showFilters = () => get(this.getCurrentModel(), ['filters']);
+
+  showBulkActions = () => get(this.getCurrentModel(), ['bulkActions']);
+
   render() {
     const {
       addFilter,
@@ -341,12 +347,14 @@ export class ListPage extends React.Component {
     return (
       <div>
         <div className={cn('container-fluid', styles.containerFluid)}>
-          <Search
-            changeParams={this.props.changeParams}
-            initValue={getQueryParameters(this.props.location.search, '_q') || ''}
-            model={this.getCurrentModelName()}
-            value={params._q}
-          />
+          {this.showSearch() && (
+            <Search
+              changeParams={this.props.changeParams}
+              initValue={getQueryParameters(this.props.location.search, '_q') || ''}
+              model={this.getCurrentModelName()}
+              value={params._q}
+            />
+          )}
           <PluginHeader
             actions={pluginHeaderActions}
             description={{
@@ -364,55 +372,58 @@ export class ListPage extends React.Component {
             withDescriptionAnim={this.showLoaders()}
           />
           <div className={cn(styles.wrapper)}>
-            <FiltersPickWrapper
-              addFilter={addFilter}
-              appliedFilters={appliedFilters}
-              close={onToggleFilters}
-              filterToFocus={filterToFocus}
-              modelName={this.getCurrentModelName()}
-              onChange={onChange}
-              onSubmit={this.handleSubmit}
-              removeAllFilters={removeAllFilters}
-              removeFilter={removeFilter}
-              schema={this.getCurrentSchema()}
-              show={showFilter}
-            />
-            <div className={cn('row', styles.row)}>
-              <div className="col-md-12">
-                <Div
-                  decreaseMarginBottom={filters.length > 0}
-                >
-                  <div className="row">
-                    <AddFilterCTA onClick={onToggleFilters} showHideText={showFilter} />
-                    {filters.map((filter, key) => (
-                      <Filter
-                        key={key}
-                        filter={filter}
-                        index={key}
-                        onClick={onClickRemove}
-                        onClickOpen={openFiltersWithSelections}
-                        schema={this.getCurrentSchema()}
-                      />
-                    ))}
+            {this.showFilters() && (
+              <React.Fragment>
+                <FiltersPickWrapper
+                  addFilter={addFilter}
+                  appliedFilters={appliedFilters}
+                  close={onToggleFilters}
+                  filterToFocus={filterToFocus}
+                  modelName={this.getCurrentModelName()}
+                  onChange={onChange}
+                  onSubmit={this.handleSubmit}
+                  removeAllFilters={removeAllFilters}
+                  removeFilter={removeFilter}
+                  schema={this.getCurrentSchema()}
+                  show={showFilter}
+                />
+                <div className={cn('row', styles.row)}>
+                  <div className="col-md-12">
+                    <Div
+                      decreaseMarginBottom={filters.length > 0}
+                    >
+                      <div className="row">
+                        <AddFilterCTA onClick={onToggleFilters} showHideText={showFilter} />
+                        {filters.map((filter, key) => (
+                          <Filter
+                            key={key}
+                            filter={filter}
+                            index={key}
+                            onClick={onClickRemove}
+                            onClickOpen={openFiltersWithSelections}
+                            schema={this.getCurrentSchema()}
+                          />
+                        ))}
+                      </div>
+                    </Div>
                   </div>
-                </Div>
-              </div>
-            </div>
+                </div>
+              </React.Fragment>
+            )}
             <div className={cn('row', styles.row)}>
               <div className="col-md-12">
                 <Table
                   deleteAllValue={this.areAllEntriesSelected()}
                   entriesToDelete={entriesToDelete}
+                  enableBulkActions={this.showBulkActions()}
                   filters={filters}
                   handleDelete={this.toggleModalWarning}
-                  // headers={this.generateTableHeaders()}
                   headers={this.getTableHeaders()}
                   history={this.props.history}
                   onChangeSort={this.handleChangeSort}
                   onClickSelectAll={onClickSelectAll}
                   onClickSelect={onClickSelect}
                   onToggleDeleteAll={onToggleDeleteAll}
-                  // primaryKey={this.getCurrentModel().primaryKey || 'id'}
                   primaryKey={this.getModelPrimaryKey()}
                   records={get(records, this.getCurrentModelName(), [])}
                   redirectUrl={this.generateRedirectURI()}
diff --git a/packages/strapi-plugin-content-manager/admin/src/containers/SettingsPage/index.js b/packages/strapi-plugin-content-manager/admin/src/containers/SettingsPage/index.js
index 1a9fec6632..3ef2ad4b10 100644
--- a/packages/strapi-plugin-content-manager/admin/src/containers/SettingsPage/index.js
+++ b/packages/strapi-plugin-content-manager/admin/src/containers/SettingsPage/index.js
@@ -11,11 +11,12 @@ import cn from 'classnames';
 import { get } from 'lodash';
 import PropTypes from 'prop-types';
 
-import { onChange } from 'containers/App/actions';
-import { makeSelectSchema } from 'containers/App/selectors';
+import { onChange, onSubmit, onReset } from 'containers/App/actions';
+import { makeSelectModifiedSchema } from 'containers/App/selectors';
 
-import PluginHeader from 'components/PluginHeader';
 import Input from 'components/InputsIndex';
+import PluginHeader from 'components/PluginHeader';
+import PopUpWarning from 'components/PopUpWarning';
 
 import Block from 'components/Block';
 
@@ -30,18 +31,20 @@ import styles from './styles.scss';
 import forms from './forms.json';
 
 class SettingsPage extends React.PureComponent {
+  state = { showWarning: false };
+
   getPluginHeaderActions = () => (
     [
       {
         label: 'content-manager.popUpWarning.button.cancel',
         kind: 'secondary',
-        onClick: () => {},
+        onClick: this.props.onReset,
         type: 'button',
       },
       {
         kind: 'primary',
         label: 'content-manager.containers.Edit.submit',
-        onClick: () => {},
+        onClick: this.handleSubmit,
         type: 'submit',
       },
     ]
@@ -54,7 +57,17 @@ class SettingsPage extends React.PureComponent {
     return input.type === 'toggle' ? value : value.toString();
   }
 
+  handleSubmit = (e) => {
+    e.preventDefault();
+    this.setState({ showWarning: true });
+  }
+
+  toggle = () => this.setState(prevState => ({ showWarning: !prevState.showWarning }));
+
   render() {
+    const { showWarning } = this.state;
+    const { onChange, onSubmit } = this.props;
+
     return (
       <div className={cn('container-fluid', styles.containerFluid)}>
         <PluginHeader
@@ -62,12 +75,27 @@ class SettingsPage extends React.PureComponent {
           title="Content Manager"
           description={{ id: 'content-manager.containers.SettingsPage.pluginHeaderDescription' }}
         />
+        <PopUpWarning
+          isOpen={showWarning}
+          toggleModal={this.toggle}
+          content={{
+            title: 'content-manager.popUpWarning.title',
+            message: 'content-manager.popUpWarning.warning.updateAllSettings',
+            cancel: 'content-manager.popUpWarning.button.cancel',
+            confirm: 'content-manager.popUpWarning.button.confirm',
+          }}
+          popUpWarningType="danger"
+          onConfirm={() => {
+            onSubmit();
+            this.toggle();
+          }}
+        />
         <div className={cn('row', styles.container)}>
           <Block
             description="content-manager.containers.SettingsPage.Block.generalSettings.description"
             title="content-manager.containers.SettingsPage.Block.generalSettings.title"
           >
-            <form onSubmit={(e) => e.preventDefault()} className={styles.ctmForm}>
+            <form onSubmit={this.handleSubmit} className={styles.ctmForm}>
               <div className="row">
                 <div className="col-md-10">
                   <div className="row">
@@ -76,7 +104,7 @@ class SettingsPage extends React.PureComponent {
                       return (
                         <Input
                           key={input.name}
-                          onChange={this.props.onChange}
+                          onChange={onChange}
                           value={this.getValue(input)}
                           {...input}
                         />
@@ -97,6 +125,8 @@ SettingsPage.defaultProps = {};
 
 SettingsPage.propTypes = {
   onChange: PropTypes.func.isRequired,
+  onReset: PropTypes.func.isRequired,
+  onSubmit: PropTypes.func.isRequired,
   schema: PropTypes.object.isRequired,
 };
 
@@ -104,13 +134,15 @@ const mapDispatchToProps = (dispatch) => (
   bindActionCreators(
     {
       onChange,
+      onReset,
+      onSubmit,
     },
     dispatch,
   )
 );
 
 const mapStateToProps = createStructuredSelector({
-  schema: makeSelectSchema(),
+  schema: makeSelectModifiedSchema(),
   settingsPage: makeSelectSettingsPage(),
 });
 
diff --git a/packages/strapi-plugin-content-manager/admin/src/translations/en.json b/packages/strapi-plugin-content-manager/admin/src/translations/en.json
index 760b7eda7c..5d63aff4ff 100755
--- a/packages/strapi-plugin-content-manager/admin/src/translations/en.json
+++ b/packages/strapi-plugin-content-manager/admin/src/translations/en.json
@@ -91,5 +91,6 @@
   "popUpWarning.button.confirm": "Confirm",
   "popUpWarning.title": "Please confirm",
   "popUpWarning.bodyMessage.contentType.delete": "Are you sure you want to delete this entry?",
-  "popUpWarning.bodyMessage.contentType.delete.all": "Are you sure you want to delete theses entries?"
+  "popUpWarning.bodyMessage.contentType.delete.all": "Are you sure you want to delete theses entries?",
+  "popUpWarning.warning.updateAllSettings": "This will modify all your settings"
 }
diff --git a/packages/strapi-plugin-content-manager/admin/src/translations/fr.json b/packages/strapi-plugin-content-manager/admin/src/translations/fr.json
index 6d3727164b..6ce5d2e9e5 100755
--- a/packages/strapi-plugin-content-manager/admin/src/translations/fr.json
+++ b/packages/strapi-plugin-content-manager/admin/src/translations/fr.json
@@ -89,5 +89,6 @@
   "popUpWarning.button.confirm": "Confirmer",
   "popUpWarning.title": "Confirmation requise",
   "popUpWarning.bodyMessage.contentType.delete": "Êtes-vous sûr de vouloir supprimer cette entrée ?",
-  "popUpWarning.bodyMessage.contentType.delete.all": "Êtes-vous sûr de vouloir supprimer ces entrées ?"
+  "popUpWarning.bodyMessage.contentType.delete.all": "Êtes-vous sûr de vouloir supprimer ces entrées ?",
+  "popUpWarning.warning.updateAllSettings": "Cela modifiera tous vos précédents paramètres."
 }

From d5259985fde11d9bcbf649778cc3898017041705 Mon Sep 17 00:00:00 2001
From: cyril lopez <cyril.lpz@gmail.com>
Date: Fri, 29 Jun 2018 12:29:31 +0200
Subject: [PATCH 13/65] Desgin settings-page ctm

---
 .../admin/src/components/Block/styles.scss    |  5 +-
 .../admin/src/components/SettingsRow/index.js | 34 +++++++++++++
 .../src/components/SettingsRow/styles.scss    | 31 ++++++++++++
 .../src/components/TableHeader/styles.scss    |  6 ---
 .../src/containers/SettingsPage/index.js      | 50 ++++++++++++++-----
 .../src/containers/SettingsPage/styles.scss   | 12 +++++
 .../admin/src/translations/en.json            |  2 +
 7 files changed, 120 insertions(+), 20 deletions(-)
 create mode 100644 packages/strapi-plugin-content-manager/admin/src/components/SettingsRow/index.js
 create mode 100644 packages/strapi-plugin-content-manager/admin/src/components/SettingsRow/styles.scss

diff --git a/packages/strapi-plugin-content-manager/admin/src/components/Block/styles.scss b/packages/strapi-plugin-content-manager/admin/src/components/Block/styles.scss
index b014a7f2d8..bb594ce73c 100644
--- a/packages/strapi-plugin-content-manager/admin/src/components/Block/styles.scss
+++ b/packages/strapi-plugin-content-manager/admin/src/components/Block/styles.scss
@@ -1,9 +1,10 @@
 .ctmBlock{
+  margin-bottom: 35px;
   background: #ffffff;
-  padding: 22px 28px 0px;
+  padding: 22px 28px 18px;
   border-radius: 2px;
   box-shadow: 0 2px 4px #E3E9F3;
-  webkit-font-smoothing: antialiased;
+  -webkit-font-smoothing: antialiased;
 }
 
 .ctmBlockTitle {
diff --git a/packages/strapi-plugin-content-manager/admin/src/components/SettingsRow/index.js b/packages/strapi-plugin-content-manager/admin/src/components/SettingsRow/index.js
new file mode 100644
index 0000000000..91daf6a37d
--- /dev/null
+++ b/packages/strapi-plugin-content-manager/admin/src/components/SettingsRow/index.js
@@ -0,0 +1,34 @@
+/**
+ * 
+ * SettingsRow
+ */
+
+import React from 'react';
+import { upperFirst } from 'lodash';
+import PropTypes from 'prop-types';
+import IcoContainer from 'components/IcoContainer';
+
+import styles from './styles.scss';
+
+
+function SettingsRow({name }) {
+  return (
+    <div className={styles.settingsRow}>
+      <div>
+        <div className={styles.frame}>
+          <div className={styles.icon}>
+            <i className="fa fa-cube"></i>
+          </div>
+          {upperFirst(name)}
+        </div>
+        <IcoContainer icons={[{icoType: 'cog'}]} />
+      </div>
+    </div>
+  );
+}
+
+SettingsRow.propTypes = {
+  name: PropTypes.string.isRequired,
+};
+
+export default SettingsRow;
diff --git a/packages/strapi-plugin-content-manager/admin/src/components/SettingsRow/styles.scss b/packages/strapi-plugin-content-manager/admin/src/components/SettingsRow/styles.scss
new file mode 100644
index 0000000000..c9645640de
--- /dev/null
+++ b/packages/strapi-plugin-content-manager/admin/src/components/SettingsRow/styles.scss
@@ -0,0 +1,31 @@
+.settingsRow {
+  height: 54px;
+
+  &:hover {
+    background-color: #F7F8F8;
+  }
+  > div {
+    display: flex;
+    line-height: 53px;
+    margin:  0 28px 0 36px;
+    justify-content: space-between;
+    border-bottom: 1px solid rgba(14,22,34,0.04);
+    font-size: 13px;
+    color: #333740;
+  }
+  cursor: pointer;
+}
+
+.icon {
+  position: absolute;
+  left: 0;
+  height: 53px;
+  display: flex;
+  flex-direction: column;
+  justify-content: center;
+}
+
+.frame {
+  position: relative;
+  padding-left: 55px;
+}
\ No newline at end of file
diff --git a/packages/strapi-plugin-content-manager/admin/src/components/TableHeader/styles.scss b/packages/strapi-plugin-content-manager/admin/src/components/TableHeader/styles.scss
index 82765f2cfe..172afc27bd 100755
--- a/packages/strapi-plugin-content-manager/admin/src/components/TableHeader/styles.scss
+++ b/packages/strapi-plugin-content-manager/admin/src/components/TableHeader/styles.scss
@@ -14,12 +14,6 @@
       cursor: pointer;
     }
   }
-
-  // > tr {
-  //   th:first-child {
-  //     width: 50px;
-  //   }
-  // }
 }
 
 .withBulk {
diff --git a/packages/strapi-plugin-content-manager/admin/src/containers/SettingsPage/index.js b/packages/strapi-plugin-content-manager/admin/src/containers/SettingsPage/index.js
index 3ef2ad4b10..c1f4f146c5 100644
--- a/packages/strapi-plugin-content-manager/admin/src/containers/SettingsPage/index.js
+++ b/packages/strapi-plugin-content-manager/admin/src/containers/SettingsPage/index.js
@@ -8,7 +8,7 @@ import { connect } from 'react-redux';
 import { bindActionCreators, compose } from 'redux';
 import { createStructuredSelector } from 'reselect';
 import cn from 'classnames';
-import { get } from 'lodash';
+import { get, sortBy } from 'lodash';
 import PropTypes from 'prop-types';
 
 import { onChange, onSubmit, onReset } from 'containers/App/actions';
@@ -19,6 +19,7 @@ import PluginHeader from 'components/PluginHeader';
 import PopUpWarning from 'components/PopUpWarning';
 
 import Block from 'components/Block';
+import SettingsRow from 'components/SettingsRow';
 
 import injectReducer from 'utils/injectReducer';
 import injectSaga from 'utils/injectSaga';
@@ -33,6 +34,26 @@ import forms from './forms.json';
 class SettingsPage extends React.PureComponent {
   state = { showWarning: false };
 
+  getModels = (data = this.props.schema.models, destination = '') => {
+    const models = Object.keys(data).reduce((acc, curr) => {
+      if (curr !== 'plugins') {
+  
+        if (!data[curr].fields && _.isObject(data[curr])) {
+          return this.getModels(data[curr], `${destination}/${curr}`);
+        }
+        
+        return acc.concat([{ name: curr, destination: `${destination}/${curr}` }]);
+      } 
+    
+      return this.getModels(data[curr], `${destination}/${curr}`);
+    }, []);
+
+    return sortBy(
+      models.filter(obj => obj.name !== 'permission' && obj.name !== 'role'),
+      ['name'],
+    );
+  }
+
   getPluginHeaderActions = () => (
     [
       {
@@ -99,22 +120,27 @@ class SettingsPage extends React.PureComponent {
               <div className="row">
                 <div className="col-md-10">
                   <div className="row">
-                    {forms.inputs.map(input => {
-
-                      return (
-                        <Input
-                          key={input.name}
-                          onChange={onChange}
-                          value={this.getValue(input)}
-                          {...input}
-                        />
-                      );
-                    })}
+                    {forms.inputs.map(input => (
+                      <Input
+                        key={input.name}
+                        onChange={onChange}
+                        value={this.getValue(input)}
+                        {...input}
+                      />
+                    ))}
                   </div>
                 </div>
               </div>
             </form>
           </Block>
+          <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} />)}
+            </div>
+          </Block>
         </div>
       </div>
     );
diff --git a/packages/strapi-plugin-content-manager/admin/src/containers/SettingsPage/styles.scss b/packages/strapi-plugin-content-manager/admin/src/containers/SettingsPage/styles.scss
index 944eb6d40f..c132030d6f 100644
--- a/packages/strapi-plugin-content-manager/admin/src/containers/SettingsPage/styles.scss
+++ b/packages/strapi-plugin-content-manager/admin/src/containers/SettingsPage/styles.scss
@@ -18,4 +18,16 @@
 
 .ctmForm {
   padding-top: 2.6rem;
+}
+
+.contentTypesWrapper {
+  padding-top: 9px;
+  margin-left: -28px;
+  margin-right: -28px;
+  > div:first-child {
+    > div {
+
+      border-top: none;
+    }
+  }
 }
\ No newline at end of file
diff --git a/packages/strapi-plugin-content-manager/admin/src/translations/en.json b/packages/strapi-plugin-content-manager/admin/src/translations/en.json
index 5d63aff4ff..afabd61a03 100755
--- a/packages/strapi-plugin-content-manager/admin/src/translations/en.json
+++ b/packages/strapi-plugin-content-manager/admin/src/translations/en.json
@@ -17,6 +17,8 @@
   "containers.SettingsPage.pluginHeaderDescription": "Configure the default settings for all your content types",
   "containers.SettingsPage.Block.generalSettings.description": "Configure the default options for your content types",
   "containers.SettingsPage.Block.generalSettings.title": "General",
+  "containers.SettingsPage.Block.contentType.title": "Content Types",
+  "containers.SettingsPage.Block.contentType.description": "Configure the specific settings",
 
   "components.AddFilterCTA.add": "Filters",
   "components.AddFilterCTA.hide": "Filters",

From 4393511aaba1b572bec58016db3a21b464afc2c2 Mon Sep 17 00:00:00 2001
From: cyril lopez <cyril.lpz@gmail.com>
Date: Fri, 29 Jun 2018 15:07:15 +0200
Subject: [PATCH 14/65] Created SettingPage container and add the form to
 modify the default settings per content type

---
 .../admin/src/components/SettingsRow/index.js |   6 +-
 .../admin/src/containers/App/actions.js       |  11 +
 .../admin/src/containers/App/constants.js     |   1 +
 .../admin/src/containers/App/index.js         |   2 +
 .../admin/src/containers/App/reducer.js       |   4 +
 .../src/containers/SettingPage/actions.js     |   0
 .../src/containers/SettingPage/constants.js   |   0
 .../src/containers/SettingPage/forms.json     |  63 ++++++
 .../admin/src/containers/SettingPage/index.js | 190 ++++++++++++++++++
 .../src/containers/SettingPage/reducer.js     |  17 ++
 .../admin/src/containers/SettingPage/saga.js  |   3 +
 .../src/containers/SettingPage/selectors.js   |  24 +++
 .../src/containers/SettingPage/styles.scss    |  21 ++
 .../src/containers/SettingsPage/index.js      |  19 +-
 .../src/containers/SettingsPage/reducer.js    |   4 +-
 .../admin/src/containers/SettingsPage/saga.js |  11 -
 .../admin/src/translations/en.json            |   8 +-
 .../admin/src/translations/fr.json            |   5 +-
 .../config/functions/bootstrap.js             |   3 +-
 19 files changed, 365 insertions(+), 27 deletions(-)
 create mode 100644 packages/strapi-plugin-content-manager/admin/src/containers/SettingPage/actions.js
 create mode 100644 packages/strapi-plugin-content-manager/admin/src/containers/SettingPage/constants.js
 create mode 100644 packages/strapi-plugin-content-manager/admin/src/containers/SettingPage/forms.json
 create mode 100644 packages/strapi-plugin-content-manager/admin/src/containers/SettingPage/index.js
 create mode 100644 packages/strapi-plugin-content-manager/admin/src/containers/SettingPage/reducer.js
 create mode 100644 packages/strapi-plugin-content-manager/admin/src/containers/SettingPage/saga.js
 create mode 100644 packages/strapi-plugin-content-manager/admin/src/containers/SettingPage/selectors.js
 create mode 100644 packages/strapi-plugin-content-manager/admin/src/containers/SettingPage/styles.scss

diff --git a/packages/strapi-plugin-content-manager/admin/src/components/SettingsRow/index.js b/packages/strapi-plugin-content-manager/admin/src/components/SettingsRow/index.js
index 91daf6a37d..1375637bd8 100644
--- a/packages/strapi-plugin-content-manager/admin/src/components/SettingsRow/index.js
+++ b/packages/strapi-plugin-content-manager/admin/src/components/SettingsRow/index.js
@@ -11,9 +11,9 @@ import IcoContainer from 'components/IcoContainer';
 import styles from './styles.scss';
 
 
-function SettingsRow({name }) {
+function SettingsRow({ destination, name, onClick }) {
   return (
-    <div className={styles.settingsRow}>
+    <div className={styles.settingsRow} onClick={() => onClick(destination)}>
       <div>
         <div className={styles.frame}>
           <div className={styles.icon}>
@@ -28,7 +28,9 @@ function SettingsRow({name }) {
 }
 
 SettingsRow.propTypes = {
+  destination: PropTypes.string.isRequired,
   name: PropTypes.string.isRequired,
+  onClick: PropTypes.func.isRequired,
 };
 
 export default SettingsRow;
diff --git a/packages/strapi-plugin-content-manager/admin/src/containers/App/actions.js b/packages/strapi-plugin-content-manager/admin/src/containers/App/actions.js
index 95440ee724..d645f2a089 100755
--- a/packages/strapi-plugin-content-manager/admin/src/containers/App/actions.js
+++ b/packages/strapi-plugin-content-manager/admin/src/containers/App/actions.js
@@ -12,6 +12,7 @@ import {
   LOAD_MODELS,
   LOADED_MODELS,
   ON_CHANGE,
+  ON_CHANGE_SETTINGS,
   ON_RESET,
   ON_SUBMIT,
 } from './constants';
@@ -60,6 +61,16 @@ export function onChange({ target }) {
   };
 }
 
+export function onChangeSettings({ target }) {
+  const value = includes(target.name, 'pageEntries') ? parseInt(target.value, 10) : target.value;
+
+  return {
+    type: ON_CHANGE_SETTINGS,
+    keys: target.name.split('.'),
+    value,
+  };
+}
+
 export function onReset() {
   return {
     type: ON_RESET,
diff --git a/packages/strapi-plugin-content-manager/admin/src/containers/App/constants.js b/packages/strapi-plugin-content-manager/admin/src/containers/App/constants.js
index 2731d7aeb5..670095218e 100755
--- a/packages/strapi-plugin-content-manager/admin/src/containers/App/constants.js
+++ b/packages/strapi-plugin-content-manager/admin/src/containers/App/constants.js
@@ -10,5 +10,6 @@ export const GET_MODEL_ENTRIES_SUCCEEDED = 'contentManager/App/GET_MODEL_ENTRIES
 export const LOAD_MODELS = 'contentManager/App/LOAD_MODELS';
 export const LOADED_MODELS = 'contentManager/App/LOADED_MODELS';
 export const ON_CHANGE = 'contentManager/App/ON_CHANGE';
+export const ON_CHANGE_SETTINGS = 'contentManager/App/ON_CHANGE_SETTINGS';
 export const ON_RESET = 'contentManager/App/ON_RESET';
 export const ON_SUBMIT = 'contentManager/App/ON_SUBMIT';
diff --git a/packages/strapi-plugin-content-manager/admin/src/containers/App/index.js b/packages/strapi-plugin-content-manager/admin/src/containers/App/index.js
index 4a6b0af01b..77939cfb7f 100755
--- a/packages/strapi-plugin-content-manager/admin/src/containers/App/index.js
+++ b/packages/strapi-plugin-content-manager/admin/src/containers/App/index.js
@@ -19,6 +19,7 @@ import getQueryParameters from 'utils/getQueryParameters';
 import EditPage from 'containers/EditPage';
 import ListPage from 'containers/ListPage';
 import SettingsPage from 'containers/SettingsPage';
+import SettingPage from 'containers/SettingPage';
 import LoadingIndicatorPage from 'components/LoadingIndicatorPage';
 import EmptyAttributesView from 'components/EmptyAttributesView';
 
@@ -50,6 +51,7 @@ class App extends React.Component {
     return (
       <div className="content-manager">
         <Switch>
+          <Route path="/plugins/content-manager/ctm-configurations/:slug" component={SettingPage} />
           <Route path="/plugins/content-manager/ctm-configurations" component={SettingsPage} />
           <Route path="/plugins/content-manager/:slug/:id" component={EditPage} />
           <Route path="/plugins/content-manager/:slug" component={ListPage} />
diff --git a/packages/strapi-plugin-content-manager/admin/src/containers/App/reducer.js b/packages/strapi-plugin-content-manager/admin/src/containers/App/reducer.js
index d9f653c1b3..3e63af579d 100755
--- a/packages/strapi-plugin-content-manager/admin/src/containers/App/reducer.js
+++ b/packages/strapi-plugin-content-manager/admin/src/containers/App/reducer.js
@@ -11,6 +11,7 @@ import {
   LOAD_MODELS,
   LOADED_MODELS,
   ON_CHANGE,
+  ON_CHANGE_SETTINGS,
   ON_RESET,
   ON_SUBMIT,
 } from './constants';
@@ -62,6 +63,9 @@ function appReducer(state = initialState, action) {
                 }, acc);
             }, models);
         });
+    case ON_CHANGE_SETTINGS:
+      return state
+        .updateIn(['modifiedSchema', 'models'].concat(action.keys), () => action.value);
     case ON_RESET:
       return state
         .update('modifiedSchema', () => state.get('schema'));
diff --git a/packages/strapi-plugin-content-manager/admin/src/containers/SettingPage/actions.js b/packages/strapi-plugin-content-manager/admin/src/containers/SettingPage/actions.js
new file mode 100644
index 0000000000..e69de29bb2
diff --git a/packages/strapi-plugin-content-manager/admin/src/containers/SettingPage/constants.js b/packages/strapi-plugin-content-manager/admin/src/containers/SettingPage/constants.js
new file mode 100644
index 0000000000..e69de29bb2
diff --git a/packages/strapi-plugin-content-manager/admin/src/containers/SettingPage/forms.json b/packages/strapi-plugin-content-manager/admin/src/containers/SettingPage/forms.json
new file mode 100644
index 0000000000..6e436cf55a
--- /dev/null
+++ b/packages/strapi-plugin-content-manager/admin/src/containers/SettingPage/forms.json
@@ -0,0 +1,63 @@
+{
+  "inputs": [
+    {
+      "label": { "id": "content-manager.form.Input.search" },
+      "customBootstrapClass": "col-md-5",
+      "didCheckErrors": false,
+      "errors": [],
+      "name": "search",
+      "type": "toggle",
+      "validations": {}
+    },
+    {
+      "label": { "id": "content-manager.form.Input.filters" },
+      "customBootstrapClass": "col-md-5",
+      "didCheckErrors": false,
+      "errors": [],
+      "name": "filters",
+      "type": "toggle",
+      "validations": {}
+    },
+    {
+      "label": { "id": "content-manager.form.Input.bulkActions" },
+      "customBootstrapClass": "col-md-2",
+      "didCheckErrors": false,
+      "errors": [],
+      "name": "bulkActions",
+      "type": "toggle",
+      "validations": {}
+    },
+    {
+      "label": { "id": "content-manager.form.Input.pageEntries" },
+      "customBootstrapClass": "col-md-4",
+      "didCheckErrors": false,
+      "errors": [],
+      "inputDescription": { "id": "content-manager.form.Input.pageEntries.inputDescription" },
+      "name": "pageEntries",
+      "selectOptions": ["10", "20", "50", "100"],
+      "type": "select",
+      "validations": {}
+    },
+    {
+      "label": { "id": "content-manager.form.Input.defaultSort" },
+      "customBootstrapClass": "col-md-4 ml-md-auto",
+      "didCheckErrors": false,
+      "errors": [],
+      "name": "defaultSort",
+      "selectOptions": ["_id"],
+      "type": "select",
+      "validations": {}
+    },
+    {
+      "label": "",
+      "customBootstrapClass": "col-md-2",
+      "didCheckErrors": false,
+      "errors": [],
+      "name": "sort",
+      "selectOptions": ["ASC", "DESC"],
+      "type": "select",
+      "validations": {}
+    }
+    
+  ]
+}
\ No newline at end of file
diff --git a/packages/strapi-plugin-content-manager/admin/src/containers/SettingPage/index.js b/packages/strapi-plugin-content-manager/admin/src/containers/SettingPage/index.js
new file mode 100644
index 0000000000..4513f93636
--- /dev/null
+++ b/packages/strapi-plugin-content-manager/admin/src/containers/SettingPage/index.js
@@ -0,0 +1,190 @@
+/**
+ * 
+ * SettingPage
+ */
+
+import React from 'react';
+import { connect } from 'react-redux';
+import { bindActionCreators, compose } from 'redux';
+import { createStructuredSelector } from 'reselect';
+import { get, last, upperFirst } from 'lodash';
+import cn from 'classnames';
+
+import PropTypes from 'prop-types';
+
+import { onChangeSettings, onSubmit, onReset } from 'containers/App/actions';
+import { makeSelectModifiedSchema } from 'containers/App/selectors';
+
+import BackHeader from 'components/BackHeader';
+import Input from 'components/InputsIndex';
+import PluginHeader from 'components/PluginHeader';
+import PopUpWarning from 'components/PopUpWarning';
+
+import Block from 'components/Block';
+
+import injectReducer from 'utils/injectReducer';
+import injectSaga from 'utils/injectSaga';
+
+import forms from './forms.json';
+import reducer from './reducer';
+import saga from './saga';
+import makeSelectSettingPage from './selectors';
+import styles from './styles.scss';
+
+
+class SettingPage extends React.PureComponent {
+  state = { showWarning: false };
+
+  getModelName = () => {
+    const { match: { params: { slug } } } = this.props;
+
+    return last(slug.split('::'));
+  }
+
+  getPath = () => {
+    const { match: { params: { slug } } } = this.props;
+
+    return slug.split('::').join('.');
+  }
+
+  getSelectOptions = (input) => {
+    const { schema: { models } } = this.props;
+    const currentAttributes = models[this.getModelName()].attributes;
+    const selectOptions = [models[this.getModelName()].primaryKey]
+      .concat(Object.keys(currentAttributes)
+        .filter(attr => currentAttributes[attr].type !== 'json' && currentAttributes[attr].type !== 'array'));
+    
+    return input.name === 'defaultSort' ? selectOptions : input.selectOptions;
+  }
+
+  getPluginHeaderActions = () => (
+    [
+      {
+        label: 'content-manager.popUpWarning.button.cancel',
+        kind: 'secondary',
+        onClick: this.props.onReset,
+        type: 'button',
+      },
+      {
+        kind: 'primary',
+        label: 'content-manager.containers.Edit.submit',
+        onClick: this.handleSubmit,
+        type: 'submit',
+      },
+    ]
+  );
+
+  getValue = (keys, type) => {
+    const value =  get(this.props.schema, ['models'].concat(keys.split('.')));
+
+    return type === 'toggle' ? value : value.toString();
+
+  }
+
+  handleSubmit = (e) => {
+    e.preventDefault();
+    this.setState({ showWarning: true });
+  }
+
+  toggle = () => this.setState(prevState => ({ showWarning: !prevState.showWarning }));
+
+  render() {
+    const { showWarning } = this.state;
+    const { onChangeSettings, onSubmit } = this.props;
+    const namePath = this.getPath();
+
+    return (
+      <React.Fragment>
+        <BackHeader onClick={() => this.props.history.goBack()} />
+        <div className={cn('container-fluid', styles.containerFluid)}>
+          <PluginHeader
+            actions={this.getPluginHeaderActions()}
+            title={`Content Manager - ${upperFirst(this.getModelName())}`}
+            description={{ id: 'content-manager.containers.SettingPage.pluginHeaderDescription' }}
+          />
+          <PopUpWarning
+            isOpen={showWarning}
+            toggleModal={this.toggle}
+            content={{
+              title: 'content-manager.popUpWarning.title',
+              message: 'content-manager.popUpWarning.warning.updateAllSettings',
+              cancel: 'content-manager.popUpWarning.button.cancel',
+              confirm: 'content-manager.popUpWarning.button.confirm',
+            }}
+            popUpWarningType="danger"
+            onConfirm={() => {
+              onSubmit();
+              this.toggle();
+            }}
+          />
+          <div className={cn('row', styles.container)}>
+            <Block
+              description="content-manager.containers.SettingPage.listSettings.description"
+              title="content-manager.containers.SettingPage.listSettings.title"
+            >
+              <form onSubmit={this.handleSubmit} className={styles.ctmForm}>
+                <div className="row">
+                  <div className="col-md-10">
+                    <div className="row">
+                      {forms.inputs.map(input => {
+                        const inputName = `${namePath}.${input.name}`;
+
+                        return (
+                          <Input
+                            {...input}
+                            key={input.name}
+                            name={inputName}
+                            onChange={onChangeSettings}
+                            selectOptions={this.getSelectOptions(input)}
+                            value={this.getValue(inputName, input.type)}
+                          />
+                        );
+                      })}
+                    </div>
+                  </div>
+                </div>
+              </form>
+            </Block>
+          </div>
+        </div>
+      </React.Fragment>
+    );
+  }
+}
+
+SettingPage.defaultProps = {};
+
+SettingPage.propTypes = {
+  history: PropTypes.object.isRequired,
+  match: PropTypes.object.isRequired,
+  onChangeSettings: PropTypes.func.isRequired,
+  onReset: PropTypes.func.isRequired,
+  onSubmit: PropTypes.func.isRequired,
+  schema: PropTypes.object.isRequired,
+};
+
+const mapDispatchToProps = (dispatch) => (
+  bindActionCreators(
+    {
+      onChangeSettings,
+      onReset,
+      onSubmit,
+    },
+    dispatch,
+  )
+);
+
+const mapStateToProps = createStructuredSelector({
+  schema: makeSelectModifiedSchema(),
+  settingPage: makeSelectSettingPage(),
+});
+
+const withConnect = connect(mapStateToProps, mapDispatchToProps);
+const withReducer = injectReducer({ key: 'settingPage', reducer });
+const withSaga = injectSaga({ key: 'settingPage', saga });
+
+export default compose(
+  withReducer,
+  withSaga,
+  withConnect,
+)(SettingPage);
diff --git a/packages/strapi-plugin-content-manager/admin/src/containers/SettingPage/reducer.js b/packages/strapi-plugin-content-manager/admin/src/containers/SettingPage/reducer.js
new file mode 100644
index 0000000000..2a6c6ae480
--- /dev/null
+++ b/packages/strapi-plugin-content-manager/admin/src/containers/SettingPage/reducer.js
@@ -0,0 +1,17 @@
+/**
+ * 
+ * SettingPage reducer
+ */
+
+import { fromJS } from 'immutable';
+
+const initialState = fromJS({});
+
+function settingPageReducer(state = initialState, action) {
+  switch (action.type) {
+    default:
+      return state;
+  }
+}
+
+export default settingPageReducer;
\ No newline at end of file
diff --git a/packages/strapi-plugin-content-manager/admin/src/containers/SettingPage/saga.js b/packages/strapi-plugin-content-manager/admin/src/containers/SettingPage/saga.js
new file mode 100644
index 0000000000..64a1db2ad6
--- /dev/null
+++ b/packages/strapi-plugin-content-manager/admin/src/containers/SettingPage/saga.js
@@ -0,0 +1,3 @@
+function* defaultSaga() {}
+
+export default defaultSaga;
\ No newline at end of file
diff --git a/packages/strapi-plugin-content-manager/admin/src/containers/SettingPage/selectors.js b/packages/strapi-plugin-content-manager/admin/src/containers/SettingPage/selectors.js
new file mode 100644
index 0000000000..bb2fe4ec1d
--- /dev/null
+++ b/packages/strapi-plugin-content-manager/admin/src/containers/SettingPage/selectors.js
@@ -0,0 +1,24 @@
+/**
+ * 
+ * SettingPage selectors
+ */
+
+import { createSelector } from 'reselect';
+
+/**
+* Direct selector to the settingPage state domain
+*/
+const selectSettingPageDomain = () => state => state.get('settingPage');
+
+
+/**
+ * Default selector used by EditPage
+ */
+
+const makeSelectSettingPage = () => createSelector(
+  selectSettingPageDomain(),
+  (substate) => substate.toJS()
+);
+
+
+export default makeSelectSettingPage;
\ No newline at end of file
diff --git a/packages/strapi-plugin-content-manager/admin/src/containers/SettingPage/styles.scss b/packages/strapi-plugin-content-manager/admin/src/containers/SettingPage/styles.scss
new file mode 100644
index 0000000000..944eb6d40f
--- /dev/null
+++ b/packages/strapi-plugin-content-manager/admin/src/containers/SettingPage/styles.scss
@@ -0,0 +1,21 @@
+.containerFluid {
+  padding: 18px 30px;
+  > div:first-child {
+    max-height: 33px;
+  }
+}
+
+.container {
+  padding-top: 18px;
+}
+
+.main_wrapper{
+  background: #ffffff;
+  padding: 22px 28px 0px;
+  border-radius: 2px;
+  box-shadow: 0 2px 4px #E3E9F3;
+}
+
+.ctmForm {
+  padding-top: 2.6rem;
+}
\ No newline at end of file
diff --git a/packages/strapi-plugin-content-manager/admin/src/containers/SettingsPage/index.js b/packages/strapi-plugin-content-manager/admin/src/containers/SettingsPage/index.js
index c1f4f146c5..38f3b6526d 100644
--- a/packages/strapi-plugin-content-manager/admin/src/containers/SettingsPage/index.js
+++ b/packages/strapi-plugin-content-manager/admin/src/containers/SettingsPage/index.js
@@ -26,7 +26,6 @@ import injectSaga from 'utils/injectSaga';
 
 import reducer from './reducer';
 import saga from './saga';
-import makeSelectSettingsPage from './selectors';
 import styles from './styles.scss';
 
 import forms from './forms.json';
@@ -34,18 +33,18 @@ import forms from './forms.json';
 class SettingsPage extends React.PureComponent {
   state = { showWarning: false };
 
-  getModels = (data = this.props.schema.models, destination = '') => {
+  getModels = (data = this.props.schema.models, destination = '/') => {
     const models = Object.keys(data).reduce((acc, curr) => {
       if (curr !== 'plugins') {
   
         if (!data[curr].fields && _.isObject(data[curr])) {
-          return this.getModels(data[curr], `${destination}/${curr}`);
+          return this.getModels(data[curr], `${destination}${curr}::`);
         }
         
-        return acc.concat([{ name: curr, destination: `${destination}/${curr}` }]);
+        return acc.concat([{ name: curr, destination: `${destination}${curr}` }]);
       } 
     
-      return this.getModels(data[curr], `${destination}/${curr}`);
+      return this.getModels(data[curr], `${destination}${curr}::`);
     }, []);
 
     return sortBy(
@@ -78,6 +77,11 @@ class SettingsPage extends React.PureComponent {
     return input.type === 'toggle' ? value : value.toString();
   }
 
+  handleClick = (destination) => {
+    const { location: { pathname } } = this.props;
+    this.props.history.push(`${pathname}${destination}`);
+  }
+
   handleSubmit = (e) => {
     e.preventDefault();
     this.setState({ showWarning: true });
@@ -138,7 +142,7 @@ class SettingsPage extends React.PureComponent {
             description="content-manager.containers.SettingsPage.Block.contentType.description"
           >
             <div className={styles.contentTypesWrapper}>
-              {this.getModels().map(model => <SettingsRow key={model.name} {...model} />)}
+              {this.getModels().map(model => <SettingsRow key={model.name} {...model} onClick={this.handleClick} />)}
             </div>
           </Block>
         </div>
@@ -150,6 +154,8 @@ class SettingsPage extends React.PureComponent {
 SettingsPage.defaultProps = {};
 
 SettingsPage.propTypes = {
+  history: PropTypes.object.isRequired,
+  location: PropTypes.object.isRequired,
   onChange: PropTypes.func.isRequired,
   onReset: PropTypes.func.isRequired,
   onSubmit: PropTypes.func.isRequired,
@@ -169,7 +175,6 @@ const mapDispatchToProps = (dispatch) => (
 
 const mapStateToProps = createStructuredSelector({
   schema: makeSelectModifiedSchema(),
-  settingsPage: makeSelectSettingsPage(),
 });
 
 const withConnect = connect(mapStateToProps, mapDispatchToProps);
diff --git a/packages/strapi-plugin-content-manager/admin/src/containers/SettingsPage/reducer.js b/packages/strapi-plugin-content-manager/admin/src/containers/SettingsPage/reducer.js
index 0649137672..676dcdc740 100644
--- a/packages/strapi-plugin-content-manager/admin/src/containers/SettingsPage/reducer.js
+++ b/packages/strapi-plugin-content-manager/admin/src/containers/SettingsPage/reducer.js
@@ -5,9 +5,7 @@
 
 import { fromJS } from 'immutable';
 
-const initialState = fromJS({
-  foo: 'bar',
-});
+const initialState = fromJS({});
 
 function settingsPageReducer(state = initialState, action) {
   switch (action.type) {
diff --git a/packages/strapi-plugin-content-manager/admin/src/containers/SettingsPage/saga.js b/packages/strapi-plugin-content-manager/admin/src/containers/SettingsPage/saga.js
index 4c7caa7fa2..64a1db2ad6 100644
--- a/packages/strapi-plugin-content-manager/admin/src/containers/SettingsPage/saga.js
+++ b/packages/strapi-plugin-content-manager/admin/src/containers/SettingsPage/saga.js
@@ -1,14 +1,3 @@
-// import { LOCATION_CHANGE } from 'react-router-redux'
-// import {
-//   call,
-//   cancel,
-//   fork,
-//   put,
-//   select,
-//   take,
-//   takeLatest,
-// } from 'redux-saga/effects';
-
 function* defaultSaga() {}
 
 export default defaultSaga;
\ No newline at end of file
diff --git a/packages/strapi-plugin-content-manager/admin/src/translations/en.json b/packages/strapi-plugin-content-manager/admin/src/translations/en.json
index afabd61a03..e1a74a0400 100755
--- a/packages/strapi-plugin-content-manager/admin/src/translations/en.json
+++ b/packages/strapi-plugin-content-manager/admin/src/translations/en.json
@@ -14,8 +14,11 @@
   "containers.List.pluginHeaderDescription.singular": "{label} entry found",
   "components.LimitSelect.itemsPerPage": "Items per page",
   "containers.List.errorFetchRecords": "Error",
-  "containers.SettingsPage.pluginHeaderDescription": "Configure the default settings for all your content types",
-  "containers.SettingsPage.Block.generalSettings.description": "Configure the default options for your content types",
+  "containers.SettingPage.listSettings.title": "List — Settings",
+  "containers.SettingPage.listSettings.description": "Configure the options for this content type",
+  "containers.SettingPage.pluginHeaderDescription": "Configure the specific settings for this Content Type",
+  "containers.SettingsPage.pluginHeaderDescription": "Configure the default settings for all your Content types",
+  "containers.SettingsPage.Block.generalSettings.description": "Configure the default options for your Content Types",
   "containers.SettingsPage.Block.generalSettings.title": "General",
   "containers.SettingsPage.Block.contentType.title": "Content Types",
   "containers.SettingsPage.Block.contentType.description": "Configure the specific settings",
@@ -81,6 +84,7 @@
   "form.Input.bulkActions": "Enable bulk actions",
   "form.Input.pageEntries": "Entries per page",
   "form.Input.pageEntries.inputDescription": "Note: You can override this value in the Content Type settings page.",
+  "form.Input.defaultSort": "Default sort attribute",
 
   "notification.error.relationship.fetch": "An error occurred during relationship fetch.",
 
diff --git a/packages/strapi-plugin-content-manager/admin/src/translations/fr.json b/packages/strapi-plugin-content-manager/admin/src/translations/fr.json
index 6ce5d2e9e5..26d6cd851c 100755
--- a/packages/strapi-plugin-content-manager/admin/src/translations/fr.json
+++ b/packages/strapi-plugin-content-manager/admin/src/translations/fr.json
@@ -4,7 +4,6 @@
   "containers.Home.pluginHeaderTitle": "Type de contenu",
   "containers.Home.pluginHeaderDescription": "Créer et modifier votre type de contenu",
   "containers.Home.introduction": "Pour éditer du contenu, choisissez un type de données dans le menu de gauche.",
-  "containers.Home.pluginHeaderDescription": "Un outil complet pour gérer facilement vos données.",
   "containers.Edit.submit": "Valider",
   "containers.Edit.editing": "Édition en cours...",
   "containers.Edit.delete": "Supprimer",
@@ -15,6 +14,9 @@
   "containers.List.pluginHeaderDescription.singular": "{label} entrée trouvée",
   "components.LimitSelect.itemsPerPage": "Éléments par page",
   "containers.List.errorFetchRecords": "Erreur",
+  "containers.SettingPage.pluginHeaderDescription": "Configurez les paramètres de ce modèle",
+  "containers.SettingPage.listSettings.title": "Liste — Paramètres",
+  "containers.SettingPage.listSettings.description": "Configurez les options de ce modèle",
   "containers.SettingsPage.pluginHeaderDescription": "Configurez les paramètres par défaut de vos modèles",
   "containers.SettingsPage.Block.generalSettings.description": "Configurez  les options par défault de vos modèles",
   "containers.SettingsPage.Block.generalSettings.title": "Général",
@@ -79,6 +81,7 @@
   "form.Input.bulkActions": "Autoriser les bulk actions",
   "form.Input.pageEntries": "Nombre d'entrées par page",
   "form.Input.pageEntries.inputDescription": "Note: Vous pouvez les modifier ces valeurs par modèle",
+  "form.Input.defaultSort": "Attribut de trie par défault",
 
   "notification.error.relationship.fetch": "Une erreur est survenue en récupérant les relations.",
 
diff --git a/packages/strapi-plugin-content-manager/config/functions/bootstrap.js b/packages/strapi-plugin-content-manager/config/functions/bootstrap.js
index f740d37dc6..75ba6c032e 100644
--- a/packages/strapi-plugin-content-manager/config/functions/bootstrap.js
+++ b/packages/strapi-plugin-content-manager/config/functions/bootstrap.js
@@ -49,7 +49,8 @@ module.exports = async cb => {
       filters: true,
       bulkActions: true,
       pageEntries: 10,
-      defaultSort: 'id'
+      defaultSort: model.primaryKey,
+      sort: 'ASC',
     }, model);
   
     // Fields (non relation)

From 3adaf8cdccd7fde74847f9c51b7abf3d29cf4fec Mon Sep 17 00:00:00 2001
From: cyril lopez <cyril.lpz@gmail.com>
Date: Fri, 29 Jun 2018 15:33:58 +0200
Subject: [PATCH 15/65] Apply list settings in listView

---
 .../admin/src/components/TableHeader/index.js |  2 +-
 .../admin/src/components/TableRow/styles.scss |  3 --
 .../admin/src/containers/ListPage/index.js    | 31 ++++++++-----------
 .../admin/src/containers/SettingPage/index.js | 10 +++---
 4 files changed, 19 insertions(+), 27 deletions(-)

diff --git a/packages/strapi-plugin-content-manager/admin/src/components/TableHeader/index.js b/packages/strapi-plugin-content-manager/admin/src/components/TableHeader/index.js
index fdb2f8731b..5a0ce6016e 100755
--- a/packages/strapi-plugin-content-manager/admin/src/components/TableHeader/index.js
+++ b/packages/strapi-plugin-content-manager/admin/src/components/TableHeader/index.js
@@ -47,7 +47,7 @@ class TableHeader extends React.Component {
       // Define sort icon
       let icon;
 
-      if (this.props.sort === header.name) {
+      if (this.props.sort === header.name || this.props.sort === 'id' && header.name === '_id') {
         icon = <i className={`fa fa-sort-asc ${styles.iconAsc}`} />;
       } else if (this.props.sort === `-${header.name}`) {
         icon = <i className={`fa fa-sort-asc ${styles.iconDesc}`} />;
diff --git a/packages/strapi-plugin-content-manager/admin/src/components/TableRow/styles.scss b/packages/strapi-plugin-content-manager/admin/src/components/TableRow/styles.scss
index 70dfed74f2..f01f5dc497 100755
--- a/packages/strapi-plugin-content-manager/admin/src/components/TableRow/styles.scss
+++ b/packages/strapi-plugin-content-manager/admin/src/components/TableRow/styles.scss
@@ -16,9 +16,6 @@
     border-collapse: collapse;
     border-top: 1px solid #F1F1F2 !important;
   }
-  > td:first-child {
-    // width: 50px;    
-  }
 }
 
 .truncate {
diff --git a/packages/strapi-plugin-content-manager/admin/src/containers/ListPage/index.js b/packages/strapi-plugin-content-manager/admin/src/containers/ListPage/index.js
index 5c060fecbf..12cfe08b99 100644
--- a/packages/strapi-plugin-content-manager/admin/src/containers/ListPage/index.js
+++ b/packages/strapi-plugin-content-manager/admin/src/containers/ListPage/index.js
@@ -111,6 +111,17 @@ export class ListPage extends React.Component {
     get(this.props.schema, ['models', 'plugins', this.getSource(), this.getCurrentModelName()])
   );
 
+  getCurrentModelDefaultLimit = () => (
+    get(this.getCurrentModel(), 'pageEntries', 10)
+  );
+
+  getCurrentModelDefaultSort = () => {
+    const sortAttr = get(this.getCurrentModel(), 'defaultSort', 'id');
+    const order = get(this.getCurrentModel(), 'sort', 'ASC');
+
+    return order === 'ASC' ? sortAttr : `-${sortAttr}`;
+  };
+
   /**
    * Helper to retrieve the current model name
    * @return {String} the current model's name
@@ -123,7 +134,7 @@ export class ListPage extends React.Component {
    */
   getData = (props, setUpdatingParams = false) => {
     const source = getQueryParameters(props.location.search, 'source');
-    const _limit = toInteger(getQueryParameters(props.location.search, '_limit')) || 10;
+    const _limit = toInteger(getQueryParameters(props.location.search, '_limit')) || this.getCurrentModelDefaultLimit();
     const _page = toInteger(getQueryParameters(props.location.search, '_page')) || 1;
     const _sort = this.findPageSort(props);
     const _q = getQueryParameters(props.location.search, '_q') || '';
@@ -190,25 +201,9 @@ export class ListPage extends React.Component {
    * @return {String}      the model's primaryKey
    */
   findPageSort = props => {
-    const {
-      match: {
-        params: { slug },
-      },
-    } = props;
-    const source = this.getSource();
-    const modelPrimaryKey = get(props.schema, [slug.toLowerCase(), 'primaryKey']);  
-    // Check if the model is in a plugin
-    const pluginModelPrimaryKey = get(props.schema.plugins, [
-      source,
-      slug.toLowerCase(),
-      'primaryKey',
-    ]);
-  
     return (
       getQueryParameters(props.location.search, '_sort') ||
-      modelPrimaryKey ||
-      pluginModelPrimaryKey ||
-      'id'
+      this.getCurrentModelDefaultSort()
     );
   };
 
diff --git a/packages/strapi-plugin-content-manager/admin/src/containers/SettingPage/index.js b/packages/strapi-plugin-content-manager/admin/src/containers/SettingPage/index.js
index 4513f93636..8ecb264ff5 100644
--- a/packages/strapi-plugin-content-manager/admin/src/containers/SettingPage/index.js
+++ b/packages/strapi-plugin-content-manager/admin/src/containers/SettingPage/index.js
@@ -38,7 +38,7 @@ class SettingPage extends React.PureComponent {
   getModelName = () => {
     const { match: { params: { slug } } } = this.props;
 
-    return last(slug.split('::'));
+    return slug.split('::');
   }
 
   getPath = () => {
@@ -49,11 +49,11 @@ class SettingPage extends React.PureComponent {
 
   getSelectOptions = (input) => {
     const { schema: { models } } = this.props;
-    const currentAttributes = models[this.getModelName()].attributes;
-    const selectOptions = [models[this.getModelName()].primaryKey]
+    const currentAttributes = get(models, this.getModelName().concat(['attributes']), []);
+    const selectOptions = [get(models, this.getModelName().concat(['primaryKey']), 'id')]
       .concat(Object.keys(currentAttributes)
         .filter(attr => currentAttributes[attr].type !== 'json' && currentAttributes[attr].type !== 'array'));
-    
+
     return input.name === 'defaultSort' ? selectOptions : input.selectOptions;
   }
 
@@ -99,7 +99,7 @@ class SettingPage extends React.PureComponent {
         <div className={cn('container-fluid', styles.containerFluid)}>
           <PluginHeader
             actions={this.getPluginHeaderActions()}
-            title={`Content Manager - ${upperFirst(this.getModelName())}`}
+            title={`Content Manager - ${upperFirst(last(this.getModelName()))}`}
             description={{ id: 'content-manager.containers.SettingPage.pluginHeaderDescription' }}
           />
           <PopUpWarning

From cea3dee8517272df77a4520e9d91bd2092993d4c Mon Sep 17 00:00:00 2001
From: cyril lopez <cyril.lpz@gmail.com>
Date: Fri, 29 Jun 2018 17:20:36 +0200
Subject: [PATCH 16/65] Add drag and drop to sort list header. Needs design
 Need to be able to remove or add an attribute

---
 .../src/components/DraggableAttr/index.js     | 118 ++++++++++++++++++
 .../src/components/DraggableAttr/styles.scss  |  13 ++
 .../admin/src/containers/App/actions.js       |  10 ++
 .../admin/src/containers/App/constants.js     |   1 +
 .../admin/src/containers/App/reducer.js       |   8 ++
 .../admin/src/containers/SettingPage/index.js |  34 ++++-
 .../src/containers/SettingPage/styles.scss    |   5 +
 .../src/containers/SettingsPage/styles.scss   |   4 +-
 .../package.json                              |   5 +-
 9 files changed, 192 insertions(+), 6 deletions(-)
 create mode 100644 packages/strapi-plugin-content-manager/admin/src/components/DraggableAttr/index.js
 create mode 100644 packages/strapi-plugin-content-manager/admin/src/components/DraggableAttr/styles.scss

diff --git a/packages/strapi-plugin-content-manager/admin/src/components/DraggableAttr/index.js b/packages/strapi-plugin-content-manager/admin/src/components/DraggableAttr/index.js
new file mode 100644
index 0000000000..58c215081f
--- /dev/null
+++ b/packages/strapi-plugin-content-manager/admin/src/components/DraggableAttr/index.js
@@ -0,0 +1,118 @@
+/**
+ * 
+ * DraggableAttr
+ */
+
+/* eslint-disable react/no-find-dom-node */
+import React from 'react';
+import { findDOMNode } from 'react-dom';
+import {
+  DragSource,
+  DropTarget,
+} from 'react-dnd';
+import { flow } from 'lodash';
+
+import styles from './styles.scss';
+
+const draggableAttrSource = {
+  beginDrag: (props, monitor, component) => {
+    const el = findDOMNode(component);
+    el.className = styles.dragged;
+
+    return {
+      id: props.id,
+      index: props.index,
+    };
+  },
+  endDrag: (props, monitor, component) => {
+    const el = findDOMNode(component);
+    el.className = styles.draggableAttr;
+
+    return {};
+  },
+};
+
+const draggableAttrTarget = {
+  hover: (props, monitor, component) => {
+    const dragIndex = monitor.getItem().index;
+    const hoverIndex = props.index;
+
+    // Don't replace items with themselves
+    if (dragIndex === hoverIndex) {
+      return;
+    }
+
+    // Determine rectangle on screen
+    const hoverBoundingRect = findDOMNode(component).getBoundingClientRect();
+
+    // Get vertical middle
+    const hoverMiddleY = (hoverBoundingRect.bottom - hoverBoundingRect.top) / 2;
+
+    // Determine mouse position
+    const clientOffset = monitor.getClientOffset();
+
+    // Get pixels to the top
+    const hoverClientY = clientOffset.y - hoverBoundingRect.top;
+
+    // Only perform the move when the mouse has crossed half of the items height
+    // When dragging downwards, only move when the cursor is below 50%
+    // When dragging upwards, only move when the cursor is above 50%
+
+    // Dragging downwards
+    if (dragIndex < hoverIndex && hoverClientY < hoverMiddleY) {
+      return;
+    }
+
+    // Dragging upwards
+    if (dragIndex > hoverIndex && hoverClientY > hoverMiddleY) {
+      return;
+    }
+
+    // Time to actually perform the action
+    props.moveAttr(dragIndex, hoverIndex, props.keys);
+
+    // Note: we're mutating the monitor item here!
+    // Generally it's better to avoid mutations,
+    // but it's good here for the sake of performance
+    // to avoid expensive index searches.
+    monitor.getItem().index = hoverIndex;
+  },
+};
+
+class DraggableAttr extends React.Component {
+  render() {
+    const { name, isDragging, connectDragSource, connectDropTarget } = this.props;
+    const opacity = isDragging ? 0.4 : 1;
+
+    return (
+      connectDragSource(
+        connectDropTarget(
+          <div
+            className={styles.draggableAttr}
+            style={{ opacity }}
+          >
+            {name}
+          </div>
+        ),
+      )
+    );
+  }
+}
+
+DraggableAttr.propTypes = {
+  connectDragSource: PropTypes.func.isRequired,
+  connectDropTarget: PropTypes.func.isRequired,
+  isDragging: PropTypes.bool.isRequired,
+  name: PropTypes.string.isRequired,
+};
+
+const withDropTarget = DropTarget('draggableAttr', draggableAttrTarget, connect => ({
+  connectDropTarget: connect.dropTarget(),
+}));
+
+const withDragSource = DragSource('draggableAttr', draggableAttrSource, (connect, monitor) => ({
+  connectDragSource: connect.dragSource(),
+  isDragging: monitor.isDragging(),
+}));
+
+export default flow([withDropTarget, withDragSource])(DraggableAttr);
\ No newline at end of file
diff --git a/packages/strapi-plugin-content-manager/admin/src/components/DraggableAttr/styles.scss b/packages/strapi-plugin-content-manager/admin/src/components/DraggableAttr/styles.scss
new file mode 100644
index 0000000000..585f948051
--- /dev/null
+++ b/packages/strapi-plugin-content-manager/admin/src/components/DraggableAttr/styles.scss
@@ -0,0 +1,13 @@
+.draggableAttr {
+  height: 30px;
+  width: 100%;
+  background: #FAFAFB;
+  margin-bottom: .5rem;
+}
+
+.dragged {
+  height: 30px;
+  width: 100%;
+  background: #E6F0FB;
+  margin-bottom: .5rem;
+}
\ No newline at end of file
diff --git a/packages/strapi-plugin-content-manager/admin/src/containers/App/actions.js b/packages/strapi-plugin-content-manager/admin/src/containers/App/actions.js
index d645f2a089..cac3b2a83c 100755
--- a/packages/strapi-plugin-content-manager/admin/src/containers/App/actions.js
+++ b/packages/strapi-plugin-content-manager/admin/src/containers/App/actions.js
@@ -11,6 +11,7 @@ import {
   GET_MODEL_ENTRIES_SUCCEEDED,
   LOAD_MODELS,
   LOADED_MODELS,
+  MOVE_ATTR,
   ON_CHANGE,
   ON_CHANGE_SETTINGS,
   ON_RESET,
@@ -51,6 +52,15 @@ export function loadedModels(models) {
   };
 }
 
+export function moveAttr(dragIndex, hoverIndex, keys) {
+  return {
+    type: MOVE_ATTR,
+    dragIndex,
+    hoverIndex,
+    keys,
+  };
+}
+
 export function onChange({ target }) {
   const value = includes(target.name, 'pageEntries') ? parseInt(target.value, 10) : target.value;
 
diff --git a/packages/strapi-plugin-content-manager/admin/src/containers/App/constants.js b/packages/strapi-plugin-content-manager/admin/src/containers/App/constants.js
index 670095218e..21a3e78ab6 100755
--- a/packages/strapi-plugin-content-manager/admin/src/containers/App/constants.js
+++ b/packages/strapi-plugin-content-manager/admin/src/containers/App/constants.js
@@ -9,6 +9,7 @@ export const GET_MODEL_ENTRIES = 'contentManager/App/GET_MODEL_ENTRIES';
 export const GET_MODEL_ENTRIES_SUCCEEDED = 'contentManager/App/GET_MODEL_ENTRIES_SUCCEEDED';
 export const LOAD_MODELS = 'contentManager/App/LOAD_MODELS';
 export const LOADED_MODELS = 'contentManager/App/LOADED_MODELS';
+export const MOVE_ATTR = 'contentManager/App/MOVE_ATTR';
 export const ON_CHANGE = 'contentManager/App/ON_CHANGE';
 export const ON_CHANGE_SETTINGS = 'contentManager/App/ON_CHANGE_SETTINGS';
 export const ON_RESET = 'contentManager/App/ON_RESET';
diff --git a/packages/strapi-plugin-content-manager/admin/src/containers/App/reducer.js b/packages/strapi-plugin-content-manager/admin/src/containers/App/reducer.js
index 3e63af579d..da45d84c52 100755
--- a/packages/strapi-plugin-content-manager/admin/src/containers/App/reducer.js
+++ b/packages/strapi-plugin-content-manager/admin/src/containers/App/reducer.js
@@ -10,6 +10,7 @@ import {
   GET_MODEL_ENTRIES_SUCCEEDED,
   LOAD_MODELS,
   LOADED_MODELS,
+  MOVE_ATTR,
   ON_CHANGE,
   ON_CHANGE_SETTINGS,
   ON_RESET,
@@ -37,6 +38,13 @@ function appReducer(state = initialState, action) {
         .update('schema', () => fromJS(action.models.models))
         .update('modifiedSchema', () => fromJS(action.models.models))
         .set('loading', false);
+    case MOVE_ATTR:
+      return state
+        .updateIn(['modifiedSchema', 'models'].concat(action.keys).concat(['listDisplay']), list => (
+          list
+            .delete(action.dragIndex)
+            .insert(action.hoverIndex, list.get(action.dragIndex))
+        ));
     case ON_CHANGE:
       return state
         .updateIn(['modifiedSchema'].concat(action.keys), () => action.value)
diff --git a/packages/strapi-plugin-content-manager/admin/src/containers/SettingPage/index.js b/packages/strapi-plugin-content-manager/admin/src/containers/SettingPage/index.js
index 8ecb264ff5..a3d54fa8be 100644
--- a/packages/strapi-plugin-content-manager/admin/src/containers/SettingPage/index.js
+++ b/packages/strapi-plugin-content-manager/admin/src/containers/SettingPage/index.js
@@ -9,10 +9,12 @@ import { bindActionCreators, compose } from 'redux';
 import { createStructuredSelector } from 'reselect';
 import { get, last, upperFirst } from 'lodash';
 import cn from 'classnames';
+import HTML5Backend from 'react-dnd-html5-backend';
+import { DragDropContext } from 'react-dnd';
 
 import PropTypes from 'prop-types';
 
-import { onChangeSettings, onSubmit, onReset } from 'containers/App/actions';
+import { moveAttr, onChangeSettings, onSubmit, onReset } from 'containers/App/actions';
 import { makeSelectModifiedSchema } from 'containers/App/selectors';
 
 import BackHeader from 'components/BackHeader';
@@ -21,6 +23,7 @@ import PluginHeader from 'components/PluginHeader';
 import PopUpWarning from 'components/PopUpWarning';
 
 import Block from 'components/Block';
+import DraggableAttr from 'components/DraggableAttr';
 
 import injectReducer from 'utils/injectReducer';
 import injectSaga from 'utils/injectSaga';
@@ -35,6 +38,10 @@ import styles from './styles.scss';
 class SettingPage extends React.PureComponent {
   state = { showWarning: false };
 
+  getListDisplay = () => (
+    get(this.props.schema, ['models', this.getModelName()].concat(['listDisplay']), [])
+  );
+
   getModelName = () => {
     const { match: { params: { slug } } } = this.props;
 
@@ -90,7 +97,7 @@ class SettingPage extends React.PureComponent {
 
   render() {
     const { showWarning } = this.state;
-    const { onChangeSettings, onSubmit } = this.props;
+    const { moveAttr, onChangeSettings, onSubmit } = this.props;
     const namePath = this.getPath();
 
     return (
@@ -142,6 +149,25 @@ class SettingPage extends React.PureComponent {
                       })}
                     </div>
                   </div>
+                  <div className="col-md-12">
+                    <div className={styles.separator} />
+                  </div>
+                </div>
+                <div className="row">
+                  <div className="col-md-5">
+                    {this.getListDisplay().map((attr, index) => (
+                      <div key={attr.name} style={{ display: 'flex' }}>
+                        <div>{index}</div>
+                        <DraggableAttr
+                          key={attr.name}
+                          keys={this.getPath()}
+                          index={index}
+                          name={attr.name}
+                          moveAttr={moveAttr}
+                        />
+                      </div>
+                    ))}
+                  </div>
                 </div>
               </form>
             </Block>
@@ -157,6 +183,7 @@ SettingPage.defaultProps = {};
 SettingPage.propTypes = {
   history: PropTypes.object.isRequired,
   match: PropTypes.object.isRequired,
+  moveAttr: PropTypes.func.isRequired,
   onChangeSettings: PropTypes.func.isRequired,
   onReset: PropTypes.func.isRequired,
   onSubmit: PropTypes.func.isRequired,
@@ -166,6 +193,7 @@ SettingPage.propTypes = {
 const mapDispatchToProps = (dispatch) => (
   bindActionCreators(
     {
+      moveAttr,
       onChangeSettings,
       onReset,
       onSubmit,
@@ -187,4 +215,4 @@ export default compose(
   withReducer,
   withSaga,
   withConnect,
-)(SettingPage);
+)(DragDropContext(HTML5Backend)(SettingPage));
diff --git a/packages/strapi-plugin-content-manager/admin/src/containers/SettingPage/styles.scss b/packages/strapi-plugin-content-manager/admin/src/containers/SettingPage/styles.scss
index 944eb6d40f..13f791a2cd 100644
--- a/packages/strapi-plugin-content-manager/admin/src/containers/SettingPage/styles.scss
+++ b/packages/strapi-plugin-content-manager/admin/src/containers/SettingPage/styles.scss
@@ -18,4 +18,9 @@
 
 .ctmForm {
   padding-top: 2.6rem;
+}
+
+.separator {
+  margin-top: 15px;
+  border-top: 1px solid #F6F6F6;
 }
\ No newline at end of file
diff --git a/packages/strapi-plugin-content-manager/admin/src/containers/SettingsPage/styles.scss b/packages/strapi-plugin-content-manager/admin/src/containers/SettingsPage/styles.scss
index c132030d6f..896ce87589 100644
--- a/packages/strapi-plugin-content-manager/admin/src/containers/SettingsPage/styles.scss
+++ b/packages/strapi-plugin-content-manager/admin/src/containers/SettingsPage/styles.scss
@@ -24,10 +24,10 @@
   padding-top: 9px;
   margin-left: -28px;
   margin-right: -28px;
-  > div:first-child {
+  > div:last-child {
     > div {
 
-      border-top: none;
+      border-bottom: none;
     }
   }
 }
\ No newline at end of file
diff --git a/packages/strapi-plugin-content-manager/package.json b/packages/strapi-plugin-content-manager/package.json
index de86758336..a02fceda0a 100755
--- a/packages/strapi-plugin-content-manager/package.json
+++ b/packages/strapi-plugin-content-manager/package.json
@@ -24,6 +24,8 @@
   "devDependencies": {
     "codemirror": "^5.39.0",
     "draft-js": "^0.10.5",
+    "react-dnd": "^5.0.0",
+    "react-dnd-html5-backend": "^5.0.1",
     "react-select": "^1.0.0-rc.5",
     "showdown": "^1.8.6",
     "strapi-helper-plugin": "3.0.0-alpha.12.6"
@@ -48,5 +50,6 @@
     "node": ">= 9.0.0",
     "npm": ">= 5.0.0"
   },
-  "license": "MIT"
+  "license": "MIT",
+  "dependencies": {}
 }
\ No newline at end of file

From 889c771b5c3edbc8c40702c8523994d58b5cddbe Mon Sep 17 00:00:00 2001
From: cyril lopez <cyril.lpz@gmail.com>
Date: Mon, 2 Jul 2018 17:05:29 +0200
Subject: [PATCH 17/65] Change routing

---
 .../src/components/DraggableAttr/index.js      |  2 +-
 .../admin/src/containers/App/index.js          |  2 +-
 .../src/containers/SettingPage/forms.json      |  9 +++++----
 .../admin/src/containers/SettingPage/index.js  | 18 ++++++++++--------
 .../admin/src/containers/SettingsPage/index.js |  4 ++--
 .../config/layout.json                         | 15 ++++++++++++++-
 6 files changed, 33 insertions(+), 17 deletions(-)

diff --git a/packages/strapi-plugin-content-manager/admin/src/components/DraggableAttr/index.js b/packages/strapi-plugin-content-manager/admin/src/components/DraggableAttr/index.js
index 58c215081f..cc16d86217 100644
--- a/packages/strapi-plugin-content-manager/admin/src/components/DraggableAttr/index.js
+++ b/packages/strapi-plugin-content-manager/admin/src/components/DraggableAttr/index.js
@@ -11,7 +11,7 @@ import {
   DropTarget,
 } from 'react-dnd';
 import { flow } from 'lodash';
-
+import PropTypes from 'prop-types';
 import styles from './styles.scss';
 
 const draggableAttrSource = {
diff --git a/packages/strapi-plugin-content-manager/admin/src/containers/App/index.js b/packages/strapi-plugin-content-manager/admin/src/containers/App/index.js
index 77939cfb7f..c331419502 100755
--- a/packages/strapi-plugin-content-manager/admin/src/containers/App/index.js
+++ b/packages/strapi-plugin-content-manager/admin/src/containers/App/index.js
@@ -51,7 +51,7 @@ class App extends React.Component {
     return (
       <div className="content-manager">
         <Switch>
-          <Route path="/plugins/content-manager/ctm-configurations/:slug" component={SettingPage} />
+          <Route path="/plugins/content-manager/ctm-configurations/:slug/:source?/:endPoint?" component={SettingPage} />
           <Route path="/plugins/content-manager/ctm-configurations" component={SettingsPage} />
           <Route path="/plugins/content-manager/:slug/:id" component={EditPage} />
           <Route path="/plugins/content-manager/:slug" component={ListPage} />
diff --git a/packages/strapi-plugin-content-manager/admin/src/containers/SettingPage/forms.json b/packages/strapi-plugin-content-manager/admin/src/containers/SettingPage/forms.json
index 6e436cf55a..6c5e24ffeb 100644
--- a/packages/strapi-plugin-content-manager/admin/src/containers/SettingPage/forms.json
+++ b/packages/strapi-plugin-content-manager/admin/src/containers/SettingPage/forms.json
@@ -2,7 +2,7 @@
   "inputs": [
     {
       "label": { "id": "content-manager.form.Input.search" },
-      "customBootstrapClass": "col-md-5",
+      "customBootstrapClass": "col-md-4",
       "didCheckErrors": false,
       "errors": [],
       "name": "search",
@@ -11,7 +11,7 @@
     },
     {
       "label": { "id": "content-manager.form.Input.filters" },
-      "customBootstrapClass": "col-md-5",
+      "customBootstrapClass": "col-md-4",
       "didCheckErrors": false,
       "errors": [],
       "name": "filters",
@@ -20,7 +20,7 @@
     },
     {
       "label": { "id": "content-manager.form.Input.bulkActions" },
-      "customBootstrapClass": "col-md-2",
+      "customBootstrapClass": "col-md-4",
       "didCheckErrors": false,
       "errors": [],
       "name": "bulkActions",
@@ -50,9 +50,10 @@
     },
     {
       "label": "",
-      "customBootstrapClass": "col-md-2",
+      "customBootstrapClass": "col-md-1",
       "didCheckErrors": false,
       "errors": [],
+      "inputStyle": { "maxWidth": "130px" },
       "name": "sort",
       "selectOptions": ["ASC", "DESC"],
       "type": "select",
diff --git a/packages/strapi-plugin-content-manager/admin/src/containers/SettingPage/index.js b/packages/strapi-plugin-content-manager/admin/src/containers/SettingPage/index.js
index a3d54fa8be..0dceabc016 100644
--- a/packages/strapi-plugin-content-manager/admin/src/containers/SettingPage/index.js
+++ b/packages/strapi-plugin-content-manager/admin/src/containers/SettingPage/index.js
@@ -7,7 +7,7 @@ import React from 'react';
 import { connect } from 'react-redux';
 import { bindActionCreators, compose } from 'redux';
 import { createStructuredSelector } from 'reselect';
-import { get, last, upperFirst } from 'lodash';
+import { get, upperFirst } from 'lodash';
 import cn from 'classnames';
 import HTML5Backend from 'react-dnd-html5-backend';
 import { DragDropContext } from 'react-dnd';
@@ -43,15 +43,17 @@ class SettingPage extends React.PureComponent {
   );
 
   getModelName = () => {
-    const { match: { params: { slug } } } = this.props;
+    const { match: { params: { slug, endPoint } } } = this.props;
 
-    return slug.split('::');
+    return endPoint || slug;
   }
 
   getPath = () => {
-    const { match: { params: { slug } } } = this.props;
+    const { match: { params: { slug, source, endPoint } } } = this.props;
 
-    return slug.split('::').join('.');
+    return [slug, source, endPoint]
+      .filter(param => param !== undefined)
+      .join('.');
   }
 
   getSelectOptions = (input) => {
@@ -106,7 +108,7 @@ class SettingPage extends React.PureComponent {
         <div className={cn('container-fluid', styles.containerFluid)}>
           <PluginHeader
             actions={this.getPluginHeaderActions()}
-            title={`Content Manager - ${upperFirst(last(this.getModelName()))}`}
+            title={`Content Manager - ${upperFirst(this.getModelName())}`}
             description={{ id: 'content-manager.containers.SettingPage.pluginHeaderDescription' }}
           />
           <PopUpWarning
@@ -131,7 +133,7 @@ class SettingPage extends React.PureComponent {
             >
               <form onSubmit={this.handleSubmit} className={styles.ctmForm}>
                 <div className="row">
-                  <div className="col-md-10">
+                  <div className="col-md-12">
                     <div className="row">
                       {forms.inputs.map(input => {
                         const inputName = `${namePath}.${input.name}`;
@@ -157,7 +159,7 @@ class SettingPage extends React.PureComponent {
                   <div className="col-md-5">
                     {this.getListDisplay().map((attr, index) => (
                       <div key={attr.name} style={{ display: 'flex' }}>
-                        <div>{index}</div>
+                        <div>{index}.</div>
                         <DraggableAttr
                           key={attr.name}
                           keys={this.getPath()}
diff --git a/packages/strapi-plugin-content-manager/admin/src/containers/SettingsPage/index.js b/packages/strapi-plugin-content-manager/admin/src/containers/SettingsPage/index.js
index 38f3b6526d..584f679509 100644
--- a/packages/strapi-plugin-content-manager/admin/src/containers/SettingsPage/index.js
+++ b/packages/strapi-plugin-content-manager/admin/src/containers/SettingsPage/index.js
@@ -38,13 +38,13 @@ class SettingsPage extends React.PureComponent {
       if (curr !== 'plugins') {
   
         if (!data[curr].fields && _.isObject(data[curr])) {
-          return this.getModels(data[curr], `${destination}${curr}::`);
+          return this.getModels(data[curr], `${destination}${curr}/`);
         }
         
         return acc.concat([{ name: curr, destination: `${destination}${curr}` }]);
       } 
     
-      return this.getModels(data[curr], `${destination}${curr}::`);
+      return this.getModels(data[curr], `${destination}${curr}/`);
     }, []);
 
     return sortBy(
diff --git a/packages/strapi-plugin-content-manager/config/layout.json b/packages/strapi-plugin-content-manager/config/layout.json
index ab0414408e..d470b961ca 100644
--- a/packages/strapi-plugin-content-manager/config/layout.json
+++ b/packages/strapi-plugin-content-manager/config/layout.json
@@ -11,7 +11,20 @@
         "appearance": ""
       },
       "description": {
-        "appearance": "WYSIWYG"
+        "appearance": ""
+      },
+      "price": {
+        "appearance": ""
+      },
+      "sold": {
+        "appearance": ""
+      }
+    }
+  },
+  "tag": {
+    "attributes": {
+      "name": {
+        "appearance": ""
       }
     }
   }

From 8a5e4c48add3398b9651981fa694fe19690269e0 Mon Sep 17 00:00:00 2001
From: Johann Pinson <johannpinson@users.noreply.github.com>
Date: Tue, 3 Jul 2018 12:09:49 +0200
Subject: [PATCH 18/65] fix(upload): improve query find for bookshelf

---
 .../strapi-plugin-upload/config/queries/bookshelf.js | 12 ++++++++++--
 1 file changed, 10 insertions(+), 2 deletions(-)

diff --git a/packages/strapi-plugin-upload/config/queries/bookshelf.js b/packages/strapi-plugin-upload/config/queries/bookshelf.js
index a216816473..f5efcaabd4 100644
--- a/packages/strapi-plugin-upload/config/queries/bookshelf.js
+++ b/packages/strapi-plugin-upload/config/queries/bookshelf.js
@@ -3,8 +3,16 @@ const _ = require('lodash');
 module.exports = {
   find: async function (params = {}, populate) {
     const records = await this.query(function(qb) {
-      _.forEach(params.where, (where, key) => {
-        qb.where(key, where[0].symbol, where[0].value);
+      Object.keys(params.where).forEach((key) => {
+        const where = params.where[key];
+
+        if (Array.isArray(where.value)) {
+          for (const value in where.value) {
+            qb[value ? 'where' : 'orWhere'](key, where.symbol, where.value[value]);
+          }
+        } else {
+          qb.where(key, where.symbol, where.value);
+        }
       });
 
       if (params.sort) {

From ffaa3fb92aa4eaea2132b0ca2f0cda766c8e961e Mon Sep 17 00:00:00 2001
From: Johann Pinson <johann.pinson@gmail.com>
Date: Tue, 3 Jul 2018 16:31:23 +0200
Subject: [PATCH 19/65] fix(graphql): add `time` attribute type to DateTime
 scalar

---
 packages/strapi-plugin-graphql/services/GraphQL.js | 1 +
 1 file changed, 1 insertion(+)

diff --git a/packages/strapi-plugin-graphql/services/GraphQL.js b/packages/strapi-plugin-graphql/services/GraphQL.js
index e240236ec9..2ad4ba572c 100644
--- a/packages/strapi-plugin-graphql/services/GraphQL.js
+++ b/packages/strapi-plugin-graphql/services/GraphQL.js
@@ -171,6 +171,7 @@ module.exports = {
         case 'float':
           type = 'Float';
           break;
+        case 'time':
         case 'date':
         case 'datetime':
         case 'timestamp':

From c80acd859e799d15d7624643e4f0a5163da0d2d7 Mon Sep 17 00:00:00 2001
From: cyril lopez <cyril.lpz@gmail.com>
Date: Tue, 3 Jul 2018 17:48:51 +0200
Subject: [PATCH 20/65] Handle remove attr from list

---
 .../src/components/DraggableAttr/index.js     | 42 ++++++++++-
 .../src/components/DraggableAttr/styles.scss  | 70 +++++++++++++++++--
 .../admin/src/components/Table/index.js       |  2 +-
 .../admin/src/containers/App/actions.js       |  9 +++
 .../admin/src/containers/App/constants.js     |  1 +
 .../admin/src/containers/App/reducer.js       |  7 +-
 .../admin/src/containers/SettingPage/index.js | 62 +++++++++++-----
 .../src/containers/SettingPage/styles.scss    | 26 ++++++-
 .../admin/src/translations/en.json            |  4 ++
 .../admin/src/translations/fr.json            |  4 ++
 .../config/layout.json                        | 12 ++++
 11 files changed, 209 insertions(+), 30 deletions(-)

diff --git a/packages/strapi-plugin-content-manager/admin/src/components/DraggableAttr/index.js b/packages/strapi-plugin-content-manager/admin/src/components/DraggableAttr/index.js
index cc16d86217..aa68b31994 100644
--- a/packages/strapi-plugin-content-manager/admin/src/components/DraggableAttr/index.js
+++ b/packages/strapi-plugin-content-manager/admin/src/components/DraggableAttr/index.js
@@ -18,6 +18,7 @@ const draggableAttrSource = {
   beginDrag: (props, monitor, component) => {
     const el = findDOMNode(component);
     el.className = styles.dragged;
+    props.updateSiblingHoverState();
 
     return {
       id: props.id,
@@ -27,6 +28,7 @@ const draggableAttrSource = {
   endDrag: (props, monitor, component) => {
     const el = findDOMNode(component);
     el.className = styles.draggableAttr;
+    props.updateSiblingHoverState();
 
     return {};
   },
@@ -80,18 +82,46 @@ const draggableAttrTarget = {
 };
 
 class DraggableAttr extends React.Component {
+  state = { isHover: false };
+
+  componentDidUpdate(prevProps) {
+    const { isDraggingSibling } = this.props;
+
+    if (isDraggingSibling !== prevProps.isDraggingSibling && isDraggingSibling) {
+      this.handleMouseLeave();
+    }
+  }
+
+  handleMouseEnter = () => {
+    if (!this.props.isDraggingSibling) {
+      this.setState({ isHover: true });
+    }
+  };
+
+  handleMouseLeave = () => this.setState({ isHover: false });
+
+  handleRemove = () => this.props.onRemove(this.props.index, this.props.keys);
+
   render() {
     const { name, isDragging, connectDragSource, connectDropTarget } = this.props;
-    const opacity = isDragging ? 0.4 : 1;
+    const { isHover } = this.state;
+    const opacity = isDragging ? 0.2 : 1;
 
     return (
       connectDragSource(
         connectDropTarget(
           <div
             className={styles.draggableAttr}
+            onMouseEnter={this.handleMouseEnter}
+            onMouseLeave={this.handleMouseLeave}
             style={{ opacity }}
           >
-            {name}
+            <i className="fa fa-th" aria-hidden="true"></i>
+            <span>{name}</span>
+            { isHover && !isDragging && (
+              <div className={styles.info}>Click to edit</div>
+            )}
+            <span className={styles.removeIcon} onClick={this.handleRemove} />            
           </div>
         ),
       )
@@ -99,11 +129,19 @@ class DraggableAttr extends React.Component {
   }
 }
 
+DraggableAttr.defaultProps = {
+  onRemove: () => {},
+};
+
 DraggableAttr.propTypes = {
   connectDragSource: PropTypes.func.isRequired,
   connectDropTarget: PropTypes.func.isRequired,
+  index: PropTypes.number.isRequired,
   isDragging: PropTypes.bool.isRequired,
+  isDraggingSibling: PropTypes.bool.isRequired,
+  keys: PropTypes.string.isRequired,
   name: PropTypes.string.isRequired,
+  onRemove: PropTypes.func,
 };
 
 const withDropTarget = DropTarget('draggableAttr', draggableAttrTarget, connect => ({
diff --git a/packages/strapi-plugin-content-manager/admin/src/components/DraggableAttr/styles.scss b/packages/strapi-plugin-content-manager/admin/src/components/DraggableAttr/styles.scss
index 585f948051..5f9d1ad651 100644
--- a/packages/strapi-plugin-content-manager/admin/src/components/DraggableAttr/styles.scss
+++ b/packages/strapi-plugin-content-manager/admin/src/components/DraggableAttr/styles.scss
@@ -1,13 +1,71 @@
 .draggableAttr {
-  height: 30px;
+  position: relative;
+  height: 28px;
   width: 100%;
+  margin-bottom: 8px;
+  padding-left: 10px;
+  justify-content: space-between;
   background: #FAFAFB;
-  margin-bottom: .5rem;
+  line-height: 28px;
+  color: #333740;
+  border: 1px solid #E3E9F3;
+  border-radius: 2px;
+  > i {
+    margin-right: 10px;
+    font-size: 10px;
+    color: #B3B5B9;
+  }
+  &:hover {
+    border: 1px solid #AED4FB!important;
+  }
+}
+
+.info {
+  position: absolute;
+  top: 0;
+  right: 40px;
+  color: #B4B6BA;
+  font-style: italic;
+}
+
+.removeIcon {
+  width: 30px;
+  background: #F3F4F4;
+  height: 26px;
+  cursor: pointer;
+  text-align: center;
+  float: right;
+
+  &:after {
+    display: inline-block;
+    content: '';
+    width: 8px;
+    height: 8px;
+    margin: auto;
+    margin-top: -3px;
+    background-image: url('../../assets/images/icon-cross-blue.svg');
+  }
 }
 
 .dragged {
-  height: 30px;
+  position: relative;
+  height: 28px;
   width: 100%;
-  background: #E6F0FB;
-  margin-bottom: .5rem;
-}
\ No newline at end of file
+  margin-bottom: 8px;
+  padding-left: 10px;
+  justify-content: space-between;
+  background: #FAFAFB;
+  line-height: 28px;
+  color: #333740;
+  border: 1px solid #AED4FB;
+  border-radius: 2px;
+  > i {
+    margin-right: 10px;
+    font-size: 10px;
+    color: #B3B5B9;
+  }
+
+  > span:last-child {
+    background:#AED4FB;
+  }
+}
diff --git a/packages/strapi-plugin-content-manager/admin/src/components/Table/index.js b/packages/strapi-plugin-content-manager/admin/src/components/Table/index.js
index d8f3b7d678..c596fc0580 100755
--- a/packages/strapi-plugin-content-manager/admin/src/components/Table/index.js
+++ b/packages/strapi-plugin-content-manager/admin/src/components/Table/index.js
@@ -22,7 +22,7 @@ class Table extends React.Component {
       (
         <TableEmpty
           filters={this.props.filters}
-          colspan={this.props.headers.length + 1}
+          colspan={this.props.enableBulkActions ? this.props.headers.length + 1 : this.props.headers.length}
           contentType={this.props.routeParams.slug}
           search={this.props.search}
         />
diff --git a/packages/strapi-plugin-content-manager/admin/src/containers/App/actions.js b/packages/strapi-plugin-content-manager/admin/src/containers/App/actions.js
index cac3b2a83c..8c46e7db6b 100755
--- a/packages/strapi-plugin-content-manager/admin/src/containers/App/actions.js
+++ b/packages/strapi-plugin-content-manager/admin/src/containers/App/actions.js
@@ -14,6 +14,7 @@ import {
   MOVE_ATTR,
   ON_CHANGE,
   ON_CHANGE_SETTINGS,
+  ON_REMOVE,
   ON_RESET,
   ON_SUBMIT,
 } from './constants';
@@ -81,6 +82,14 @@ export function onChangeSettings({ target }) {
   };
 }
 
+export function onRemove(index, keys) {
+  return {
+    type: ON_REMOVE,
+    index,
+    keys,
+  };
+}
+
 export function onReset() {
   return {
     type: ON_RESET,
diff --git a/packages/strapi-plugin-content-manager/admin/src/containers/App/constants.js b/packages/strapi-plugin-content-manager/admin/src/containers/App/constants.js
index 21a3e78ab6..567cf4a63b 100755
--- a/packages/strapi-plugin-content-manager/admin/src/containers/App/constants.js
+++ b/packages/strapi-plugin-content-manager/admin/src/containers/App/constants.js
@@ -12,5 +12,6 @@ export const LOADED_MODELS = 'contentManager/App/LOADED_MODELS';
 export const MOVE_ATTR = 'contentManager/App/MOVE_ATTR';
 export const ON_CHANGE = 'contentManager/App/ON_CHANGE';
 export const ON_CHANGE_SETTINGS = 'contentManager/App/ON_CHANGE_SETTINGS';
+export const ON_REMOVE = 'contentManager/App/ON_REMOVE';
 export const ON_RESET = 'contentManager/App/ON_RESET';
 export const ON_SUBMIT = 'contentManager/App/ON_SUBMIT';
diff --git a/packages/strapi-plugin-content-manager/admin/src/containers/App/reducer.js b/packages/strapi-plugin-content-manager/admin/src/containers/App/reducer.js
index da45d84c52..cc6a56251c 100755
--- a/packages/strapi-plugin-content-manager/admin/src/containers/App/reducer.js
+++ b/packages/strapi-plugin-content-manager/admin/src/containers/App/reducer.js
@@ -13,6 +13,7 @@ import {
   MOVE_ATTR,
   ON_CHANGE,
   ON_CHANGE_SETTINGS,
+  ON_REMOVE,
   ON_RESET,
   ON_SUBMIT,
 } from './constants';
@@ -40,7 +41,7 @@ function appReducer(state = initialState, action) {
         .set('loading', false);
     case MOVE_ATTR:
       return state
-        .updateIn(['modifiedSchema', 'models'].concat(action.keys).concat(['listDisplay']), list => (
+        .updateIn(['modifiedSchema', 'models'].concat(action.keys.split('.')).concat(['listDisplay']), list => (
           list
             .delete(action.dragIndex)
             .insert(action.hoverIndex, list.get(action.dragIndex))
@@ -74,6 +75,10 @@ function appReducer(state = initialState, action) {
     case ON_CHANGE_SETTINGS:
       return state
         .updateIn(['modifiedSchema', 'models'].concat(action.keys), () => action.value);
+    case ON_REMOVE:
+      return state.updateIn(['modifiedSchema', 'models'].concat(action.keys.split('.')).concat(['listDisplay']), list => (
+        list.delete(action.index)
+      ));
     case ON_RESET:
       return state
         .update('modifiedSchema', () => state.get('schema'));
diff --git a/packages/strapi-plugin-content-manager/admin/src/containers/SettingPage/index.js b/packages/strapi-plugin-content-manager/admin/src/containers/SettingPage/index.js
index 0dceabc016..2d28a95e00 100644
--- a/packages/strapi-plugin-content-manager/admin/src/containers/SettingPage/index.js
+++ b/packages/strapi-plugin-content-manager/admin/src/containers/SettingPage/index.js
@@ -11,10 +11,17 @@ import { get, upperFirst } from 'lodash';
 import cn from 'classnames';
 import HTML5Backend from 'react-dnd-html5-backend';
 import { DragDropContext } from 'react-dnd';
+import { FormattedMessage } from 'react-intl';
 
 import PropTypes from 'prop-types';
 
-import { moveAttr, onChangeSettings, onSubmit, onReset } from 'containers/App/actions';
+import {
+  moveAttr,
+  onChangeSettings,
+  onRemove,
+  onReset,
+  onSubmit,
+} from 'containers/App/actions';
 import { makeSelectModifiedSchema } from 'containers/App/selectors';
 
 import BackHeader from 'components/BackHeader';
@@ -36,10 +43,10 @@ import styles from './styles.scss';
 
 
 class SettingPage extends React.PureComponent {
-  state = { showWarning: false };
+  state = { showWarning: false, isDraggingSibling: false };
 
   getListDisplay = () => (
-    get(this.props.schema, ['models', this.getModelName()].concat(['listDisplay']), [])
+    get(this.props.schema, `models.${this.getPath()}.listDisplay`, [])
   );
 
   getModelName = () => {
@@ -95,11 +102,15 @@ class SettingPage extends React.PureComponent {
     this.setState({ showWarning: true });
   }
 
+  updateSiblingHoverState = () => {
+    this.setState(prevState => ({ isDraggingSibling: !prevState.isDraggingSibling }));
+  };
+
   toggle = () => this.setState(prevState => ({ showWarning: !prevState.showWarning }));
 
   render() {
-    const { showWarning } = this.state;
-    const { moveAttr, onChangeSettings, onSubmit } = this.props;
+    const { isDraggingSibling, showWarning } = this.state;
+    const { moveAttr, onChangeSettings, onRemove, onSubmit } = this.props;
     const namePath = this.getPath();
 
     return (
@@ -155,20 +166,31 @@ class SettingPage extends React.PureComponent {
                     <div className={styles.separator} />
                   </div>
                 </div>
-                <div className="row">
-                  <div className="col-md-5">
-                    {this.getListDisplay().map((attr, index) => (
-                      <div key={attr.name} style={{ display: 'flex' }}>
-                        <div>{index}.</div>
-                        <DraggableAttr
-                          key={attr.name}
-                          keys={this.getPath()}
-                          index={index}
-                          name={attr.name}
-                          moveAttr={moveAttr}
-                        />
-                      </div>
-                    ))}
+                <div className={styles.listDisplayWrapper}>
+                  <div className="row">
+                    <div className={cn('col-md-12', styles.draggedDescription)}>
+                      <FormattedMessage id="content-manager.containers.SettingPage.attributes" />
+                      <p>
+                        <FormattedMessage id="content-manager.containers.SettingPage.attributes.description" />
+                      </p>
+                    </div>
+                    <div className="col-md-5">
+                      {this.getListDisplay().map((attr, index) => (
+                        <div key={attr.name} className={styles.draggedWrapper}>
+                          <div>{index}.</div>
+                          <DraggableAttr
+                            key={attr.name}
+                            keys={this.getPath()}
+                            index={index}
+                            name={attr.name}
+                            moveAttr={moveAttr}
+                            onRemove={onRemove}
+                            updateSiblingHoverState={this.updateSiblingHoverState}
+                            isDraggingSibling={isDraggingSibling}
+                          />
+                        </div>
+                      ))}
+                    </div>
                   </div>
                 </div>
               </form>
@@ -187,6 +209,7 @@ SettingPage.propTypes = {
   match: PropTypes.object.isRequired,
   moveAttr: PropTypes.func.isRequired,
   onChangeSettings: PropTypes.func.isRequired,
+  onRemove: PropTypes.func.isRequired,
   onReset: PropTypes.func.isRequired,
   onSubmit: PropTypes.func.isRequired,
   schema: PropTypes.object.isRequired,
@@ -197,6 +220,7 @@ const mapDispatchToProps = (dispatch) => (
     {
       moveAttr,
       onChangeSettings,
+      onRemove,
       onReset,
       onSubmit,
     },
diff --git a/packages/strapi-plugin-content-manager/admin/src/containers/SettingPage/styles.scss b/packages/strapi-plugin-content-manager/admin/src/containers/SettingPage/styles.scss
index 13f791a2cd..f564c1aa78 100644
--- a/packages/strapi-plugin-content-manager/admin/src/containers/SettingPage/styles.scss
+++ b/packages/strapi-plugin-content-manager/admin/src/containers/SettingPage/styles.scss
@@ -21,6 +21,30 @@
 }
 
 .separator {
-  margin-top: 15px;
+  margin-top: 19px;
   border-top: 1px solid #F6F6F6;
+}
+
+.draggedWrapper {
+  display: flex;
+  > div:first-child {
+    margin-right: 10px;
+    height: 30px;
+    line-height: 30px;
+  }
+}
+
+.listDisplayWrapper {
+  padding-top: 21px;
+}
+
+.draggedDescription {
+  color: #333740;
+  font-size: 13px;
+  font-weight: 500;
+
+  > p {
+    margin-bottom: 28px;
+    color: #787E8F;
+  }
 }
\ No newline at end of file
diff --git a/packages/strapi-plugin-content-manager/admin/src/translations/en.json b/packages/strapi-plugin-content-manager/admin/src/translations/en.json
index e1a74a0400..dbc0e855c5 100755
--- a/packages/strapi-plugin-content-manager/admin/src/translations/en.json
+++ b/packages/strapi-plugin-content-manager/admin/src/translations/en.json
@@ -14,6 +14,10 @@
   "containers.List.pluginHeaderDescription.singular": "{label} entry found",
   "components.LimitSelect.itemsPerPage": "Items per page",
   "containers.List.errorFetchRecords": "Error",
+  
+  "containers.SettingPage.attributes": "Attributes fields",
+  "containers.SettingPage.attributes.description": "Define the order of the attributes",
+
   "containers.SettingPage.listSettings.title": "List — Settings",
   "containers.SettingPage.listSettings.description": "Configure the options for this content type",
   "containers.SettingPage.pluginHeaderDescription": "Configure the specific settings for this Content Type",
diff --git a/packages/strapi-plugin-content-manager/admin/src/translations/fr.json b/packages/strapi-plugin-content-manager/admin/src/translations/fr.json
index 26d6cd851c..d990f424c1 100755
--- a/packages/strapi-plugin-content-manager/admin/src/translations/fr.json
+++ b/packages/strapi-plugin-content-manager/admin/src/translations/fr.json
@@ -14,9 +14,13 @@
   "containers.List.pluginHeaderDescription.singular": "{label} entrée trouvée",
   "components.LimitSelect.itemsPerPage": "Éléments par page",
   "containers.List.errorFetchRecords": "Erreur",
+
+  "containers.SettingPage.attributes": "Attributs",
+  "containers.SettingPage.attributes.description": "Organiser les attributs du modèle",
   "containers.SettingPage.pluginHeaderDescription": "Configurez les paramètres de ce modèle",
   "containers.SettingPage.listSettings.title": "Liste — Paramètres",
   "containers.SettingPage.listSettings.description": "Configurez les options de ce modèle",
+
   "containers.SettingsPage.pluginHeaderDescription": "Configurez les paramètres par défaut de vos modèles",
   "containers.SettingsPage.Block.generalSettings.description": "Configurez  les options par défault de vos modèles",
   "containers.SettingsPage.Block.generalSettings.title": "Général",
diff --git a/packages/strapi-plugin-content-manager/config/layout.json b/packages/strapi-plugin-content-manager/config/layout.json
index d470b961ca..73bd1a7dcc 100644
--- a/packages/strapi-plugin-content-manager/config/layout.json
+++ b/packages/strapi-plugin-content-manager/config/layout.json
@@ -18,6 +18,18 @@
       },
       "sold": {
         "appearance": ""
+      },
+      "date": {
+        "appearance": ""
+      },
+      "email": {
+        "appearance": ""
+      },
+      "password": {
+        "appearance": ""
+      },
+      "enum": {
+        "appearance": ""
       }
     }
   },

From 86824b536a5abb0e37f39cee29a9201ee7282e42 Mon Sep 17 00:00:00 2001
From: cyril lopez <cyril.lpz@gmail.com>
Date: Tue, 3 Jul 2018 18:30:34 +0200
Subject: [PATCH 21/65] Handle add attr

---
 .../src/components/DraggableAttr/index.js     |  6 +-
 .../admin/src/containers/App/actions.js       |  9 +++
 .../admin/src/containers/App/constants.js     |  1 +
 .../admin/src/containers/App/reducer.js       |  4 ++
 .../admin/src/containers/SettingPage/index.js | 60 +++++++++++++++++--
 .../admin/src/translations/en.json            |  7 ++-
 .../admin/src/translations/fr.json            | 13 ++--
 7 files changed, 88 insertions(+), 12 deletions(-)

diff --git a/packages/strapi-plugin-content-manager/admin/src/components/DraggableAttr/index.js b/packages/strapi-plugin-content-manager/admin/src/components/DraggableAttr/index.js
index aa68b31994..a9f9efc19e 100644
--- a/packages/strapi-plugin-content-manager/admin/src/components/DraggableAttr/index.js
+++ b/packages/strapi-plugin-content-manager/admin/src/components/DraggableAttr/index.js
@@ -12,6 +12,8 @@ import {
 } from 'react-dnd';
 import { flow } from 'lodash';
 import PropTypes from 'prop-types';
+import { FormattedMessage } from 'react-intl';
+
 import styles from './styles.scss';
 
 const draggableAttrSource = {
@@ -119,7 +121,9 @@ class DraggableAttr extends React.Component {
             <i className="fa fa-th" aria-hidden="true"></i>
             <span>{name}</span>
             { isHover && !isDragging && (
-              <div className={styles.info}>Click to edit</div>
+              <div className={styles.info}>
+                <FormattedMessage id="content-manager.components.DraggableAttr.edit" />
+              </div>
             )}
             <span className={styles.removeIcon} onClick={this.handleRemove} />            
           </div>
diff --git a/packages/strapi-plugin-content-manager/admin/src/containers/App/actions.js b/packages/strapi-plugin-content-manager/admin/src/containers/App/actions.js
index 8c46e7db6b..1062a56b6c 100755
--- a/packages/strapi-plugin-content-manager/admin/src/containers/App/actions.js
+++ b/packages/strapi-plugin-content-manager/admin/src/containers/App/actions.js
@@ -14,6 +14,7 @@ import {
   MOVE_ATTR,
   ON_CHANGE,
   ON_CHANGE_SETTINGS,
+  ON_CLICK_ADD_ATTR,
   ON_REMOVE,
   ON_RESET,
   ON_SUBMIT,
@@ -82,6 +83,14 @@ export function onChangeSettings({ target }) {
   };
 }
 
+export function onClickAddAttr(data, keys) {
+  return {
+    type: ON_CLICK_ADD_ATTR,
+    data,
+    keys,
+  };
+}
+
 export function onRemove(index, keys) {
   return {
     type: ON_REMOVE,
diff --git a/packages/strapi-plugin-content-manager/admin/src/containers/App/constants.js b/packages/strapi-plugin-content-manager/admin/src/containers/App/constants.js
index 567cf4a63b..135487995d 100755
--- a/packages/strapi-plugin-content-manager/admin/src/containers/App/constants.js
+++ b/packages/strapi-plugin-content-manager/admin/src/containers/App/constants.js
@@ -12,6 +12,7 @@ export const LOADED_MODELS = 'contentManager/App/LOADED_MODELS';
 export const MOVE_ATTR = 'contentManager/App/MOVE_ATTR';
 export const ON_CHANGE = 'contentManager/App/ON_CHANGE';
 export const ON_CHANGE_SETTINGS = 'contentManager/App/ON_CHANGE_SETTINGS';
+export const ON_CLICK_ADD_ATTR = 'contentManager/App/ON_CLICK_ADD_ATTR';
 export const ON_REMOVE = 'contentManager/App/ON_REMOVE';
 export const ON_RESET = 'contentManager/App/ON_RESET';
 export const ON_SUBMIT = 'contentManager/App/ON_SUBMIT';
diff --git a/packages/strapi-plugin-content-manager/admin/src/containers/App/reducer.js b/packages/strapi-plugin-content-manager/admin/src/containers/App/reducer.js
index cc6a56251c..e2bda2a94e 100755
--- a/packages/strapi-plugin-content-manager/admin/src/containers/App/reducer.js
+++ b/packages/strapi-plugin-content-manager/admin/src/containers/App/reducer.js
@@ -13,6 +13,7 @@ import {
   MOVE_ATTR,
   ON_CHANGE,
   ON_CHANGE_SETTINGS,
+  ON_CLICK_ADD_ATTR,
   ON_REMOVE,
   ON_RESET,
   ON_SUBMIT,
@@ -75,6 +76,9 @@ function appReducer(state = initialState, action) {
     case ON_CHANGE_SETTINGS:
       return state
         .updateIn(['modifiedSchema', 'models'].concat(action.keys), () => action.value);
+    case ON_CLICK_ADD_ATTR:
+      return state
+        .updateIn(['modifiedSchema', 'models'].concat(action.keys.split('.')).concat(['listDisplay']), list => list.push(fromJS(action.data)));
     case ON_REMOVE:
       return state.updateIn(['modifiedSchema', 'models'].concat(action.keys.split('.')).concat(['listDisplay']), list => (
         list.delete(action.index)
diff --git a/packages/strapi-plugin-content-manager/admin/src/containers/SettingPage/index.js b/packages/strapi-plugin-content-manager/admin/src/containers/SettingPage/index.js
index 2d28a95e00..b90d7c2b5d 100644
--- a/packages/strapi-plugin-content-manager/admin/src/containers/SettingPage/index.js
+++ b/packages/strapi-plugin-content-manager/admin/src/containers/SettingPage/index.js
@@ -7,17 +7,19 @@ import React from 'react';
 import { connect } from 'react-redux';
 import { bindActionCreators, compose } from 'redux';
 import { createStructuredSelector } from 'reselect';
-import { get, upperFirst } from 'lodash';
+import { findIndex, get, upperFirst } from 'lodash';
 import cn from 'classnames';
 import HTML5Backend from 'react-dnd-html5-backend';
 import { DragDropContext } from 'react-dnd';
 import { FormattedMessage } from 'react-intl';
+import { ButtonDropdown, DropdownToggle, DropdownMenu, DropdownItem } from 'reactstrap';
 
 import PropTypes from 'prop-types';
 
 import {
   moveAttr,
   onChangeSettings,
+  onClickAddAttr,
   onRemove,
   onReset,
   onSubmit,
@@ -43,7 +45,21 @@ import styles from './styles.scss';
 
 
 class SettingPage extends React.PureComponent {
-  state = { showWarning: false, isDraggingSibling: false };
+  state = { showWarning: false, isDraggingSibling: false, isOpen: false };
+
+  getDropDownItems = () => {
+    const attributes = get(this.props.schema, `models.${this.getPath()}.attributes`, []);
+    return Object.keys(attributes)
+      .filter(attr => {
+        return findIndex(this.getListDisplay(), ['name', attr]) === -1 && !attributes[attr].hasOwnProperty('collection') && !attributes[attr].hasOwnProperty('model');
+      })
+      .map(attr => {
+        const searchable = attributes[attr].type !== 'json' && attributes[attr].type !== 'array';
+        const obj = Object.assign(attributes[attr], { name: attr, label: upperFirst(attr), searchable, sortable: searchable });
+
+        return obj;
+      });
+  }
 
   getListDisplay = () => (
     get(this.props.schema, `models.${this.getPath()}.listDisplay`, [])
@@ -108,9 +124,15 @@ class SettingPage extends React.PureComponent {
 
   toggle = () => this.setState(prevState => ({ showWarning: !prevState.showWarning }));
 
+  toggleDropdown = () => {
+    if (this.getListDisplay().length > 0) {
+      this.setState(prevState => ({ isOpen: !prevState.isOpen }));
+    }
+  }
+
   render() {
-    const { isDraggingSibling, showWarning } = this.state;
-    const { moveAttr, onChangeSettings, onRemove, onSubmit } = this.props;
+    const { isDraggingSibling, isOpen, showWarning } = this.state;
+    const { moveAttr, onChangeSettings, onClickAddAttr, onRemove, onSubmit } = this.props;
     const namePath = this.getPath();
 
     return (
@@ -190,6 +212,34 @@ class SettingPage extends React.PureComponent {
                           />
                         </div>
                       ))}
+                      <ButtonDropdown isOpen={isOpen} toggle={this.toggleDropdown}>
+                        <DropdownToggle caret>
+                          Button Dropdown
+                        </DropdownToggle>
+                        <DropdownMenu>
+                          {this.getDropDownItems().map((item, i) => {
+                            if (i !== this.getDropDownItems().length - 1 && this.getDropDownItems().length > 0) {
+                              return (
+                                <React.Fragment key={item.name}>
+                                  <DropdownItem onClick={() => onClickAddAttr(item, this.getPath())}>
+                                    {item.label}
+                                  </DropdownItem>
+                                  <DropdownItem divider />
+                                </React.Fragment>
+                              );
+                            }
+
+                            return (
+                              <DropdownItem
+                                key={item.name}
+                                onClick={() => onClickAddAttr(item, this.getPath())}
+                              >
+                                {item.label}
+                              </DropdownItem>
+                            );                
+                          })}
+                        </DropdownMenu>
+                      </ButtonDropdown>
                     </div>
                   </div>
                 </div>
@@ -209,6 +259,7 @@ SettingPage.propTypes = {
   match: PropTypes.object.isRequired,
   moveAttr: PropTypes.func.isRequired,
   onChangeSettings: PropTypes.func.isRequired,
+  onClickAddAttr: PropTypes.func.isRequired,
   onRemove: PropTypes.func.isRequired,
   onReset: PropTypes.func.isRequired,
   onSubmit: PropTypes.func.isRequired,
@@ -220,6 +271,7 @@ const mapDispatchToProps = (dispatch) => (
     {
       moveAttr,
       onChangeSettings,
+      onClickAddAttr,
       onRemove,
       onReset,
       onSubmit,
diff --git a/packages/strapi-plugin-content-manager/admin/src/translations/en.json b/packages/strapi-plugin-content-manager/admin/src/translations/en.json
index dbc0e855c5..43651cd515 100755
--- a/packages/strapi-plugin-content-manager/admin/src/translations/en.json
+++ b/packages/strapi-plugin-content-manager/admin/src/translations/en.json
@@ -29,13 +29,16 @@
 
   "components.AddFilterCTA.add": "Filters",
   "components.AddFilterCTA.hide": "Filters",
-  "components.FilterOptions.button.apply": "Apply",
+
+  "components.DraggableAttr.edit": "Click to edit",
+
   "components.FiltersPickWrapper.PluginHeader.actions.apply": "Apply",
   "components.FiltersPickWrapper.PluginHeader.actions.clearAll": "Clear all",
   "components.FiltersPickWrapper.PluginHeader.description": "Set the conditions to apply to filter the entries",
   "components.FiltersPickWrapper.PluginHeader.title.filter": "Filters",
   "components.FiltersPickWrapper.hide": "Hide",
-
+  
+  "components.FilterOptions.button.apply": "Apply",
   "components.FilterOptions.FILTER_TYPES.=": "is",
   "components.FilterOptions.FILTER_TYPES._ne": "is not",
   "components.FilterOptions.FILTER_TYPES._lt": "is lower than",
diff --git a/packages/strapi-plugin-content-manager/admin/src/translations/fr.json b/packages/strapi-plugin-content-manager/admin/src/translations/fr.json
index d990f424c1..3743a615e0 100755
--- a/packages/strapi-plugin-content-manager/admin/src/translations/fr.json
+++ b/packages/strapi-plugin-content-manager/admin/src/translations/fr.json
@@ -27,23 +27,26 @@
 
   "components.AddFilterCTA.add": "Filtres",
   "components.AddFilterCTA.hide": "Filtres",
-  "components.FilterOptions.button.apply": "Appliquer",
+
+  "components.DraggableAttr.edit": "Clicquez pour modifier",
+
   "components.FiltersPickWrapper.PluginHeader.actions.apply": "Appliquer",
   "components.FiltersPickWrapper.PluginHeader.actions.clearAll": "Tout supprimer",
   "components.FiltersPickWrapper.PluginHeader.description": "Définissez les conditions des filtres à appliquer",
   "components.FiltersPickWrapper.PluginHeader.title.filter": "Filtres",
   "components.FiltersPickWrapper.hide": "Fermer",
-
+  
   "components.Search.placeholder": "Rechercher une entrée...",
-
+  
   "components.TableDelete.entries.plural": "{number} entrées sélectionnées",
   "components.TableDelete.entries.singular": "{number} entrée sélectionnée",
   "components.TableDelete.delete": "Tout supprimer",
-
+  
   "components.TableEmpty.withFilters": "Aucun {contentType} n'a été trouvé avec ces filtres...",
   "components.TableEmpty.withoutFilter": "Aucun {contentType} n'a été trouvé...",
   "components.TableEmpty.withSearch": "Aucun {contentType} n'a été trouvé avec cette recherche ({search})...",
-
+  
+  "components.FilterOptions.button.apply": "Appliquer",
   "components.FilterOptions.FILTER_TYPES.=": "est",
   "components.FilterOptions.FILTER_TYPES._ne": "n'est pas",
   "components.FilterOptions.FILTER_TYPES._lt": "inférieur à",

From 4966c78f562e52ed9cc51b748feb51b3bcd3e217 Mon Sep 17 00:00:00 2001
From: cyril lopez <cyril.lpz@gmail.com>
Date: Tue, 3 Jul 2018 19:36:01 +0200
Subject: [PATCH 22/65] Handle edit label sort and search per attr

---
 packages/strapi-generate-new/lib/after.js     |  2 +-
 .../src/components/DraggableAttr/index.js     | 24 +++++++++--
 .../src/components/DraggableAttr/styles.scss  |  2 +-
 .../admin/src/components/TableHeader/index.js |  6 ++-
 .../src/containers/SettingPage/actions.js     |  8 ++++
 .../src/containers/SettingPage/constants.js   |  1 +
 .../src/containers/SettingPage/forms.json     | 30 ++++++++++++++
 .../admin/src/containers/SettingPage/index.js | 41 +++++++++++++++++--
 .../src/containers/SettingPage/reducer.js     |  7 +++-
 .../src/containers/SettingPage/styles.scss    |  7 ++++
 .../admin/src/translations/en.json            |  4 ++
 .../admin/src/translations/fr.json            |  4 ++
 12 files changed, 126 insertions(+), 10 deletions(-)

diff --git a/packages/strapi-generate-new/lib/after.js b/packages/strapi-generate-new/lib/after.js
index 98000d5b89..89979e68e2 100755
--- a/packages/strapi-generate-new/lib/after.js
+++ b/packages/strapi-generate-new/lib/after.js
@@ -13,7 +13,7 @@ const _ = require('lodash');
 const {green, cyan} = require('chalk');
 const fs = require('fs-extra');
 const npm = require('enpeem');
-const ora = require('ora');
+const ora = require('ora'); // eslint-disable-line import/no-unresolved
 
 /**
  * Runs after this generator has finished
diff --git a/packages/strapi-plugin-content-manager/admin/src/components/DraggableAttr/index.js b/packages/strapi-plugin-content-manager/admin/src/components/DraggableAttr/index.js
index a9f9efc19e..3ae6f5ed80 100644
--- a/packages/strapi-plugin-content-manager/admin/src/components/DraggableAttr/index.js
+++ b/packages/strapi-plugin-content-manager/admin/src/components/DraggableAttr/index.js
@@ -10,7 +10,7 @@ import {
   DragSource,
   DropTarget,
 } from 'react-dnd';
-import { flow } from 'lodash';
+import { flow, upperFirst } from 'lodash';
 import PropTypes from 'prop-types';
 import { FormattedMessage } from 'react-intl';
 
@@ -94,6 +94,12 @@ class DraggableAttr extends React.Component {
     }
   }
 
+  handleClickEdit = (e) => {
+    e.preventDefault();
+    e.stopPropagation();
+    this.props.onClickEditListItem(this.props.index);
+  }
+
   handleMouseEnter = () => {
     if (!this.props.isDraggingSibling) {
       this.setState({ isHover: true });
@@ -102,10 +108,14 @@ class DraggableAttr extends React.Component {
 
   handleMouseLeave = () => this.setState({ isHover: false });
 
-  handleRemove = () => this.props.onRemove(this.props.index, this.props.keys);
+  handleRemove = (e) => {
+    e.preventDefault();
+    e.stopPropagation();
+    this.props.onRemove(this.props.index, this.props.keys);
+  }
 
   render() {
-    const { name, isDragging, connectDragSource, connectDropTarget } = this.props;
+    const { label, name, isDragging, connectDragSource, connectDropTarget } = this.props;
     const { isHover } = this.state;
     const opacity = isDragging ? 0.2 : 1;
 
@@ -116,6 +126,7 @@ class DraggableAttr extends React.Component {
             className={styles.draggableAttr}
             onMouseEnter={this.handleMouseEnter}
             onMouseLeave={this.handleMouseLeave}
+            onClick={this.handleClickEdit}
             style={{ opacity }}
           >
             <i className="fa fa-th" aria-hidden="true"></i>
@@ -125,6 +136,11 @@ class DraggableAttr extends React.Component {
                 <FormattedMessage id="content-manager.components.DraggableAttr.edit" />
               </div>
             )}
+            { !isHover && upperFirst(name) !== label && (
+              <div className={styles.info}>
+                {label}
+              </div>
+            )}
             <span className={styles.removeIcon} onClick={this.handleRemove} />            
           </div>
         ),
@@ -144,7 +160,9 @@ DraggableAttr.propTypes = {
   isDragging: PropTypes.bool.isRequired,
   isDraggingSibling: PropTypes.bool.isRequired,
   keys: PropTypes.string.isRequired,
+  label: PropTypes.string.isRequired,
   name: PropTypes.string.isRequired,
+  onClickEditListItem: PropTypes.func.isRequired,
   onRemove: PropTypes.func,
 };
 
diff --git a/packages/strapi-plugin-content-manager/admin/src/components/DraggableAttr/styles.scss b/packages/strapi-plugin-content-manager/admin/src/components/DraggableAttr/styles.scss
index 5f9d1ad651..05a0b3a820 100644
--- a/packages/strapi-plugin-content-manager/admin/src/components/DraggableAttr/styles.scss
+++ b/packages/strapi-plugin-content-manager/admin/src/components/DraggableAttr/styles.scss
@@ -54,7 +54,7 @@
   margin-bottom: 8px;
   padding-left: 10px;
   justify-content: space-between;
-  background: #FAFAFB;
+  background: #E6F0FB;
   line-height: 28px;
   color: #333740;
   border: 1px solid #AED4FB;
diff --git a/packages/strapi-plugin-content-manager/admin/src/components/TableHeader/index.js b/packages/strapi-plugin-content-manager/admin/src/components/TableHeader/index.js
index 5a0ce6016e..b8d95174e4 100755
--- a/packages/strapi-plugin-content-manager/admin/src/components/TableHeader/index.js
+++ b/packages/strapi-plugin-content-manager/admin/src/components/TableHeader/index.js
@@ -56,7 +56,11 @@ class TableHeader extends React.Component {
       return (
         <th // eslint-disable-line jsx-a11y/no-static-element-interactions
           key={i}
-          onClick={() => this.handleChangeSort(header.name)}
+          onClick={() => {
+            if (header.sortable) {
+              this.handleChangeSort(header.name);
+            }
+          }}
         >
           <span>
             {header.label}
diff --git a/packages/strapi-plugin-content-manager/admin/src/containers/SettingPage/actions.js b/packages/strapi-plugin-content-manager/admin/src/containers/SettingPage/actions.js
index e69de29bb2..addfc2db6b 100644
--- a/packages/strapi-plugin-content-manager/admin/src/containers/SettingPage/actions.js
+++ b/packages/strapi-plugin-content-manager/admin/src/containers/SettingPage/actions.js
@@ -0,0 +1,8 @@
+import { ON_CLICK_EDIT_LIST_ITEM } from './constants';
+
+export function onClickEditListItem(index) {
+  return {
+    type: ON_CLICK_EDIT_LIST_ITEM,
+    index,
+  };
+}
\ No newline at end of file
diff --git a/packages/strapi-plugin-content-manager/admin/src/containers/SettingPage/constants.js b/packages/strapi-plugin-content-manager/admin/src/containers/SettingPage/constants.js
index e69de29bb2..2b106289dd 100644
--- a/packages/strapi-plugin-content-manager/admin/src/containers/SettingPage/constants.js
+++ b/packages/strapi-plugin-content-manager/admin/src/containers/SettingPage/constants.js
@@ -0,0 +1 @@
+export const ON_CLICK_EDIT_LIST_ITEM = 'contentManager/SettingPage/ON_CLICK_EDIT_LIST_ITEM';
\ No newline at end of file
diff --git a/packages/strapi-plugin-content-manager/admin/src/containers/SettingPage/forms.json b/packages/strapi-plugin-content-manager/admin/src/containers/SettingPage/forms.json
index 6c5e24ffeb..a8d6d93daf 100644
--- a/packages/strapi-plugin-content-manager/admin/src/containers/SettingPage/forms.json
+++ b/packages/strapi-plugin-content-manager/admin/src/containers/SettingPage/forms.json
@@ -60,5 +60,35 @@
       "validations": {}
     }
     
+  ],
+  "editList": [
+    {
+      "label": { "id": "content-manager.form.Input.label" },
+      "customBootstrapClass": "col-md-7",
+      "didCheckErrors": false,
+      "errors": [],
+      "inputDescription": { "id": "content-manager.form.Input.label.inputDescription" },
+      "name": "label",
+      "type": "string",
+      "validations": {}
+    },
+    {
+      "label": { "id": "content-manager.form.Input.sort.field" },
+      "customBootstrapClass": "col-md-6",
+      "didCheckErrors": false,
+      "errors": [],
+      "name": "sortable",
+      "type": "toggle",
+      "validations": {}
+    },
+    {
+      "label": { "id": "content-manager.form.Input.search.field" },
+      "customBootstrapClass": "col-md-6",
+      "didCheckErrors": false,
+      "errors": [],
+      "name": "searchable",
+      "type": "toggle",
+      "validations": {}
+    }
   ]
 }
\ No newline at end of file
diff --git a/packages/strapi-plugin-content-manager/admin/src/containers/SettingPage/index.js b/packages/strapi-plugin-content-manager/admin/src/containers/SettingPage/index.js
index b90d7c2b5d..586e44b362 100644
--- a/packages/strapi-plugin-content-manager/admin/src/containers/SettingPage/index.js
+++ b/packages/strapi-plugin-content-manager/admin/src/containers/SettingPage/index.js
@@ -36,6 +36,7 @@ import DraggableAttr from 'components/DraggableAttr';
 
 import injectReducer from 'utils/injectReducer';
 import injectSaga from 'utils/injectSaga';
+import { onClickEditListItem } from './actions';
 
 import forms from './forms.json';
 import reducer from './reducer';
@@ -125,14 +126,24 @@ class SettingPage extends React.PureComponent {
   toggle = () => this.setState(prevState => ({ showWarning: !prevState.showWarning }));
 
   toggleDropdown = () => {
-    if (this.getListDisplay().length > 0) {
+    if (this.getDropDownItems().length > 0) {
       this.setState(prevState => ({ isOpen: !prevState.isOpen }));
     }
   }
 
   render() {
     const { isDraggingSibling, isOpen, showWarning } = this.state;
-    const { moveAttr, onChangeSettings, onClickAddAttr, onRemove, onSubmit } = this.props;
+    const {
+      moveAttr,
+      onChangeSettings,
+      onClickAddAttr,
+      onClickEditListItem,
+      onRemove,
+      onSubmit,
+      settingPage: {
+        indexListItemToEdit,
+      },
+    } = this.props;
     const namePath = this.getPath();
 
     return (
@@ -201,11 +212,13 @@ class SettingPage extends React.PureComponent {
                         <div key={attr.name} className={styles.draggedWrapper}>
                           <div>{index}.</div>
                           <DraggableAttr
+                            index={index}
                             key={attr.name}
                             keys={this.getPath()}
-                            index={index}
+                            label={attr.label}
                             name={attr.name}
                             moveAttr={moveAttr}
+                            onClickEditListItem={onClickEditListItem}
                             onRemove={onRemove}
                             updateSiblingHoverState={this.updateSiblingHoverState}
                             isDraggingSibling={isDraggingSibling}
@@ -241,6 +254,25 @@ class SettingPage extends React.PureComponent {
                         </DropdownMenu>
                       </ButtonDropdown>
                     </div>
+                    <div className="col-md-7">
+                      <div className={styles.editWrapper}>
+                        <div className="row">
+                          {forms.editList.map(input => {
+                            const inputName = `${namePath}.listDisplay.${indexListItemToEdit}.${input.name}`;
+
+                            return (
+                              <Input
+                                key={input.name}
+                                onChange={onChangeSettings}
+                                value={this.getValue(inputName, input.type)}
+                                {...input}
+                                name={inputName}
+                              />
+                            );
+                          })}
+                        </div>
+                      </div>
+                    </div>
                   </div>
                 </div>
               </form>
@@ -260,10 +292,12 @@ SettingPage.propTypes = {
   moveAttr: PropTypes.func.isRequired,
   onChangeSettings: PropTypes.func.isRequired,
   onClickAddAttr: PropTypes.func.isRequired,
+  onClickEditListItem: PropTypes.func.isRequired,
   onRemove: PropTypes.func.isRequired,
   onReset: PropTypes.func.isRequired,
   onSubmit: PropTypes.func.isRequired,
   schema: PropTypes.object.isRequired,
+  settingPage: PropTypes.object.isRequired,
 };
 
 const mapDispatchToProps = (dispatch) => (
@@ -272,6 +306,7 @@ const mapDispatchToProps = (dispatch) => (
       moveAttr,
       onChangeSettings,
       onClickAddAttr,
+      onClickEditListItem,
       onRemove,
       onReset,
       onSubmit,
diff --git a/packages/strapi-plugin-content-manager/admin/src/containers/SettingPage/reducer.js b/packages/strapi-plugin-content-manager/admin/src/containers/SettingPage/reducer.js
index 2a6c6ae480..c29e24b869 100644
--- a/packages/strapi-plugin-content-manager/admin/src/containers/SettingPage/reducer.js
+++ b/packages/strapi-plugin-content-manager/admin/src/containers/SettingPage/reducer.js
@@ -4,11 +4,16 @@
  */
 
 import { fromJS } from 'immutable';
+import { ON_CLICK_EDIT_LIST_ITEM } from './constants';
 
-const initialState = fromJS({});
+const initialState = fromJS({
+  indexListItemToEdit: 0,
+});
 
 function settingPageReducer(state = initialState, action) {
   switch (action.type) {
+    case ON_CLICK_EDIT_LIST_ITEM:
+      return state.update('indexListItemToEdit', () => action.index);
     default:
       return state;
   }
diff --git a/packages/strapi-plugin-content-manager/admin/src/containers/SettingPage/styles.scss b/packages/strapi-plugin-content-manager/admin/src/containers/SettingPage/styles.scss
index f564c1aa78..3dd9956905 100644
--- a/packages/strapi-plugin-content-manager/admin/src/containers/SettingPage/styles.scss
+++ b/packages/strapi-plugin-content-manager/admin/src/containers/SettingPage/styles.scss
@@ -47,4 +47,11 @@
     margin-bottom: 28px;
     color: #787E8F;
   }
+}
+
+.editWrapper {
+  min-height: 246px;
+  padding: 24px 30px;
+  background-color: #FAFAFB;
+  border-radius: 2px; 
 }
\ No newline at end of file
diff --git a/packages/strapi-plugin-content-manager/admin/src/translations/en.json b/packages/strapi-plugin-content-manager/admin/src/translations/en.json
index 43651cd515..73726f8737 100755
--- a/packages/strapi-plugin-content-manager/admin/src/translations/en.json
+++ b/packages/strapi-plugin-content-manager/admin/src/translations/en.json
@@ -86,8 +86,12 @@
   "error.validation.minSupMax": "Can't be superior",
   "error.validation.json": "This is not a JSON",
 
+  "form.Input.label.inputDescription": "This value overrides the label displayed in the table's head",
+  "form.Input.label": "Label",
   "form.Input.search": "Enable search",
+  "form.Input.search.field": "Enable search on this field",
   "form.Input.filters": "Enable filters",
+  "form.Input.sort.field": "Enable sort on this field",
   "form.Input.bulkActions": "Enable bulk actions",
   "form.Input.pageEntries": "Entries per page",
   "form.Input.pageEntries.inputDescription": "Note: You can override this value in the Content Type settings page.",
diff --git a/packages/strapi-plugin-content-manager/admin/src/translations/fr.json b/packages/strapi-plugin-content-manager/admin/src/translations/fr.json
index 3743a615e0..7db63762f1 100755
--- a/packages/strapi-plugin-content-manager/admin/src/translations/fr.json
+++ b/packages/strapi-plugin-content-manager/admin/src/translations/fr.json
@@ -83,8 +83,12 @@
   "error.validation.minSupMax": "Ne peut pas être plus grand",
   "error.validation.json": "Le format JSON n'est pas respecté",
 
+  "form.Input.label": "Label",
+  "form.Input.label.inputDescription": "Cette valeur modifie celle du champs de la table",
   "form.Input.search": "Autoriser la search",
+  "form.Input.search.field": "Autoriser la search sur ce champs",
   "form.Input.filters": "Autoriser les filtres",
+  "form.Input.sort.field": "Autoriser le trie sur ce champs",
   "form.Input.bulkActions": "Autoriser les bulk actions",
   "form.Input.pageEntries": "Nombre d'entrées par page",
   "form.Input.pageEntries.inputDescription": "Note: Vous pouvez les modifier ces valeurs par modèle",

From bc248b9f545e2fac11f3b7ded27f758249fa9ad7 Mon Sep 17 00:00:00 2001
From: cyril lopez <cyril.lpz@gmail.com>
Date: Wed, 4 Jul 2018 16:49:15 +0200
Subject: [PATCH 23/65] Design setting page

---
 .../src/assets/images/icon-edit-blue.svg      |  24 +++
 .../src/components/DraggableAttr/index.js     |  18 +-
 .../src/components/DraggableAttr/styles.scss  |  25 ++-
 .../admin/src/containers/App/reducer.js       |  21 ++-
 .../src/containers/SettingPage/actions.js     |   4 +-
 .../admin/src/containers/SettingPage/index.js | 158 +++++++++++++-----
 .../src/containers/SettingPage/reducer.js     |   4 +-
 .../src/containers/SettingPage/styles.scss    |  72 +++++++-
 .../src/containers/SettingsPage/styles.scss   |   5 +
 .../admin/src/translations/en.json            |   2 +
 .../admin/src/translations/fr.json            |   2 +
 11 files changed, 279 insertions(+), 56 deletions(-)
 create mode 100644 packages/strapi-plugin-content-manager/admin/src/assets/images/icon-edit-blue.svg

diff --git a/packages/strapi-plugin-content-manager/admin/src/assets/images/icon-edit-blue.svg b/packages/strapi-plugin-content-manager/admin/src/assets/images/icon-edit-blue.svg
new file mode 100644
index 0000000000..3fc5c78b59
--- /dev/null
+++ b/packages/strapi-plugin-content-manager/admin/src/assets/images/icon-edit-blue.svg
@@ -0,0 +1,24 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<svg width="10px" height="10px" viewBox="0 0 10 10" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
+    <!-- Generator: Sketch 50.2 (55047) - http://www.bohemiancoding.com/sketch -->
+    <title>Shape</title>
+    <desc>Created with Sketch.</desc>
+    <defs></defs>
+    <g id="Pages" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
+        <g id="Content-Manager---Settings-view---Single" transform="translate(-668.000000, -604.000000)" fill="#007EFF" fill-rule="nonzero">
+            <g id="Container" transform="translate(257.000000, 84.000000)">
+                <g id="Forms" transform="translate(0.000000, 77.000000)">
+                    <g id="Settings">
+                        <g id="Attributes" transform="translate(12.000000, 327.000000)">
+                            <g id="Order-attributes" transform="translate(0.000000, 23.000000)">
+                                <g id="Link" transform="translate(35.000000, 0.000000)">
+                                    <path d="M366.39604,102.155116 L366.9967,101.554455 L365.445545,100.0033 L364.844884,100.60396 L364.844884,101.310231 L365.689769,101.310231 L365.689769,102.155116 L366.39604,102.155116 Z M369.848185,96.029703 C369.848185,95.9328933 369.79978,95.8844884 369.70297,95.8844884 C369.658966,95.8844884 369.621562,95.89989 369.590759,95.9306931 L366.013201,99.5082508 C365.982398,99.5390539 365.966997,99.5764576 365.966997,99.620462 C365.966997,99.7172717 366.015402,99.7656766 366.112211,99.7656766 C366.156216,99.7656766 366.193619,99.750275 366.224422,99.7194719 L369.80198,96.1419142 C369.832783,96.1111111 369.848185,96.0737074 369.848185,96.029703 Z M369.491749,94.7623762 L372.237624,97.5082508 L366.745875,103 L364,103 L364,100.254125 L369.491749,94.7623762 Z M374,95.3960396 C374,95.6292629 373.918592,95.8272827 373.755776,95.990099 L372.660066,97.0858086 L369.914191,94.339934 L371.009901,93.2508251 C371.168317,93.0836084 371.366337,93 371.60396,93 C371.837184,93 372.037404,93.0836084 372.20462,93.2508251 L373.755776,94.7953795 C373.918592,94.9669967 374,95.1672167 374,95.3960396 Z" id="Shape"></path>
+                                </g>
+                            </g>
+                        </g>
+                    </g>
+                </g>
+            </g>
+        </g>
+    </g>
+</svg>
\ No newline at end of file
diff --git a/packages/strapi-plugin-content-manager/admin/src/components/DraggableAttr/index.js b/packages/strapi-plugin-content-manager/admin/src/components/DraggableAttr/index.js
index 3ae6f5ed80..604e83a5ad 100644
--- a/packages/strapi-plugin-content-manager/admin/src/components/DraggableAttr/index.js
+++ b/packages/strapi-plugin-content-manager/admin/src/components/DraggableAttr/index.js
@@ -13,6 +13,7 @@ import {
 import { flow, upperFirst } from 'lodash';
 import PropTypes from 'prop-types';
 import { FormattedMessage } from 'react-intl';
+import cn from 'classnames';
 
 import styles from './styles.scss';
 
@@ -29,7 +30,8 @@ const draggableAttrSource = {
   },
   endDrag: (props, monitor, component) => {
     const el = findDOMNode(component);
-    el.className = styles.draggableAttr;
+    const className = props.isEditing ? `${styles.draggableAttr} ${styles.editingAttr}` : styles.draggableAttr;
+    el.className = className;
     props.updateSiblingHoverState();
 
     return {};
@@ -115,7 +117,7 @@ class DraggableAttr extends React.Component {
   }
 
   render() {
-    const { label, name, isDragging, connectDragSource, connectDropTarget } = this.props;
+    const { label, name, isDragging, isEditing, connectDragSource, connectDropTarget } = this.props;
     const { isHover } = this.state;
     const opacity = isDragging ? 0.2 : 1;
 
@@ -123,13 +125,13 @@ class DraggableAttr extends React.Component {
       connectDragSource(
         connectDropTarget(
           <div
-            className={styles.draggableAttr}
+            className={cn(styles.draggableAttr, isEditing && styles.editingAttr)}
             onMouseEnter={this.handleMouseEnter}
             onMouseLeave={this.handleMouseLeave}
             onClick={this.handleClickEdit}
             style={{ opacity }}
           >
-            <i className="fa fa-th" aria-hidden="true"></i>
+            <i className="fa fa-th" aria-hidden="true" />
             <span>{name}</span>
             { isHover && !isDragging && (
               <div className={styles.info}>
@@ -141,7 +143,11 @@ class DraggableAttr extends React.Component {
                 {label}
               </div>
             )}
-            <span className={styles.removeIcon} onClick={this.handleRemove} />            
+            {isEditing && !isHover? (
+              <span className={styles.editIcon} onClick={this.handleClickEdit} />            
+            ) : (
+              <span className={styles.removeIcon} onClick={this.handleRemove} />            
+            )}
           </div>
         ),
       )
@@ -150,6 +156,7 @@ class DraggableAttr extends React.Component {
 }
 
 DraggableAttr.defaultProps = {
+  isEditing: false,
   onRemove: () => {},
 };
 
@@ -159,6 +166,7 @@ DraggableAttr.propTypes = {
   index: PropTypes.number.isRequired,
   isDragging: PropTypes.bool.isRequired,
   isDraggingSibling: PropTypes.bool.isRequired,
+  isEditing: PropTypes.bool,
   keys: PropTypes.string.isRequired,
   label: PropTypes.string.isRequired,
   name: PropTypes.string.isRequired,
diff --git a/packages/strapi-plugin-content-manager/admin/src/components/DraggableAttr/styles.scss b/packages/strapi-plugin-content-manager/admin/src/components/DraggableAttr/styles.scss
index 05a0b3a820..e4a88542e5 100644
--- a/packages/strapi-plugin-content-manager/admin/src/components/DraggableAttr/styles.scss
+++ b/packages/strapi-plugin-content-manager/admin/src/components/DraggableAttr/styles.scss
@@ -12,7 +12,7 @@
   border-radius: 2px;
   > i {
     margin-right: 10px;
-    font-size: 10px;
+    font-size: 11px;
     color: #B3B5B9;
   }
   &:hover {
@@ -20,6 +20,10 @@
   }
 }
 
+.editingAttr {
+  background: #E6F0FB!important;
+}
+
 .info {
   position: absolute;
   top: 0;
@@ -47,6 +51,25 @@
   }
 }
 
+.editIcon {
+  width: 30px;
+  background: #E6F0FB;
+  height: 26px;
+  cursor: pointer;
+  text-align: center;
+  float: right;
+
+  &:after {
+    display: inline-block;
+    content: '';
+    width: 10px;
+    height: 10px;
+    margin: auto;
+    margin-top: -3px;
+    background-image: url('../../assets/images/icon-edit-blue.svg');
+  }
+}
+
 .dragged {
   position: relative;
   height: 28px;
diff --git a/packages/strapi-plugin-content-manager/admin/src/containers/App/reducer.js b/packages/strapi-plugin-content-manager/admin/src/containers/App/reducer.js
index e2bda2a94e..f6b96da582 100755
--- a/packages/strapi-plugin-content-manager/admin/src/containers/App/reducer.js
+++ b/packages/strapi-plugin-content-manager/admin/src/containers/App/reducer.js
@@ -80,9 +80,24 @@ function appReducer(state = initialState, action) {
       return state
         .updateIn(['modifiedSchema', 'models'].concat(action.keys.split('.')).concat(['listDisplay']), list => list.push(fromJS(action.data)));
     case ON_REMOVE:
-      return state.updateIn(['modifiedSchema', 'models'].concat(action.keys.split('.')).concat(['listDisplay']), list => (
-        list.delete(action.index)
-      ));
+      return state.updateIn(['modifiedSchema', 'models'].concat(action.keys.split('.')).concat(['listDisplay']), list => {
+
+        // If the list is empty add the default Id attribute
+        if (list.size -1 === 0) {
+          const attrToAdd = state.getIn(['schema', 'models'].concat(action.keys.split('.')).concat(['listDisplay']))
+            .filter(attr => {
+              return attr.get('name') === '_id' || attr.get('name') === 'id';
+            });
+          
+          attrToAdd.setIn(['0', 'sortable'], () => true);
+          
+          return list
+            .delete(action.index)
+            .push(attrToAdd.get('0'));
+        }
+
+        return list.delete(action.index);
+      });
     case ON_RESET:
       return state
         .update('modifiedSchema', () => state.get('schema'));
diff --git a/packages/strapi-plugin-content-manager/admin/src/containers/SettingPage/actions.js b/packages/strapi-plugin-content-manager/admin/src/containers/SettingPage/actions.js
index addfc2db6b..f008b1a80c 100644
--- a/packages/strapi-plugin-content-manager/admin/src/containers/SettingPage/actions.js
+++ b/packages/strapi-plugin-content-manager/admin/src/containers/SettingPage/actions.js
@@ -1,8 +1,8 @@
 import { ON_CLICK_EDIT_LIST_ITEM } from './constants';
 
-export function onClickEditListItem(index) {
+export function onClickEditListItem(listItemToEdit) {
   return {
     type: ON_CLICK_EDIT_LIST_ITEM,
-    index,
+    listItemToEdit,
   };
 }
\ No newline at end of file
diff --git a/packages/strapi-plugin-content-manager/admin/src/containers/SettingPage/index.js b/packages/strapi-plugin-content-manager/admin/src/containers/SettingPage/index.js
index 586e44b362..ea1bed0beb 100644
--- a/packages/strapi-plugin-content-manager/admin/src/containers/SettingPage/index.js
+++ b/packages/strapi-plugin-content-manager/admin/src/containers/SettingPage/index.js
@@ -48,8 +48,17 @@ import styles from './styles.scss';
 class SettingPage extends React.PureComponent {
   state = { showWarning: false, isDraggingSibling: false, isOpen: false };
 
+  componentDidMount() {
+    this.handleClickEditAttr(0);
+  }
+
+  getDefaultSort = () => this.getValue(`${this.getPath()}.defaultSort`, 'string');
+
   getDropDownItems = () => {
-    const attributes = get(this.props.schema, `models.${this.getPath()}.attributes`, []);
+    const name = get(this.props.schema, `models.${this.getPath()}.primaryKey`, 'id' );
+    const defaultAttr = { [name]: { name, label: 'Id', type: 'string', searchable: true, sortable: true } };
+    const attributes = Object.assign(get(this.props.schema, `models.${this.getPath()}.attributes`, {}), defaultAttr);
+
     return Object.keys(attributes)
       .filter(attr => {
         return findIndex(this.getListDisplay(), ['name', attr]) === -1 && !attributes[attr].hasOwnProperty('collection') && !attributes[attr].hasOwnProperty('model');
@@ -81,11 +90,18 @@ class SettingPage extends React.PureComponent {
   }
 
   getSelectOptions = (input) => {
-    const { schema: { models } } = this.props;
-    const currentAttributes = get(models, this.getModelName().concat(['attributes']), []);
-    const selectOptions = [get(models, this.getModelName().concat(['primaryKey']), 'id')]
-      .concat(Object.keys(currentAttributes)
-        .filter(attr => currentAttributes[attr].type !== 'json' && currentAttributes[attr].type !== 'array'));
+    const selectOptions = this.getListDisplay().reduce((acc, curr) => {
+
+      if (curr.sortable === true) {
+        return acc.concat([curr.name]);
+      }
+
+      return acc;
+    }, []);
+
+    if (selectOptions.length === 0) {
+      selectOptions.push(this.getPrimaryKey());
+    }
 
     return input.name === 'defaultSort' ? selectOptions : input.selectOptions;
   }
@@ -107,6 +123,8 @@ class SettingPage extends React.PureComponent {
     ]
   );
 
+  getPrimaryKey = () => get(this.props.schema, ['models', this.getModelName()].concat(['primaryKey']), 'id');
+
   getValue = (keys, type) => {
     const value =  get(this.props.schema, ['models'].concat(keys.split('.')));
 
@@ -114,11 +132,60 @@ class SettingPage extends React.PureComponent {
 
   }
 
+  handleChange = (e) => {
+    const defaultSort = this.getDefaultSort();
+    const name = e.target.name.split('.');
+    name.pop();
+    const attrName = get(this.props.schema.models, name.concat(['name']));
+    const isDisablingDefaultSort = attrName === defaultSort && e.target.value === false;
+
+    if (isDisablingDefaultSort) {
+      const enableAttrsSort = this.getSelectOptions({ name: 'defaultSort' }).filter(attr => attr !== attrName);
+      
+      if (enableAttrsSort.length === 0) {
+        strapi.notification.info('content-manager.notification.info.SettingPage.disableSort');
+      } else {
+        const newDefaultSort = enableAttrsSort.length === 0 ? this.getPrimaryKey() : enableAttrsSort[0];
+        const target = { name: `${this.getPath()}.defaultSort`, value: newDefaultSort };  
+        this.props.onChangeSettings({ target });
+        this.props.onChangeSettings(e);
+      }
+    } else {
+      this.props.onChangeSettings(e);
+    }
+  }
+
+  handleClickEditAttr = (index) => {
+    const attrToEdit = get(this.props.schema, ['models', this.getModelName()].concat(['listDisplay', index]), {});
+    this.props.onClickEditListItem(attrToEdit);
+  }
+
+  handleRemove = (index, keys) => {
+    const attrToRemove = get(this.getListDisplay(), index, {});
+    const defaultSort = this.getDefaultSort();
+    const isRemovingDefaultSort = defaultSort === attrToRemove.name;
+    
+    if (isRemovingDefaultSort) {
+      const enableAttrsSort = this.getSelectOptions({ name: 'defaultSort' }).filter(attr => attr !== attrToRemove.name);
+      const newDefaultSort = enableAttrsSort.length > 1 ? enableAttrsSort[0] : this.getPrimaryKey();
+      const target = { name: `${this.getPath()}.defaultSort`, value: newDefaultSort };  
+      this.props.onChangeSettings({ target });
+    }
+
+    this.props.onRemove(index, keys);
+  }
+
   handleSubmit = (e) => {
     e.preventDefault();
     this.setState({ showWarning: true });
   }
 
+  findIndexListItemToEdit = () => {
+    const index = findIndex(this.getListDisplay(), ['name', get(this.props.settingPage, ['listItemToEdit', 'name'])]);
+
+    return index === -1 ? 0 : index;
+  }
+
   updateSiblingHoverState = () => {
     this.setState(prevState => ({ isDraggingSibling: !prevState.isDraggingSibling }));
   };
@@ -137,12 +204,7 @@ class SettingPage extends React.PureComponent {
       moveAttr,
       onChangeSettings,
       onClickAddAttr,
-      onClickEditListItem,
-      onRemove,
       onSubmit,
-      settingPage: {
-        indexListItemToEdit,
-      },
     } = this.props;
     const namePath = this.getPath();
 
@@ -213,57 +275,67 @@ class SettingPage extends React.PureComponent {
                           <div>{index}.</div>
                           <DraggableAttr
                             index={index}
+                            isDraggingSibling={isDraggingSibling}
+                            isEditing={index === this.findIndexListItemToEdit()}
                             key={attr.name}
                             keys={this.getPath()}
                             label={attr.label}
                             name={attr.name}
                             moveAttr={moveAttr}
-                            onClickEditListItem={onClickEditListItem}
-                            onRemove={onRemove}
+                            onClickEditListItem={this.handleClickEditAttr}
+                            onRemove={this.handleRemove}
                             updateSiblingHoverState={this.updateSiblingHoverState}
-                            isDraggingSibling={isDraggingSibling}
                           />
                         </div>
                       ))}
-                      <ButtonDropdown isOpen={isOpen} toggle={this.toggleDropdown}>
-                        <DropdownToggle caret>
-                          Button Dropdown
-                        </DropdownToggle>
-                        <DropdownMenu>
-                          {this.getDropDownItems().map((item, i) => {
-                            if (i !== this.getDropDownItems().length - 1 && this.getDropDownItems().length > 0) {
-                              return (
-                                <React.Fragment key={item.name}>
-                                  <DropdownItem onClick={() => onClickAddAttr(item, this.getPath())}>
-                                    {item.label}
-                                  </DropdownItem>
-                                  <DropdownItem divider />
-                                </React.Fragment>
-                              );
-                            }
+                      <div className={styles.dropdownWrapper}>
+                        <ButtonDropdown isOpen={isOpen} toggle={this.toggleDropdown}>
+                          <DropdownToggle>
+                            <FormattedMessage id="content-manager.containers.SettingPage.addField">
+                              {msg => <p>{msg}</p>}
+                            </FormattedMessage>
+                          </DropdownToggle>
+                          <DropdownMenu>
+                            {this.getDropDownItems().map((item, i) => {
+                              if (i !== this.getDropDownItems().length - 1 && this.getDropDownItems().length > 0) {
+                                return (
+                                  <React.Fragment key={item.name}>
+                                    <DropdownItem onClick={() => onClickAddAttr(item, this.getPath())}>
+                                      {item.label}
+                                    </DropdownItem>
+                                    <DropdownItem divider />
+                                  </React.Fragment>
+                                );
+                              }
 
-                            return (
-                              <DropdownItem
-                                key={item.name}
-                                onClick={() => onClickAddAttr(item, this.getPath())}
-                              >
-                                {item.label}
-                              </DropdownItem>
-                            );                
-                          })}
-                        </DropdownMenu>
-                      </ButtonDropdown>
+                              return (
+                                <DropdownItem
+                                  key={item.name}
+                                  onClick={() => onClickAddAttr(item, this.getPath())}
+                                >
+                                  {item.label}
+                                </DropdownItem>
+                              );                
+                            })}
+                          </DropdownMenu>
+                        </ButtonDropdown>
+                      </div>
                     </div>
                     <div className="col-md-7">
                       <div className={styles.editWrapper}>
                         <div className="row">
-                          {forms.editList.map(input => {
+                          {forms.editList.map((input, i) => {
+                            const indexListItemToEdit = this.findIndexListItemToEdit();
                             const inputName = `${namePath}.listDisplay.${indexListItemToEdit}.${input.name}`;
 
+                            if (indexListItemToEdit === -1) {
+                              return <div key={i} />;
+                            }
+
                             return (
                               <Input
                                 key={input.name}
-                                onChange={onChangeSettings}
+                                onChange={this.handleChange}
                                 value={this.getValue(inputName, input.type)}
                                 {...input}
                                 name={inputName}
diff --git a/packages/strapi-plugin-content-manager/admin/src/containers/SettingPage/reducer.js b/packages/strapi-plugin-content-manager/admin/src/containers/SettingPage/reducer.js
index c29e24b869..2cd54cc754 100644
--- a/packages/strapi-plugin-content-manager/admin/src/containers/SettingPage/reducer.js
+++ b/packages/strapi-plugin-content-manager/admin/src/containers/SettingPage/reducer.js
@@ -7,13 +7,15 @@ import { fromJS } from 'immutable';
 import { ON_CLICK_EDIT_LIST_ITEM } from './constants';
 
 const initialState = fromJS({
+  listItemToEdit: fromJS({}),
   indexListItemToEdit: 0,
 });
 
 function settingPageReducer(state = initialState, action) {
   switch (action.type) {
     case ON_CLICK_EDIT_LIST_ITEM:
-      return state.update('indexListItemToEdit', () => action.index);
+      return state
+        .update('listItemToEdit', () => fromJS(action.listItemToEdit));
     default:
       return state;
   }
diff --git a/packages/strapi-plugin-content-manager/admin/src/containers/SettingPage/styles.scss b/packages/strapi-plugin-content-manager/admin/src/containers/SettingPage/styles.scss
index 3dd9956905..65fca2baa9 100644
--- a/packages/strapi-plugin-content-manager/admin/src/containers/SettingPage/styles.scss
+++ b/packages/strapi-plugin-content-manager/admin/src/containers/SettingPage/styles.scss
@@ -28,8 +28,10 @@
 .draggedWrapper {
   display: flex;
   > div:first-child {
-    margin-right: 10px;
     height: 30px;
+    width: 20px;
+    margin-right: 10px;
+    text-align: right;
     line-height: 30px;
   }
 }
@@ -54,4 +56,72 @@
   padding: 24px 30px;
   background-color: #FAFAFB;
   border-radius: 2px; 
+}
+
+.dropdownWrapper {
+  margin-left: 30px;
+  > div {
+    height: 28px;
+    width: 100%;
+    justify-content: space-between;
+    background: #ffffff;
+    color: #333740;
+    border: 1px solid #E3E9F3;
+    border-radius: 2px;
+    > button {
+      position: relative;
+      cursor: pointer;
+      padding-left: 10px !important;
+      line-height: 28px;
+      width: 100%;
+      color: #333740;
+      text-align: left;
+      background-color: #ffffff;
+      border: none;
+      font-size: 13px;
+      &:focus, &:active, &:hover, &:visited {
+        background-color: transparent!important;
+        box-shadow: none;
+        color: #333740;
+      }
+      > p {
+        height: 100%;
+        margin-left: 20px;
+        margin-bottom: 0;
+        margin-top: -1px;
+        color: #007EFF !important;
+        font-size: 13px !important;
+      }
+      &:before {
+        position: absolute;
+        top: 0;
+        bottom: 0;
+        content: '\f067';
+        font-family: FontAwesome;
+        font-size: 10px;
+        color: #007EFF;
+      }
+    }
+    > div {
+      max-height: 180px;
+      min-width: calc(100% + 2px);
+      margin-left: -1px;
+      margin-top: -1px;
+      border-top-left-radius: 0 !important;
+      border-top-right-radius: 0;
+
+      overflow: scroll;
+      
+      button {
+        height: 28px;
+        line-height: 28px;
+        div {
+          margin: 0;
+          white-space: nowrap;
+          overflow: hidden;
+          text-overflow: ellipsis;
+        }
+      }
+    }
+  }
 }
\ No newline at end of file
diff --git a/packages/strapi-plugin-content-manager/admin/src/containers/SettingsPage/styles.scss b/packages/strapi-plugin-content-manager/admin/src/containers/SettingsPage/styles.scss
index 896ce87589..cc3db06f18 100644
--- a/packages/strapi-plugin-content-manager/admin/src/containers/SettingsPage/styles.scss
+++ b/packages/strapi-plugin-content-manager/admin/src/containers/SettingsPage/styles.scss
@@ -7,6 +7,11 @@
 
 .container {
   padding-top: 18px;
+  > div:last-child {
+    > div {
+      padding-bottom: 0 !important;
+    }
+  }
 }
 
 .main_wrapper{
diff --git a/packages/strapi-plugin-content-manager/admin/src/translations/en.json b/packages/strapi-plugin-content-manager/admin/src/translations/en.json
index 73726f8737..b4995e2b71 100755
--- a/packages/strapi-plugin-content-manager/admin/src/translations/en.json
+++ b/packages/strapi-plugin-content-manager/admin/src/translations/en.json
@@ -15,6 +15,7 @@
   "components.LimitSelect.itemsPerPage": "Items per page",
   "containers.List.errorFetchRecords": "Error",
   
+  "containers.SettingPage.addField": "Add new field",
   "containers.SettingPage.attributes": "Attributes fields",
   "containers.SettingPage.attributes.description": "Define the order of the attributes",
 
@@ -98,6 +99,7 @@
   "form.Input.defaultSort": "Default sort attribute",
 
   "notification.error.relationship.fetch": "An error occurred during relationship fetch.",
+  "notification.info.SettingPage.disableSort": "You need to have one attribute with the sorting allowed",
 
   "success.record.delete": "Deleted",
   "success.record.save": "Saved",
diff --git a/packages/strapi-plugin-content-manager/admin/src/translations/fr.json b/packages/strapi-plugin-content-manager/admin/src/translations/fr.json
index 7db63762f1..971325d272 100755
--- a/packages/strapi-plugin-content-manager/admin/src/translations/fr.json
+++ b/packages/strapi-plugin-content-manager/admin/src/translations/fr.json
@@ -15,6 +15,7 @@
   "components.LimitSelect.itemsPerPage": "Éléments par page",
   "containers.List.errorFetchRecords": "Erreur",
 
+  "containers.SettingPage.addField": "Ajouter un nouveau champs",
   "containers.SettingPage.attributes": "Attributs",
   "containers.SettingPage.attributes.description": "Organiser les attributs du modèle",
   "containers.SettingPage.pluginHeaderDescription": "Configurez les paramètres de ce modèle",
@@ -95,6 +96,7 @@
   "form.Input.defaultSort": "Attribut de trie par défault",
 
   "notification.error.relationship.fetch": "Une erreur est survenue en récupérant les relations.",
+  "notification.info.SettingPage.disableSort": "Vous devez avoir au moins un attribut de trie par défaut",
 
   "success.record.delete": "Supprimé",
   "success.record.save": "Sauvegardé",

From 2ee5558272e0e1dcfa789672ba6b62fa39344389 Mon Sep 17 00:00:00 2001
From: cyril lopez <cyril.lpz@gmail.com>
Date: Wed, 4 Jul 2018 17:00:03 +0200
Subject: [PATCH 24/65] Prevent from displaying toggle search and sort on array
 || json attributes

---
 .../admin/src/containers/SettingPage/index.js              | 7 +++++++
 1 file changed, 7 insertions(+)

diff --git a/packages/strapi-plugin-content-manager/admin/src/containers/SettingPage/index.js b/packages/strapi-plugin-content-manager/admin/src/containers/SettingPage/index.js
index ea1bed0beb..9d409a550c 100644
--- a/packages/strapi-plugin-content-manager/admin/src/containers/SettingPage/index.js
+++ b/packages/strapi-plugin-content-manager/admin/src/containers/SettingPage/index.js
@@ -327,11 +327,17 @@ class SettingPage extends React.PureComponent {
                           {forms.editList.map((input, i) => {
                             const indexListItemToEdit = this.findIndexListItemToEdit();
                             const inputName = `${namePath}.listDisplay.${indexListItemToEdit}.${input.name}`;
+                            const inputType = this.getListDisplay()[indexListItemToEdit].type;
+
 
                             if (indexListItemToEdit === -1) {
                               return <div key={i} />;
                             }
 
+                            if ((inputType === 'json' || inputType === 'array') && (input.name === 'sortable' || input.name === 'searchable')) {
+                              return null;
+                            }
+
                             return (
                               <Input
                                 key={input.name}
@@ -341,6 +347,7 @@ class SettingPage extends React.PureComponent {
                                 name={inputName}
                               />
                             );
+
                           })}
                         </div>
                       </div>

From d3ef2f8e3cb11ac380494780bbe54e33c7dd8955 Mon Sep 17 00:00:00 2001
From: Kati Frantz <frantzenterprises777@gmail.com>
Date: Tue, 3 Jul 2018 15:23:13 +0100
Subject: [PATCH 25/65] fetch current actions from database use results for
 comparing if new actions have been added to controllers

---
 .../services/UsersPermissions.js                          | 8 ++++++--
 1 file changed, 6 insertions(+), 2 deletions(-)

diff --git a/packages/strapi-plugin-users-permissions/services/UsersPermissions.js b/packages/strapi-plugin-users-permissions/services/UsersPermissions.js
index 4e5fc46f2f..8064aa2aff 100644
--- a/packages/strapi-plugin-users-permissions/services/UsersPermissions.js
+++ b/packages/strapi-plugin-users-permissions/services/UsersPermissions.js
@@ -199,7 +199,11 @@ module.exports = {
   },
 
   updatePermissions: async function (cb) {
-    const actions = strapi.plugins['users-permissions'].config.actions || [];
+    // fetch all the current permissions from the database, and format them into an array of actions.
+    const databasePermissions = await strapi.query('permission', 'users-permissions').find();
+    const actions = databasePermissions
+      .map(permission => `${permission.type}.${permission.controller}.${permission.action}`);
+    
 
     // Aggregate first level actions.
     const appActions = Object.keys(strapi.api || {}).reduce((acc, api) => {
@@ -232,7 +236,7 @@ module.exports = {
     // Merge array into one.
     const currentActions = appActions.concat(pluginsActions);
     // Count permissions available.
-    const permissions = await strapi.query('permission', 'users-permissions').count();
+    const permissions = databasePermissions.length;
 
     // Compare to know if actions have been added or removed from controllers.
     if (!_.isEqual(actions, currentActions) || permissions < 1) {

From 3ea2c2023f49646bb233e5abe5516e2020da9fa8 Mon Sep 17 00:00:00 2001
From: Kati Frantz <frantzenterprises777@gmail.com>
Date: Tue, 3 Jul 2018 15:03:53 +0100
Subject: [PATCH 26/65] update ctx.request.body to be
 ctx.request.body.providers, to ensure only permissions are saved to database
 with no extra keys

---
 .../controllers/UsersPermissions.js                             | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/packages/strapi-plugin-users-permissions/controllers/UsersPermissions.js b/packages/strapi-plugin-users-permissions/controllers/UsersPermissions.js
index 568e33155e..bc8bec8133 100644
--- a/packages/strapi-plugin-users-permissions/controllers/UsersPermissions.js
+++ b/packages/strapi-plugin-users-permissions/controllers/UsersPermissions.js
@@ -237,7 +237,7 @@ module.exports = {
       type: 'plugin',
       name: 'users-permissions',
       key: 'grant'
-    }).set({value: ctx.request.body});
+    }).set({value: ctx.request.body.providers});
 
     ctx.send({ ok: true });
   }

From 56152f446234cb8ad4cc31abf59a751ad7b46e5e Mon Sep 17 00:00:00 2001
From: cyril lopez <cyril.lpz@gmail.com>
Date: Thu, 5 Jul 2018 17:09:34 +0200
Subject: [PATCH 27/65] Update schema in ctm bootstrap file to reflect the
 updated values

---
 .../lib/src/components/PageFooter/index.js    |   2 +
 .../config/functions/bootstrap.js             | 108 ++++++++++++++----
 .../config/layout.json                        |  44 +------
 3 files changed, 91 insertions(+), 63 deletions(-)

diff --git a/packages/strapi-helper-plugin/lib/src/components/PageFooter/index.js b/packages/strapi-helper-plugin/lib/src/components/PageFooter/index.js
index 898adbf6de..a1575206bf 100644
--- a/packages/strapi-helper-plugin/lib/src/components/PageFooter/index.js
+++ b/packages/strapi-helper-plugin/lib/src/components/PageFooter/index.js
@@ -14,6 +14,8 @@ import GlobalPagination from 'components/GlobalPagination';
 
 import styles from './styles.scss';
 
+/* eslint-disable jsx-a11y/label-has-for */
+
 function PageFooter(props) {
   return (
     <div className={cn('row', styles.pageFooter)} style={props.style}>
diff --git a/packages/strapi-plugin-content-manager/config/functions/bootstrap.js b/packages/strapi-plugin-content-manager/config/functions/bootstrap.js
index 75ba6c032e..27f373a8a3 100644
--- a/packages/strapi-plugin-content-manager/config/functions/bootstrap.js
+++ b/packages/strapi-plugin-content-manager/config/functions/bootstrap.js
@@ -129,41 +129,109 @@ module.exports = async cb => {
     type: 'plugin',
     name: 'content-manager'
   });
-  
-  const buildSchemaKeys = (data) => Object.keys(data).reduce((acc, curr) => {
-    if (curr !== 'plugins') {
 
-      if (!data[curr].fields && _.isObject(data[curr])) {
-        return buildSchemaKeys(data[curr]);
-      }
+  const getApis = (data) => Object.keys(data).reduce((acc, curr) => {
+    if (data[curr].fields) {
+      return acc.concat([curr]);
+    }
 
-      return acc.concat([{ [curr]: Object.keys(data[curr].fields) }]);
-    } 
-  
-    return buildSchemaKeys(data[curr]);
+    if (curr === 'plugins') {
+      Object.keys(data[curr]).map(plugin => {
+        Object.keys(data[curr][plugin]).map(api => {
+          acc = acc.concat([`${curr}.${plugin}.${api}`]);
+        });
+      });
+    }
+
+    return acc;
   }, []);
+
+  const getApisKeys = (data, sameArray) => sameArray.map(apiPath => {
+    const fields = Object.keys(_.get(data.models, apiPath.concat(['fields'])));
+
+    return fields.map(field => `${apiPath.join('.')}.fields.${field}`);
+  });
   
   try {
     const prevSchema = await pluginStore.get({ key: 'schema' });
-  
+
     if (!prevSchema) {
       pluginStore.set({ key: 'schema', value: schema });
       return cb(); 
     }
+
+    const splitted = str => str.split('.');
+    const prevSchemaApis = getApis(prevSchema.models);
+    const schemaApis = getApis(schema.models);
+    const apisToAdd = schemaApis.filter(api => prevSchemaApis.indexOf(api) === -1).map(splitted);
+    const apisToRemove = prevSchemaApis.filter(api => schemaApis.indexOf(api) === -1).map(splitted);
+    const sameApis = schemaApis.filter(api => prevSchemaApis.indexOf(api) !== -1).map(splitted);
+    const schemaSameApisKeys = _.flattenDeep(getApisKeys(schema, sameApis));
+    const prevSchemaSameApisKeys = _.flattenDeep(getApisKeys(prevSchema, sameApis));
+    const sameApisAttrToAdd = schemaSameApisKeys.filter(attr => prevSchemaSameApisKeys.indexOf(attr) === -1).map(splitted);
+    const sameApisAttrToRemove = prevSchemaSameApisKeys.filter(attr => schemaSameApisKeys.indexOf(attr) === -1).map(splitted);
+
+    // Remove api
+    apisToRemove.map(apiPath => {
+      _.unset(prevSchema.models, apiPath);
+    });
+    
+    // Remove API attribute
+    sameApisAttrToRemove.map(attrPath => {
+      // Check default sort and change it if needed
+      _.unset(prevSchema.models, attrPath);
+      const apiPath = attrPath.length > 3 ? _.take(attrPath, 3) : _.take(attrPath, 1);
+      const listDisplayPath = apiPath.concat('listDisplay');
+      const prevListDisplay = _.get(prevSchema.models, listDisplayPath);
+      const defaultSortPath = apiPath.concat('defaultSort');
+      const currentAttr = attrPath.slice(-1);
+
+      const defaultSort = _.get(prevSchema.models, defaultSortPath);
+
+      if (_.includes(currentAttr, defaultSort)) {
+        _.set(prevSchema.models, defaultSortPath, _.get(schema.models, defaultSortPath));
+      }
+
+      // Update the displayed fields
+      const updatedListDisplay = prevListDisplay.filter(obj => obj.name !== currentAttr.join());
+
+      if (updatedListDisplay.length === 0) {
+        // Update it with the one from the generaeted schema
+        _.set(prevSchema.models, listDisplayPath, _.get(schema.models, listDisplayPath, []));
+      } else {
+        _.set(prevSchema.models, listDisplayPath, updatedListDisplay);
+      }
+    });
+
+    // Add API
+    apisToAdd.map(apiPath => {
+      const api = _.get(schema.models, apiPath);
+      _.set(prevSchema.models, apiPath, api);
+    });
   
-    const prevSchemaKeys = buildSchemaKeys(prevSchema.models);
-    const schemaKeys = buildSchemaKeys(schema.models);
-  
-    // Update the store with the new created APIs
-    if (!_.isEqual(prevSchemaKeys, schemaKeys)) {
-      pluginStore.set({ key: 'schema', value: _.merge(schema, prevSchema) });
-    }
-  
+    // Add attribute to existing API
+    sameApisAttrToAdd.map(attrPath => {
+      const attr = _.get(schema.models, attrPath);
+      _.set(prevSchema.models, attrPath, attr);
+    });
+
+
+    // Update other keys
+    sameApis.map(apiPath => {
+      const keysToUpdate = ['relations', 'loadedModel', 'associations', 'attributes'].map(key => apiPath.concat(key));
+
+      keysToUpdate.map(keyPath => {
+        const newValue = _.get(schema.models, keyPath);
+        
+        _.set(prevSchema.models, keyPath, newValue);
+      });
+    });
+
+    pluginStore.set({ key: 'schema', value: prevSchema });
   
   } catch(err) {
     console.log('error', err);
   }  
-  
 
   cb();
 };
\ No newline at end of file
diff --git a/packages/strapi-plugin-content-manager/config/layout.json b/packages/strapi-plugin-content-manager/config/layout.json
index 73bd1a7dcc..9e26dfeeb6 100644
--- a/packages/strapi-plugin-content-manager/config/layout.json
+++ b/packages/strapi-plugin-content-manager/config/layout.json
@@ -1,43 +1 @@
-{
-  "product": {
-    "attributes": {
-      "name": {
-        "appearance": ""
-      },
-      "json": {
-        "appearance": ""
-      },
-      "bool": {
-        "appearance": ""
-      },
-      "description": {
-        "appearance": ""
-      },
-      "price": {
-        "appearance": ""
-      },
-      "sold": {
-        "appearance": ""
-      },
-      "date": {
-        "appearance": ""
-      },
-      "email": {
-        "appearance": ""
-      },
-      "password": {
-        "appearance": ""
-      },
-      "enum": {
-        "appearance": ""
-      }
-    }
-  },
-  "tag": {
-    "attributes": {
-      "name": {
-        "appearance": ""
-      }
-    }
-  }
-}
\ No newline at end of file
+{}
\ No newline at end of file

From 23a354092b13f85af68ecd9489d9fa6f238ace92 Mon Sep 17 00:00:00 2001
From: cyril lopez <cyril.lpz@gmail.com>
Date: Thu, 5 Jul 2018 17:57:30 +0200
Subject: [PATCH 28/65] PUT new settings

---
 .../admin/src/containers/App/actions.js       |  7 ++++
 .../admin/src/containers/App/constants.js     |  1 +
 .../admin/src/containers/App/reducer.js       | 10 +++--
 .../admin/src/containers/App/sagas.js         | 20 ++++++++--
 .../admin/src/containers/App/selectors.js     |  4 ++
 .../admin/src/containers/SettingPage/index.js | 18 +++++++--
 .../src/containers/SettingsPage/index.js      | 11 +++++-
 .../config/functions/bootstrap.js             |  2 +-
 .../config/routes.json                        |  8 ++++
 .../controllers/ContentManager.js             | 39 ++++++-------------
 10 files changed, 79 insertions(+), 41 deletions(-)

diff --git a/packages/strapi-plugin-content-manager/admin/src/containers/App/actions.js b/packages/strapi-plugin-content-manager/admin/src/containers/App/actions.js
index 1062a56b6c..b406ba155a 100755
--- a/packages/strapi-plugin-content-manager/admin/src/containers/App/actions.js
+++ b/packages/strapi-plugin-content-manager/admin/src/containers/App/actions.js
@@ -18,6 +18,7 @@ import {
   ON_REMOVE,
   ON_RESET,
   ON_SUBMIT,
+  SUBMIT_SUCCEEDED,
 } from './constants';
 
 export function emptyStore() {
@@ -109,4 +110,10 @@ export function onSubmit() {
   return {
     type: ON_SUBMIT,
   };
+}
+
+export function submitSucceeded() {
+  return {
+    type: SUBMIT_SUCCEEDED,
+  };
 }
\ No newline at end of file
diff --git a/packages/strapi-plugin-content-manager/admin/src/containers/App/constants.js b/packages/strapi-plugin-content-manager/admin/src/containers/App/constants.js
index 135487995d..da86d7c25e 100755
--- a/packages/strapi-plugin-content-manager/admin/src/containers/App/constants.js
+++ b/packages/strapi-plugin-content-manager/admin/src/containers/App/constants.js
@@ -16,3 +16,4 @@ export const ON_CLICK_ADD_ATTR = 'contentManager/App/ON_CLICK_ADD_ATTR';
 export const ON_REMOVE = 'contentManager/App/ON_REMOVE';
 export const ON_RESET = 'contentManager/App/ON_RESET';
 export const ON_SUBMIT = 'contentManager/App/ON_SUBMIT';
+export const SUBMIT_SUCCEEDED = 'contentManager/App/SUBMIT_SUCCEEDED';
diff --git a/packages/strapi-plugin-content-manager/admin/src/containers/App/reducer.js b/packages/strapi-plugin-content-manager/admin/src/containers/App/reducer.js
index f6b96da582..342e221ac4 100755
--- a/packages/strapi-plugin-content-manager/admin/src/containers/App/reducer.js
+++ b/packages/strapi-plugin-content-manager/admin/src/containers/App/reducer.js
@@ -16,15 +16,16 @@ import {
   ON_CLICK_ADD_ATTR,
   ON_REMOVE,
   ON_RESET,
-  ON_SUBMIT,
+  SUBMIT_SUCCEEDED,
 } from './constants';
 
 const initialState = fromJS({
-  modelEntries: 0,
+  formValidations: List([]),
   loading: true,
+  modelEntries: 0,
   modifiedSchema: fromJS({}),
   schema: fromJS({}),
-  formValidations: List([]),
+  submitSuccess: false,
 });
 
 function appReducer(state = initialState, action) {
@@ -101,8 +102,9 @@ function appReducer(state = initialState, action) {
     case ON_RESET:
       return state
         .update('modifiedSchema', () => state.get('schema'));
-    case ON_SUBMIT:
+    case SUBMIT_SUCCEEDED:
       return state
+        .update('submitSuccess', v => v = !v)
         .update('schema', () => state.get('modifiedSchema'));
     default:
       return state;
diff --git a/packages/strapi-plugin-content-manager/admin/src/containers/App/sagas.js b/packages/strapi-plugin-content-manager/admin/src/containers/App/sagas.js
index 2b497175fa..0b15e3f1e2 100755
--- a/packages/strapi-plugin-content-manager/admin/src/containers/App/sagas.js
+++ b/packages/strapi-plugin-content-manager/admin/src/containers/App/sagas.js
@@ -1,10 +1,11 @@
 import { LOCATION_CHANGE } from 'react-router-redux';
-import { fork, put, call, takeLatest, take, cancel } from 'redux-saga/effects';
+import { fork, put, call, takeLatest, take, cancel, select } from 'redux-saga/effects';
 import request from 'utils/request';
 
 
-import { getModelEntriesSucceeded, loadedModels } from './actions';
-import { GET_MODEL_ENTRIES, LOAD_MODELS } from './constants';
+import { getModelEntriesSucceeded, loadedModels, submitSucceeded } from './actions';
+import { GET_MODEL_ENTRIES, LOAD_MODELS, ON_SUBMIT } from './constants';
+import { makeSelectModifiedSchema } from './selectors';
 
 export function* modelEntriesGet(action) {
   try {
@@ -29,10 +30,23 @@ export function* getModels() {
   }
 }
 
+export function* submit() {
+  try {
+    const schema = yield select(makeSelectModifiedSchema());
+    yield call(request, '/content-manager/models', { method: 'PUT', body: { schema } });
+
+    yield put(submitSucceeded());
+  } catch(err) {
+    // Silent
+    // NOTE: should we add another notification??
+  }
+}
+
 // Individual exports for testing
 export function* defaultSaga() {
   const loadModelsWatcher = yield fork(takeLatest, LOAD_MODELS, getModels);
   const loadEntriesWatcher = yield fork(takeLatest, GET_MODEL_ENTRIES, modelEntriesGet);
+  yield fork(takeLatest, ON_SUBMIT, submit);
 
   yield take(LOCATION_CHANGE);
 
diff --git a/packages/strapi-plugin-content-manager/admin/src/containers/App/selectors.js b/packages/strapi-plugin-content-manager/admin/src/containers/App/selectors.js
index 943df4d4dc..cefef25e1d 100755
--- a/packages/strapi-plugin-content-manager/admin/src/containers/App/selectors.js
+++ b/packages/strapi-plugin-content-manager/admin/src/containers/App/selectors.js
@@ -44,6 +44,9 @@ const makeSelectSchema = () =>
 const makeSelectModifiedSchema = () =>
   createSelector(selectGlobalDomain(), substate => substate.get('modifiedSchema').toJS());
 
+const makeSelectSubmitSuccess = () =>
+  createSelector(selectGlobalDomain(), substate => substate.get('submitSuccess'));
+
 export {
   selectGlobalDomain,
   selectLocationState,
@@ -51,4 +54,5 @@ export {
   makeSelectModelEntries,
   makeSelectModifiedSchema,
   makeSelectSchema,
+  makeSelectSubmitSuccess,
 };
diff --git a/packages/strapi-plugin-content-manager/admin/src/containers/SettingPage/index.js b/packages/strapi-plugin-content-manager/admin/src/containers/SettingPage/index.js
index 9d409a550c..cc7c59fa8a 100644
--- a/packages/strapi-plugin-content-manager/admin/src/containers/SettingPage/index.js
+++ b/packages/strapi-plugin-content-manager/admin/src/containers/SettingPage/index.js
@@ -24,7 +24,7 @@ import {
   onReset,
   onSubmit,
 } from 'containers/App/actions';
-import { makeSelectModifiedSchema } from 'containers/App/selectors';
+import { makeSelectModifiedSchema , makeSelectSubmitSuccess } from 'containers/App/selectors';
 
 import BackHeader from 'components/BackHeader';
 import Input from 'components/InputsIndex';
@@ -52,6 +52,16 @@ class SettingPage extends React.PureComponent {
     this.handleClickEditAttr(0);
   }
 
+  componentDidUpdate(prevProps) {
+    if (prevProps.submitSuccess !== this.props.submitSuccess) {
+      this.toggle();
+    }
+  }
+
+  componentWillUnmount() {
+    this.props.onReset();
+  }
+
   getDefaultSort = () => this.getValue(`${this.getPath()}.defaultSort`, 'string');
 
   getDropDownItems = () => {
@@ -129,7 +139,6 @@ class SettingPage extends React.PureComponent {
     const value =  get(this.props.schema, ['models'].concat(keys.split('.')));
 
     return type === 'toggle' ? value : value.toString();
-
   }
 
   handleChange = (e) => {
@@ -156,7 +165,7 @@ class SettingPage extends React.PureComponent {
   }
 
   handleClickEditAttr = (index) => {
-    const attrToEdit = get(this.props.schema, ['models', this.getModelName()].concat(['listDisplay', index]), {});
+    const attrToEdit = get(this.props.schema, ['models'].concat(this.getPath().split('.')).concat(['listDisplay', index]), {});
     this.props.onClickEditListItem(attrToEdit);
   }
 
@@ -229,7 +238,6 @@ class SettingPage extends React.PureComponent {
             popUpWarningType="danger"
             onConfirm={() => {
               onSubmit();
-              this.toggle();
             }}
           />
           <div className={cn('row', styles.container)}>
@@ -377,6 +385,7 @@ SettingPage.propTypes = {
   onSubmit: PropTypes.func.isRequired,
   schema: PropTypes.object.isRequired,
   settingPage: PropTypes.object.isRequired,
+  submitSuccess: PropTypes.bool.isRequired,
 };
 
 const mapDispatchToProps = (dispatch) => (
@@ -397,6 +406,7 @@ const mapDispatchToProps = (dispatch) => (
 const mapStateToProps = createStructuredSelector({
   schema: makeSelectModifiedSchema(),
   settingPage: makeSelectSettingPage(),
+  submitSuccess: makeSelectSubmitSuccess(),
 });
 
 const withConnect = connect(mapStateToProps, mapDispatchToProps);
diff --git a/packages/strapi-plugin-content-manager/admin/src/containers/SettingsPage/index.js b/packages/strapi-plugin-content-manager/admin/src/containers/SettingsPage/index.js
index 584f679509..cd0be5a5df 100644
--- a/packages/strapi-plugin-content-manager/admin/src/containers/SettingsPage/index.js
+++ b/packages/strapi-plugin-content-manager/admin/src/containers/SettingsPage/index.js
@@ -12,7 +12,7 @@ import { get, sortBy } from 'lodash';
 import PropTypes from 'prop-types';
 
 import { onChange, onSubmit, onReset } from 'containers/App/actions';
-import { makeSelectModifiedSchema } from 'containers/App/selectors';
+import { makeSelectModifiedSchema, makeSelectSubmitSuccess } from 'containers/App/selectors';
 
 import Input from 'components/InputsIndex';
 import PluginHeader from 'components/PluginHeader';
@@ -33,6 +33,12 @@ import forms from './forms.json';
 class SettingsPage extends React.PureComponent {
   state = { showWarning: false };
 
+  componentDidUpdate(prevProps) {
+    if (prevProps.submitSuccess !== this.props.submitSuccess) {
+      this.toggle();
+    }
+  }
+
   getModels = (data = this.props.schema.models, destination = '/') => {
     const models = Object.keys(data).reduce((acc, curr) => {
       if (curr !== 'plugins') {
@@ -112,7 +118,6 @@ class SettingsPage extends React.PureComponent {
           popUpWarningType="danger"
           onConfirm={() => {
             onSubmit();
-            this.toggle();
           }}
         />
         <div className={cn('row', styles.container)}>
@@ -160,6 +165,7 @@ SettingsPage.propTypes = {
   onReset: PropTypes.func.isRequired,
   onSubmit: PropTypes.func.isRequired,
   schema: PropTypes.object.isRequired,
+  submitSuccess: PropTypes.bool.isRequired,
 };
 
 const mapDispatchToProps = (dispatch) => (
@@ -175,6 +181,7 @@ const mapDispatchToProps = (dispatch) => (
 
 const mapStateToProps = createStructuredSelector({
   schema: makeSelectModifiedSchema(),
+  submitSuccess: makeSelectSubmitSuccess(),
 });
 
 const withConnect = connect(mapStateToProps, mapDispatchToProps);
diff --git a/packages/strapi-plugin-content-manager/config/functions/bootstrap.js b/packages/strapi-plugin-content-manager/config/functions/bootstrap.js
index 27f373a8a3..d0a89ee476 100644
--- a/packages/strapi-plugin-content-manager/config/functions/bootstrap.js
+++ b/packages/strapi-plugin-content-manager/config/functions/bootstrap.js
@@ -227,7 +227,7 @@ module.exports = async cb => {
       });
     });
 
-    pluginStore.set({ key: 'schema', value: prevSchema });
+    await pluginStore.set({ key: 'schema', value: prevSchema });
   
   } catch(err) {
     console.log('error', err);
diff --git a/packages/strapi-plugin-content-manager/config/routes.json b/packages/strapi-plugin-content-manager/config/routes.json
index 9b057fa5a5..5d63804036 100755
--- a/packages/strapi-plugin-content-manager/config/routes.json
+++ b/packages/strapi-plugin-content-manager/config/routes.json
@@ -32,6 +32,14 @@
         "policies": ["routing"]
       }
     },
+    {
+      "method": "PUT",
+      "path": "/models",
+      "handler": "ContentManager.updateSettings",
+      "config": {
+        "policies": ["routing"]
+      }
+    },
     {
       "method": "GET",
       "path": "/explorer/:model/:id",
diff --git a/packages/strapi-plugin-content-manager/controllers/ContentManager.js b/packages/strapi-plugin-content-manager/controllers/ContentManager.js
index 916ccd4a77..1238ad7fbf 100755
--- a/packages/strapi-plugin-content-manager/controllers/ContentManager.js
+++ b/packages/strapi-plugin-content-manager/controllers/ContentManager.js
@@ -14,33 +14,6 @@ module.exports = {
   },
 
   models: async ctx => {
-    // const pickData = (model) => _.pick(model, [
-    //   'info',
-    //   'connection',
-    //   'collectionName',
-    //   'attributes',
-    //   'identity',
-    //   'globalId',
-    //   'globalName',
-    //   'orm',
-    //   'loadedModel',
-    //   'primaryKey',
-    //   'associations'
-    // ]);
-
-    // const models = _.mapValues(strapi.models, pickData);
-    // delete models['core_store'];
-
-    // ctx.body = {
-    //   models,
-    //   plugins: Object.keys(strapi.plugins).reduce((acc, current) => {
-    //     acc[current] = {
-    //       models: _.mapValues(strapi.plugins[current].models, pickData)
-    //     };
-
-    //     return acc;
-    //   }, {})
-    // };
     const pluginsStore = strapi.store({
       environment: '',
       type: 'plugin',
@@ -115,6 +88,18 @@ module.exports = {
     }
   },
 
+  updateSettings: async ctx => {
+    const { schema } = ctx.request.body;
+    const pluginStore = strapi.store({
+      environment: '',
+      type: 'plugin',
+      name: 'content-manager'
+    });
+    await pluginStore.set({ key: 'schema', value: schema });
+
+    return ctx.body = { ok: true };
+  },
+
   delete: async ctx => {
     ctx.body = await strapi.plugins['content-manager'].services['contentmanager'].delete(ctx.params, ctx.request.query);
   },

From 3bfbd6b5c47de3ad1a04d24b8c66f5ba69226117 Mon Sep 17 00:00:00 2001
From: cyril lopez <cyril.lpz@gmail.com>
Date: Thu, 5 Jul 2018 18:03:19 +0200
Subject: [PATCH 29/65] Reset settingsPage props on unmount hook

---
 .../admin/src/containers/SettingsPage/index.js                | 4 ++++
 1 file changed, 4 insertions(+)

diff --git a/packages/strapi-plugin-content-manager/admin/src/containers/SettingsPage/index.js b/packages/strapi-plugin-content-manager/admin/src/containers/SettingsPage/index.js
index cd0be5a5df..5265cbc2c2 100644
--- a/packages/strapi-plugin-content-manager/admin/src/containers/SettingsPage/index.js
+++ b/packages/strapi-plugin-content-manager/admin/src/containers/SettingsPage/index.js
@@ -39,6 +39,10 @@ class SettingsPage extends React.PureComponent {
     }
   }
 
+  componentWillUnmount() {
+    this.props.onReset();
+  }
+  
   getModels = (data = this.props.schema.models, destination = '/') => {
     const models = Object.keys(data).reduce((acc, curr) => {
       if (curr !== 'plugins') {

From feae42160622a19513a3231fe82839e9e426ba8a Mon Sep 17 00:00:00 2001
From: Wanfung Lee <cloudwindhk@gmail.com>
Date: Thu, 5 Jul 2018 23:28:39 -0700
Subject: [PATCH 30/65] Bump react-select dependency

---
 packages/strapi-plugin-content-manager/package.json | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/packages/strapi-plugin-content-manager/package.json b/packages/strapi-plugin-content-manager/package.json
index 273a865a21..13b54ac746 100755
--- a/packages/strapi-plugin-content-manager/package.json
+++ b/packages/strapi-plugin-content-manager/package.json
@@ -22,7 +22,7 @@
     "prepublishOnly": "IS_MONOREPO=true npm run build"
   },
   "devDependencies": {
-    "react-select": "^1.0.0-rc.5",
+    "react-select": "^1.2.1",
     "strapi-helper-plugin": "3.0.0-alpha.12.6"
   },
   "author": {
@@ -46,4 +46,4 @@
     "npm": ">= 5.0.0"
   },
   "license": "MIT"
-}
\ No newline at end of file
+}

From 10abf7a2703c78aa218e19262c977444a7d9e655 Mon Sep 17 00:00:00 2001
From: Wanfung Lee <cloudwindhk@gmail.com>
Date: Thu, 5 Jul 2018 23:30:42 -0700
Subject: [PATCH 31/65] Workaround fix for react-select rerender bug

https://github.com/JedWatson/react-select/issues/2277
---
 .../admin/src/components/SelectOne/index.js                      | 1 +
 1 file changed, 1 insertion(+)

diff --git a/packages/strapi-plugin-content-manager/admin/src/components/SelectOne/index.js b/packages/strapi-plugin-content-manager/admin/src/components/SelectOne/index.js
index 7bef6eda65..34689803b9 100644
--- a/packages/strapi-plugin-content-manager/admin/src/components/SelectOne/index.js
+++ b/packages/strapi-plugin-content-manager/admin/src/components/SelectOne/index.js
@@ -133,6 +133,7 @@ class SelectOne extends React.Component { // eslint-disable-line react/prefer-st
           isLoading={this.state.isLoading}
           onMenuScrollToBottom={this.handleBottomScroll}
           onInputChange={this.handleInputChange}
+          onSelectResetsInput={false}
           simpleValue
           value={isNull(value) || isUndefined(value) ? null : {
             value: isFunction(value.toJS) ? value.toJS() : value,

From 30371a42bb71eb5c367a27f527976e43cd85d369 Mon Sep 17 00:00:00 2001
From: Wanfung Lee <cloudwindhk@gmail.com>
Date: Thu, 5 Jul 2018 23:31:32 -0700
Subject: [PATCH 32/65] Workaround fix for react-select rerender bug

https://github.com/JedWatson/react-select/issues/2277
---
 .../admin/src/components/SelectMany/index.js                     | 1 +
 1 file changed, 1 insertion(+)

diff --git a/packages/strapi-plugin-content-manager/admin/src/components/SelectMany/index.js b/packages/strapi-plugin-content-manager/admin/src/components/SelectMany/index.js
index 02d7d13cfc..22d95a29fd 100644
--- a/packages/strapi-plugin-content-manager/admin/src/components/SelectMany/index.js
+++ b/packages/strapi-plugin-content-manager/admin/src/components/SelectMany/index.js
@@ -141,6 +141,7 @@ class SelectMany extends React.Component {
           isLoading={this.state.isLoading}
           onMenuScrollToBottom={this.handleBottomScroll}
           onInputChange={this.handleInputChange}
+          onSelectResetsInput={false}
           multi
           value={
             isNull(value) || isUndefined(value) || value.size === 0

From 6af99aebdc38efeeca9d4c30ee2c6815c934d35c Mon Sep 17 00:00:00 2001
From: cyril lopez <cyril.lpz@gmail.com>
Date: Fri, 6 Jul 2018 12:34:11 +0200
Subject: [PATCH 33/65] Fix css

---
 .../admin/src/components/Block/styles.scss    |  2 +-
 .../src/components/DraggableAttr/index.js     | 31 ++++++------
 .../src/components/DraggableAttr/styles.scss  | 48 ++++++++++++++-----
 .../src/components/SettingsRow/styles.scss    |  1 +
 .../src/containers/SettingPage/forms.json     | 12 +----
 .../admin/src/containers/SettingPage/index.js |  5 +-
 .../src/containers/SettingPage/styles.scss    |  9 ++--
 7 files changed, 63 insertions(+), 45 deletions(-)

diff --git a/packages/strapi-plugin-content-manager/admin/src/components/Block/styles.scss b/packages/strapi-plugin-content-manager/admin/src/components/Block/styles.scss
index bb594ce73c..a37d677fea 100644
--- a/packages/strapi-plugin-content-manager/admin/src/components/Block/styles.scss
+++ b/packages/strapi-plugin-content-manager/admin/src/components/Block/styles.scss
@@ -10,8 +10,8 @@
 .ctmBlockTitle {
   padding-top: 0px;
   line-height: 18px;
-  font-weight: 400;
   > span {
+    font-weight: 600;
     color: #333740;
     font-size: 18px;
   }
diff --git a/packages/strapi-plugin-content-manager/admin/src/components/DraggableAttr/index.js b/packages/strapi-plugin-content-manager/admin/src/components/DraggableAttr/index.js
index 604e83a5ad..c9cd5ded9a 100644
--- a/packages/strapi-plugin-content-manager/admin/src/components/DraggableAttr/index.js
+++ b/packages/strapi-plugin-content-manager/admin/src/components/DraggableAttr/index.js
@@ -18,9 +18,7 @@ import cn from 'classnames';
 import styles from './styles.scss';
 
 const draggableAttrSource = {
-  beginDrag: (props, monitor, component) => {
-    const el = findDOMNode(component);
-    el.className = styles.dragged;
+  beginDrag: (props) => {
     props.updateSiblingHoverState();
 
     return {
@@ -28,10 +26,7 @@ const draggableAttrSource = {
       index: props.index,
     };
   },
-  endDrag: (props, monitor, component) => {
-    const el = findDOMNode(component);
-    const className = props.isEditing ? `${styles.draggableAttr} ${styles.editingAttr}` : styles.draggableAttr;
-    el.className = className;
+  endDrag: (props) => {
     props.updateSiblingHoverState();
 
     return {};
@@ -86,7 +81,7 @@ const draggableAttrTarget = {
 };
 
 class DraggableAttr extends React.Component {
-  state = { isHover: false };
+  state = { isOver: false, dragStart: false };
 
   componentDidUpdate(prevProps) {
     const { isDraggingSibling } = this.props;
@@ -104,11 +99,11 @@ class DraggableAttr extends React.Component {
 
   handleMouseEnter = () => {
     if (!this.props.isDraggingSibling) {
-      this.setState({ isHover: true });
+      this.setState({ isOver: true });
     }
   };
 
-  handleMouseLeave = () => this.setState({ isHover: false });
+  handleMouseLeave = () => this.setState({ isOver: false });
 
   handleRemove = (e) => {
     e.preventDefault();
@@ -118,14 +113,18 @@ class DraggableAttr extends React.Component {
 
   render() {
     const { label, name, isDragging, isEditing, connectDragSource, connectDropTarget } = this.props;
-    const { isHover } = this.state;
+    const { isOver, dragStart } = this.state;
     const opacity = isDragging ? 0.2 : 1;
+    const overClass = isOver ? styles.draggableAttrOvered : '';
+    const className = dragStart ? styles.dragged : styles.draggableAttr;
 
     return (
       connectDragSource(
         connectDropTarget(
           <div
-            className={cn(styles.draggableAttr, isEditing && styles.editingAttr)}
+            className={cn(className, isEditing && styles.editingAttr, overClass)}
+            onDragStart={() => this.setState({ dragStart: true })}
+            onDragEnd={() => this.setState({ dragStart: false })}
             onMouseEnter={this.handleMouseEnter}
             onMouseLeave={this.handleMouseLeave}
             onClick={this.handleClickEdit}
@@ -133,20 +132,20 @@ class DraggableAttr extends React.Component {
           >
             <i className="fa fa-th" aria-hidden="true" />
             <span>{name}</span>
-            { isHover && !isDragging && (
+            { isOver && !isDragging && (
               <div className={styles.info}>
                 <FormattedMessage id="content-manager.components.DraggableAttr.edit" />
               </div>
             )}
-            { !isHover && upperFirst(name) !== label && (
+            { !isOver && upperFirst(name) !== label && (
               <div className={styles.info}>
                 {label}
               </div>
             )}
-            {isEditing && !isHover? (
+            {isEditing && !isOver? (
               <span className={styles.editIcon} onClick={this.handleClickEdit} />            
             ) : (
-              <span className={styles.removeIcon} onClick={this.handleRemove} />            
+              <span className={cn( dragStart ? styles.removeIconDragged : styles.removeIcon)} onClick={this.handleRemove} />            
             )}
           </div>
         ),
diff --git a/packages/strapi-plugin-content-manager/admin/src/components/DraggableAttr/styles.scss b/packages/strapi-plugin-content-manager/admin/src/components/DraggableAttr/styles.scss
index e4a88542e5..36f71390c0 100644
--- a/packages/strapi-plugin-content-manager/admin/src/components/DraggableAttr/styles.scss
+++ b/packages/strapi-plugin-content-manager/admin/src/components/DraggableAttr/styles.scss
@@ -1,12 +1,12 @@
 .draggableAttr {
   position: relative;
-  height: 28px;
+  height: 30px;
   width: 100%;
-  margin-bottom: 8px;
+  margin-bottom: 6px;
   padding-left: 10px;
   justify-content: space-between;
   background: #FAFAFB;
-  line-height: 28px;
+  line-height: 30px;
   color: #333740;
   border: 1px solid #E3E9F3;
   border-radius: 2px;
@@ -15,13 +15,15 @@
     font-size: 11px;
     color: #B3B5B9;
   }
-  &:hover {
-    border: 1px solid #AED4FB!important;
-  }
+}
+
+.draggableAttrOvered {
+  border: 1px solid #AED4FB!important;
 }
 
 .editingAttr {
   background: #E6F0FB!important;
+  border: 1px solid #AED4FB!important;
 }
 
 .info {
@@ -35,7 +37,26 @@
 .removeIcon {
   width: 30px;
   background: #F3F4F4;
-  height: 26px;
+  height: 28px;
+  cursor: pointer;
+  text-align: center;
+  float: right;
+
+  &:after {
+    display: inline-block;
+    content: '';
+    width: 8px;
+    height: 8px;
+    margin: auto;
+    margin-top: -3px;
+    background-image: url('../../assets/images/icon-cross.svg');
+  }
+}
+
+.removeIconDragged {
+  width: 30px;
+  background: #F3F4F4;
+  height: 28px;
   cursor: pointer;
   text-align: center;
   float: right;
@@ -54,7 +75,7 @@
 .editIcon {
   width: 30px;
   background: #E6F0FB;
-  height: 26px;
+  height: 28px;
   cursor: pointer;
   text-align: center;
   float: right;
@@ -72,15 +93,16 @@
 
 .dragged {
   position: relative;
-  height: 28px;
+  height: 30px !important;
   width: 100%;
-  margin-bottom: 8px;
+  margin-bottom: 6px;
+  box-shadow: 0!important;
   padding-left: 10px;
   justify-content: space-between;
-  background: #E6F0FB;
-  line-height: 28px;
+  background: #E6F0FB !important;
+  line-height: 30px;
   color: #333740;
-  border: 1px solid #AED4FB;
+  border: 1px solid darken(#AED4FB, 20%)!important;
   border-radius: 2px;
   > i {
     margin-right: 10px;
diff --git a/packages/strapi-plugin-content-manager/admin/src/components/SettingsRow/styles.scss b/packages/strapi-plugin-content-manager/admin/src/components/SettingsRow/styles.scss
index c9645640de..dcaee4c528 100644
--- a/packages/strapi-plugin-content-manager/admin/src/components/SettingsRow/styles.scss
+++ b/packages/strapi-plugin-content-manager/admin/src/components/SettingsRow/styles.scss
@@ -28,4 +28,5 @@
 .frame {
   position: relative;
   padding-left: 55px;
+  font-weight: 500;
 }
\ No newline at end of file
diff --git a/packages/strapi-plugin-content-manager/admin/src/containers/SettingPage/forms.json b/packages/strapi-plugin-content-manager/admin/src/containers/SettingPage/forms.json
index a8d6d93daf..66e7de55b4 100644
--- a/packages/strapi-plugin-content-manager/admin/src/containers/SettingPage/forms.json
+++ b/packages/strapi-plugin-content-manager/admin/src/containers/SettingPage/forms.json
@@ -43,6 +43,7 @@
       "customBootstrapClass": "col-md-4 ml-md-auto",
       "didCheckErrors": false,
       "errors": [],
+      "style": { "marginRight": "-20px" },
       "name": "defaultSort",
       "selectOptions": ["_id"],
       "type": "select",
@@ -53,7 +54,7 @@
       "customBootstrapClass": "col-md-1",
       "didCheckErrors": false,
       "errors": [],
-      "inputStyle": { "maxWidth": "130px" },
+      
       "name": "sort",
       "selectOptions": ["ASC", "DESC"],
       "type": "select",
@@ -80,15 +81,6 @@
       "name": "sortable",
       "type": "toggle",
       "validations": {}
-    },
-    {
-      "label": { "id": "content-manager.form.Input.search.field" },
-      "customBootstrapClass": "col-md-6",
-      "didCheckErrors": false,
-      "errors": [],
-      "name": "searchable",
-      "type": "toggle",
-      "validations": {}
     }
   ]
 }
\ No newline at end of file
diff --git a/packages/strapi-plugin-content-manager/admin/src/containers/SettingPage/index.js b/packages/strapi-plugin-content-manager/admin/src/containers/SettingPage/index.js
index cc7c59fa8a..f8bb6eb7a1 100644
--- a/packages/strapi-plugin-content-manager/admin/src/containers/SettingPage/index.js
+++ b/packages/strapi-plugin-content-manager/admin/src/containers/SettingPage/index.js
@@ -251,11 +251,14 @@ class SettingPage extends React.PureComponent {
                     <div className="row">
                       {forms.inputs.map(input => {
                         const inputName = `${namePath}.${input.name}`;
-
+                        console.log(input.name)
+                        let inputStyle = input.name === 'defaulteSort' ? { marginRight: '-20px' } : {};
+                
                         return (
                           <Input
                             {...input}
                             key={input.name}
+                            // style={inputStyle}
                             name={inputName}
                             onChange={onChangeSettings}
                             selectOptions={this.getSelectOptions(input)}
diff --git a/packages/strapi-plugin-content-manager/admin/src/containers/SettingPage/styles.scss b/packages/strapi-plugin-content-manager/admin/src/containers/SettingPage/styles.scss
index 65fca2baa9..f403c79e06 100644
--- a/packages/strapi-plugin-content-manager/admin/src/containers/SettingPage/styles.scss
+++ b/packages/strapi-plugin-content-manager/admin/src/containers/SettingPage/styles.scss
@@ -61,7 +61,7 @@
 .dropdownWrapper {
   margin-left: 30px;
   > div {
-    height: 28px;
+    height: 30px;
     width: 100%;
     justify-content: space-between;
     background: #ffffff;
@@ -72,13 +72,14 @@
       position: relative;
       cursor: pointer;
       padding-left: 10px !important;
-      line-height: 28px;
+      line-height: 30px;
       width: 100%;
       color: #333740;
       text-align: left;
       background-color: #ffffff;
       border: none;
       font-size: 13px;
+      font-weight: 500;
       &:focus, &:active, &:hover, &:visited {
         background-color: transparent!important;
         box-shadow: none;
@@ -113,8 +114,8 @@
       overflow: scroll;
       
       button {
-        height: 28px;
-        line-height: 28px;
+        height: 30px;
+        line-height: 30px;
         div {
           margin: 0;
           white-space: nowrap;

From 92b86bed81f8a59338e97fba20f460533499a325 Mon Sep 17 00:00:00 2001
From: cyril lopez <cyril.lpz@gmail.com>
Date: Fri, 6 Jul 2018 12:40:16 +0200
Subject: [PATCH 34/65] Add comments

---
 .../admin/src/containers/SettingPage/index.js               | 6 +++---
 1 file changed, 3 insertions(+), 3 deletions(-)

diff --git a/packages/strapi-plugin-content-manager/admin/src/containers/SettingPage/index.js b/packages/strapi-plugin-content-manager/admin/src/containers/SettingPage/index.js
index f8bb6eb7a1..a354db7a29 100644
--- a/packages/strapi-plugin-content-manager/admin/src/containers/SettingPage/index.js
+++ b/packages/strapi-plugin-content-manager/admin/src/containers/SettingPage/index.js
@@ -59,6 +59,7 @@ class SettingPage extends React.PureComponent {
   }
 
   componentWillUnmount() {
+    // Reset the modified data
     this.props.onReset();
   }
 
@@ -66,6 +67,7 @@ class SettingPage extends React.PureComponent {
 
   getDropDownItems = () => {
     const name = get(this.props.schema, `models.${this.getPath()}.primaryKey`, 'id' );
+    // The id attribute is not present on schema so we need to add it manually
     const defaultAttr = { [name]: { name, label: 'Id', type: 'string', searchable: true, sortable: true } };
     const attributes = Object.assign(get(this.props.schema, `models.${this.getPath()}.attributes`, {}), defaultAttr);
 
@@ -195,6 +197,7 @@ class SettingPage extends React.PureComponent {
     return index === -1 ? 0 : index;
   }
 
+  // We need to remove the Over state on the DraggableAttr component
   updateSiblingHoverState = () => {
     this.setState(prevState => ({ isDraggingSibling: !prevState.isDraggingSibling }));
   };
@@ -251,14 +254,11 @@ class SettingPage extends React.PureComponent {
                     <div className="row">
                       {forms.inputs.map(input => {
                         const inputName = `${namePath}.${input.name}`;
-                        console.log(input.name)
-                        let inputStyle = input.name === 'defaulteSort' ? { marginRight: '-20px' } : {};
                 
                         return (
                           <Input
                             {...input}
                             key={input.name}
-                            // style={inputStyle}
                             name={inputName}
                             onChange={onChangeSettings}
                             selectOptions={this.getSelectOptions(input)}

From f1bc53aea3c3cea635efb8baba17e550d7978866 Mon Sep 17 00:00:00 2001
From: cyril lopez <cyril.lpz@gmail.com>
Date: Fri, 6 Jul 2018 13:21:50 +0200
Subject: [PATCH 35/65] Fix apply default settings to new apis

---
 .../admin/src/containers/SettingPage/forms.json             | 2 +-
 .../config/functions/bootstrap.js                           | 6 ++++++
 2 files changed, 7 insertions(+), 1 deletion(-)

diff --git a/packages/strapi-plugin-content-manager/admin/src/containers/SettingPage/forms.json b/packages/strapi-plugin-content-manager/admin/src/containers/SettingPage/forms.json
index 66e7de55b4..db8c126805 100644
--- a/packages/strapi-plugin-content-manager/admin/src/containers/SettingPage/forms.json
+++ b/packages/strapi-plugin-content-manager/admin/src/containers/SettingPage/forms.json
@@ -20,7 +20,7 @@
     },
     {
       "label": { "id": "content-manager.form.Input.bulkActions" },
-      "customBootstrapClass": "col-md-4",
+      "customBootstrapClass": "col-md-2",
       "didCheckErrors": false,
       "errors": [],
       "name": "bulkActions",
diff --git a/packages/strapi-plugin-content-manager/config/functions/bootstrap.js b/packages/strapi-plugin-content-manager/config/functions/bootstrap.js
index d0a89ee476..0f5f3fdf3c 100644
--- a/packages/strapi-plugin-content-manager/config/functions/bootstrap.js
+++ b/packages/strapi-plugin-content-manager/config/functions/bootstrap.js
@@ -206,6 +206,12 @@ module.exports = async cb => {
     // Add API
     apisToAdd.map(apiPath => {
       const api = _.get(schema.models, apiPath);
+      const { search, filters, bulkActions, pageEntries } = _.get(prevSchema, 'generalSettings');
+
+      _.set(api, 'filters', filters);
+      _.set(api, 'search', search);
+      _.set(api, 'bulkActions', bulkActions);
+      _.set(api, 'pageEntries', pageEntries);
       _.set(prevSchema.models, apiPath, api);
     });
   

From 6143c3e1ca59c710c47d73885dccbc2bc35bcbfd Mon Sep 17 00:00:00 2001
From: David Thomas <dev@synth3.tk>
Date: Sun, 8 Jul 2018 09:33:46 -0400
Subject: [PATCH 36/65] Skip number conversion on string fields

Fixes #1524
---
 packages/strapi-utils/lib/models.js | 24 +++++++++++++++++++-----
 1 file changed, 19 insertions(+), 5 deletions(-)
 mode change 100755 => 100644 packages/strapi-utils/lib/models.js

diff --git a/packages/strapi-utils/lib/models.js b/packages/strapi-utils/lib/models.js
old mode 100755
new mode 100644
index 4f416be13a..7af0be329f
--- a/packages/strapi-utils/lib/models.js
+++ b/packages/strapi-utils/lib/models.js
@@ -457,11 +457,25 @@ module.exports = {
     _.forEach(params, (value, key)  => {
       let result;
       let formattedValue;
-
-      // Check if the value if a valid candidate to be converted to a number value
-      formattedValue = isNumeric(value)
-        ? _.toNumber(value)
-        : value;
+      let modelAttributes = models[model]['attributes'];
+      let fieldType;
+      // Get the field type to later check if it's a string before number conversion
+      if (modelAttributes[key]) {
+        fieldType = modelAttributes[key]['type'];
+      } else {
+        let splitKey = key.split('_').pop();
+        if (modelAttributes[splitKey]) {
+          fieldType = modelAttributes[splitKey]['type'];
+        }
+      }
+      // Check if the value is a valid candidate to be converted to a number value
+      if (fieldType != 'string') {
+        formattedValue = isNumeric(value)
+          ? _.toNumber(value)
+          : value;
+      } else {
+        formattedValue = value;
+      }
 
       if (_.includes(['_start', '_limit'], key)) {
         result = convertor(formattedValue, key);

From 2abf6d46c54d7847f366a3bed777c6ccf23fd03e Mon Sep 17 00:00:00 2001
From: DMehaffy <derrickmehaffy@gmail.com>
Date: Tue, 10 Jul 2018 00:50:59 -0700
Subject: [PATCH 37/65] Update Admin build Docs

---
 docs/3.x.x/en/advanced/customize-admin.md | 4 +++-
 1 file changed, 3 insertions(+), 1 deletion(-)

diff --git a/docs/3.x.x/en/advanced/customize-admin.md b/docs/3.x.x/en/advanced/customize-admin.md
index a819fa90d5..9a40b4cb83 100644
--- a/docs/3.x.x/en/advanced/customize-admin.md
+++ b/docs/3.x.x/en/advanced/customize-admin.md
@@ -62,6 +62,8 @@ The panel will be available through [http://localhost:1337/dashboard](http://loc
 
 ### Development mode
 
+Note that to modify the administration panel, your project needs to be created with using the `dev` flag, an example of such would be: `strapi new strapi --dev`.
+
 **#1 — Install its own dependencies**
 
 Run `npm install` from the `./admin` folder.
@@ -99,7 +101,7 @@ Note: make sure the size of your image is the same as the existing one (434px x
 
 ## Build
 
-To build the administration, run the following command from the `./admin` folder:
+To build the administration, run the following command from the root directory of your project, **not** the `./admin folder:
 
 ```
 npm run build

From cf8184e2233c65cde3fdeb373d82015d79330e16 Mon Sep 17 00:00:00 2001
From: Jim LAURIE <j.laurie6993@gmail.com>
Date: Wed, 11 Jul 2018 16:23:14 +0200
Subject: [PATCH 38/65] Use hook prefix and rename

---
 docs/3.x.x/en/advanced/hooks.md               | 10 +++----
 docs/3.x.x/en/advanced/usage-tracking.md      |  2 +-
 .../3.x.x/en/configurations/configurations.md | 10 +++----
 .../templates/bookshelf/service.template      |  2 +-
 .../environments/production/database.json     |  2 +-
 .../config/environments/staging/database.json |  2 +-
 packages/strapi-generate-new/lib/before.js    | 14 +++++-----
 .../.gitignore                                |  0
 .../.npmignore                                |  0
 .../LICENSE.md                                |  0
 .../README.md                                 | 12 ++++-----
 .../lib/index.js                              |  2 +-
 .../lib/relations.js                          |  0
 .../lib/utils/connectivity.js                 |  0
 .../lib/utils/graphql.js                      |  0
 .../lib/utils/index.js                        |  0
 .../package.json                              |  7 +++--
 .../.editorconfig                             |  0
 .../.gitignore                                |  0
 .../.npmignore                                |  0
 .../LICENSE.md                                |  0
 .../{strapi-ejs => strapi-hook-ejs}/README.md |  0
 .../lib/index.js                              |  0
 .../package.json                              |  5 +---
 .../.editorconfig                             |  0
 .../.gitignore                                |  0
 .../.npmignore                                |  0
 .../LICENSE.md                                |  0
 .../README.md                                 | 10 +++----
 .../lib/index.js                              |  2 +-
 .../package.json                              |  5 +---
 .../.editorconfig                             |  0
 .../.gitignore                                |  0
 .../.npmignore                                |  0
 .../LICENSE.md                                |  0
 .../README.md                                 | 10 +++----
 .../lib/index.js                              |  2 +-
 .../lib/relations.js                          |  2 +-
 .../lib/utils/connectivity.js                 |  0
 .../lib/utils/index.js                        |  0
 .../package.json                              |  5 +---
 .../.editorconfig                             |  0
 .../.gitignore                                |  0
 .../.npmignore                                |  0
 .../LICENSE.md                                |  0
 .../README.md                                 |  0
 .../lib/index.js                              |  4 +--
 .../lib/utils/connectivity.js                 |  0
 .../package.json                              |  5 +---
 packages/strapi-middleware-views/package.json |  5 +---
 .../controllers/ContentTypeBuilder.js         |  2 +-
 .../services/ContentTypeBuilder.js            |  2 +-
 .../services/SettingsManager.js               |  8 +++---
 packages/strapi-utils/lib/knex.js             |  4 +--
 packages/strapi/lib/core/configurations.js    |  8 +++---
 packages/strapi/lib/core/hooks.js             | 27 +++----------------
 packages/strapi/lib/hooks/index.js            |  2 +-
 scripts/setup.js                              | 14 +++++-----
 58 files changed, 75 insertions(+), 110 deletions(-)
 rename packages/{strapi-bookshelf => strapi-hook-bookshelf}/.gitignore (100%)
 rename packages/{strapi-bookshelf => strapi-hook-bookshelf}/.npmignore (100%)
 rename packages/{strapi-bookshelf => strapi-hook-bookshelf}/LICENSE.md (100%)
 rename packages/{strapi-bookshelf => strapi-hook-bookshelf}/README.md (62%)
 rename packages/{strapi-bookshelf => strapi-hook-bookshelf}/lib/index.js (99%)
 rename packages/{strapi-bookshelf => strapi-hook-bookshelf}/lib/relations.js (100%)
 rename packages/{strapi-bookshelf => strapi-hook-bookshelf}/lib/utils/connectivity.js (100%)
 rename packages/{strapi-bookshelf => strapi-hook-bookshelf}/lib/utils/graphql.js (100%)
 rename packages/{strapi-bookshelf => strapi-hook-bookshelf}/lib/utils/index.js (100%)
 rename packages/{strapi-bookshelf => strapi-hook-bookshelf}/package.json (90%)
 rename packages/{strapi-ejs => strapi-hook-ejs}/.editorconfig (100%)
 rename packages/{strapi-ejs => strapi-hook-ejs}/.gitignore (100%)
 rename packages/{strapi-ejs => strapi-hook-ejs}/.npmignore (100%)
 rename packages/{strapi-ejs => strapi-hook-ejs}/LICENSE.md (100%)
 rename packages/{strapi-ejs => strapi-hook-ejs}/README.md (100%)
 rename packages/{strapi-ejs => strapi-hook-ejs}/lib/index.js (100%)
 rename packages/{strapi-ejs => strapi-hook-ejs}/package.json (93%)
 rename packages/{strapi-knex => strapi-hook-knex}/.editorconfig (100%)
 rename packages/{strapi-knex => strapi-hook-knex}/.gitignore (100%)
 rename packages/{strapi-knex => strapi-hook-knex}/.npmignore (100%)
 rename packages/{strapi-knex => strapi-hook-knex}/LICENSE.md (100%)
 rename packages/{strapi-knex => strapi-hook-knex}/README.md (65%)
 rename packages/{strapi-knex => strapi-hook-knex}/lib/index.js (98%)
 rename packages/{strapi-knex => strapi-hook-knex}/package.json (93%)
 rename packages/{strapi-mongoose => strapi-hook-mongoose}/.editorconfig (100%)
 rename packages/{strapi-mongoose => strapi-hook-mongoose}/.gitignore (100%)
 rename packages/{strapi-mongoose => strapi-hook-mongoose}/.npmignore (100%)
 rename packages/{strapi-mongoose => strapi-hook-mongoose}/LICENSE.md (100%)
 rename packages/{strapi-mongoose => strapi-hook-mongoose}/README.md (52%)
 rename packages/{strapi-mongoose => strapi-hook-mongoose}/lib/index.js (99%)
 rename packages/{strapi-mongoose => strapi-hook-mongoose}/lib/relations.js (99%)
 rename packages/{strapi-mongoose => strapi-hook-mongoose}/lib/utils/connectivity.js (100%)
 rename packages/{strapi-mongoose => strapi-hook-mongoose}/lib/utils/index.js (100%)
 rename packages/{strapi-mongoose => strapi-hook-mongoose}/package.json (93%)
 rename packages/{strapi-redis => strapi-hook-redis}/.editorconfig (100%)
 rename packages/{strapi-redis => strapi-hook-redis}/.gitignore (100%)
 rename packages/{strapi-redis => strapi-hook-redis}/.npmignore (100%)
 rename packages/{strapi-redis => strapi-hook-redis}/LICENSE.md (100%)
 rename packages/{strapi-redis => strapi-hook-redis}/README.md (100%)
 rename packages/{strapi-redis => strapi-hook-redis}/lib/index.js (98%)
 rename packages/{strapi-redis => strapi-hook-redis}/lib/utils/connectivity.js (100%)
 rename packages/{strapi-redis => strapi-hook-redis}/package.json (93%)

diff --git a/docs/3.x.x/en/advanced/hooks.md b/docs/3.x.x/en/advanced/hooks.md
index 972ade67f0..eb4e5dbfbf 100644
--- a/docs/3.x.x/en/advanced/hooks.md
+++ b/docs/3.x.x/en/advanced/hooks.md
@@ -1,6 +1,6 @@
 # Hooks
 
-The hooks are modules that add functionality to the core. They are loaded during the server boot. For example, if your project needs to work with a SQL database, your will have to add the hook `strapi-bookshelf` to be able to connect your app with your database.
+The hooks are modules that add functionality to the core. They are loaded during the server boot. For example, if your project needs to work with a SQL database, your will have to add the hook `strapi-hook-bookshelf` to be able to connect your app with your database.
 
 **Path —** `./hooks/documentation/lib/index.js`.
 ```js
@@ -76,13 +76,13 @@ The `index.js` is the entry point to your hook. It should look like the example
 
 ## Dependencies
 
-It happens that a hook has a dependency to another one. For example, the `strapi-bookshelf` has a dependency to `strapi-knex`. Without it, the `strapi-bookshelf` can't work correctly. It also means that the `strapi-knex` hook has to be loaded before.
+It happens that a hook has a dependency to another one. For example, the `strapi-hook-bookshelf` has a dependency to `strapi-hook-knex`. Without it, the `strapi-hook-bookshelf` can't work correctly. It also means that the `strapi-hook-knex` hook has to be loaded before.
 
 To handle this case, you need to update the `package.json` at the root of your hook.
 
 ```json
 {
-  "name": "strapi-bookshelf",
+  "name": "strapi-hook-bookshelf",
   "version": "x.x.x",
   "description": "Bookshelf hook for the Strapi framework",
   "dependencies": {
@@ -90,10 +90,10 @@ To handle this case, you need to update the `package.json` at the root of your h
   },
   "strapi": {
     "dependencies": [
-      "strapi-knex"
+      "strapi-hook-knex"
     ]
   }
-}  
+}
 ```
 
 ## Custom hooks
diff --git a/docs/3.x.x/en/advanced/usage-tracking.md b/docs/3.x.x/en/advanced/usage-tracking.md
index b9a84d0e58..b6b445700f 100644
--- a/docs/3.x.x/en/advanced/usage-tracking.md
+++ b/docs/3.x.x/en/advanced/usage-tracking.md
@@ -13,7 +13,7 @@ Here is the list of the collected data and why we need them.
   *Understand how the developers are using the different configurations? How many projects are started in production mode?*
 - **Node modules names**
   *Are developers integrating Strapi with Stripe? It means that we should develop a plugin to simplify the development process with Stripe.
-  Are developers using Strapi with strapi-bookshelf or strapi-mongoose? It helps us prioritize the issues.*
+  Are developers using Strapi with strapi-hook-bookshelf or strapi-hook-mongoose? It helps us prioritize the issues.*
 - **OS**
   *Is the community using Windows, Linux or Mac? It helps us prioritize the issues.*
 - **Build configurations**
diff --git a/docs/3.x.x/en/configurations/configurations.md b/docs/3.x.x/en/configurations/configurations.md
index d038fc99ec..ced94dd32b 100644
--- a/docs/3.x.x/en/configurations/configurations.md
+++ b/docs/3.x.x/en/configurations/configurations.md
@@ -164,7 +164,7 @@ Most of the application's configurations are defined by environment. It means th
  - `defaultConnection` (string): Connection by default for models which are not related to a specific `connection`. Default value: `default`.
  - `connections` List of all available connections.
    - `default`
-     - `connector` (string): Connector used by the current connection. Default value: `strapi-mongoose`.
+     - `connector` (string): Connector used by the current connection. Default value: `strapi-hook-mongoose`.
      - `client` (string): Client used to store session. Default value: `cookie`.
      - `key` (string): Cookie key name. Default value: `strapi.sid`
      - `maxAge` (integer): Time in milliseconds before the session expire. Default value: `86400000`.
@@ -192,7 +192,7 @@ Most of the application's configurations are defined by environment. It means th
   "defaultConnection": "default",
   "connections": {
     "default": {
-      "connector": "strapi-mongoose",
+      "connector": "strapi-hook-mongoose",
       "settings": {
         "client": "mongo",
         "host": "localhost",
@@ -208,7 +208,7 @@ Most of the application's configurations are defined by environment. It means th
       }
     },
     "postgres": {
-      "connector": "strapi-bookshelf",
+      "connector": "strapi-hook-bookshelf",
       "settings": {
         "client": "postgres",
         "host": "localhost",
@@ -223,7 +223,7 @@ Most of the application's configurations are defined by environment. It means th
       }
     },
     "mysql": {
-      "connector": "strapi-bookshelf",
+      "connector": "strapi-hook-bookshelf",
       "settings": {
         "client": "mysql",
         "host": "localhost",
@@ -367,7 +367,7 @@ In any JSON configurations files in your project, you can inject dynamic values
   "defaultConnection": "default",
   "connections": {
     "default": {
-      "connector": "strapi-mongoose",
+      "connector": "strapi-hook-mongoose",
       "settings": {
         "client": "mongo",
         "uri": "${process.env.DATABASE_URI || ''}",
diff --git a/packages/strapi-generate-api/templates/bookshelf/service.template b/packages/strapi-generate-api/templates/bookshelf/service.template
index 0685e6362e..948a990494 100755
--- a/packages/strapi-generate-api/templates/bookshelf/service.template
+++ b/packages/strapi-generate-api/templates/bookshelf/service.template
@@ -10,7 +10,7 @@
 const _ = require('lodash');
 
 // Strapi utilities.
-const utils = require('strapi-bookshelf/lib/utils/');
+const utils = require('strapi-hook-bookshelf/lib/utils/');
 
 module.exports = {
 
diff --git a/packages/strapi-generate-new/files/config/environments/production/database.json b/packages/strapi-generate-new/files/config/environments/production/database.json
index 287a8121e0..3075fabf91 100755
--- a/packages/strapi-generate-new/files/config/environments/production/database.json
+++ b/packages/strapi-generate-new/files/config/environments/production/database.json
@@ -2,7 +2,7 @@
   "defaultConnection": "default",
   "connections": {
     "default": {
-      "connector": "strapi-mongoose",
+      "connector": "strapi-hook-mongoose",
       "settings": {
         "client": "mongo",
         "uri": "${process.env.DATABASE_URI || ''}",
diff --git a/packages/strapi-generate-new/files/config/environments/staging/database.json b/packages/strapi-generate-new/files/config/environments/staging/database.json
index ec7c26da4c..43edf2421d 100755
--- a/packages/strapi-generate-new/files/config/environments/staging/database.json
+++ b/packages/strapi-generate-new/files/config/environments/staging/database.json
@@ -2,7 +2,7 @@
   "defaultConnection": "default",
   "connections": {
     "default": {
-      "connector": "strapi-mongoose",
+      "connector": "strapi-hook-mongoose",
       "settings": {
         "client": "mongo",
         "uri": "${process.env.DATABASE_URI || ''}",
diff --git a/packages/strapi-generate-new/lib/before.js b/packages/strapi-generate-new/lib/before.js
index 9ad9e8c985..f15d6c514d 100755
--- a/packages/strapi-generate-new/lib/before.js
+++ b/packages/strapi-generate-new/lib/before.js
@@ -69,14 +69,14 @@ module.exports = (scope, cb) => {
         name: 'MongoDB (recommended)',
         value: {
           database: 'mongo',
-          connector: 'strapi-mongoose'
+          connector: 'strapi-hook-mongoose'
         }
       },
       {
         name: 'Postgres',
         value: {
           database: 'postgres',
-          connector: 'strapi-bookshelf',
+          connector: 'strapi-hook-bookshelf',
           module: 'pg'
         }
       },
@@ -84,7 +84,7 @@ module.exports = (scope, cb) => {
         name: 'MySQL',
         value: {
           database: 'mysql',
-          connector: 'strapi-bookshelf',
+          connector: 'strapi-hook-bookshelf',
           module: 'mysql'
         }
       }
@@ -223,10 +223,10 @@ module.exports = (scope, cb) => {
               cmd += ` ${scope.client.module}`;
             }
 
-            if (scope.client.connector === 'strapi-bookshelf') {
-              cmd += ` strapi-knex@alpha`;
+            if (scope.client.connector === 'strapi-hook-bookshelf') {
+              cmd += ` strapi-hook-knex@alpha`;
 
-              scope.additionalsDependencies = ['strapi-knex', 'knex'];
+              scope.additionalsDependencies = ['strapi-hook-knex', 'knex'];
             }
 
             exec(cmd, () => {
@@ -234,7 +234,7 @@ module.exports = (scope, cb) => {
                 const lock = require(path.join(`${scope.tmpPath}`,`/node_modules/`,`${scope.client.module}/package.json`));
                 scope.client.version = lock.version;
 
-                if (scope.developerMode === true && scope.client.connector === 'strapi-bookshelf') {
+                if (scope.developerMode === true && scope.client.connector === 'strapi-hook-bookshelf') {
                   const knexVersion = require(path.join(`${scope.tmpPath}`,`/node_modules/`,`knex/package.json`));
                   scope.additionalsDependencies[1] = `knex@${knexVersion.version || 'latest'}`;
                 }
diff --git a/packages/strapi-bookshelf/.gitignore b/packages/strapi-hook-bookshelf/.gitignore
similarity index 100%
rename from packages/strapi-bookshelf/.gitignore
rename to packages/strapi-hook-bookshelf/.gitignore
diff --git a/packages/strapi-bookshelf/.npmignore b/packages/strapi-hook-bookshelf/.npmignore
similarity index 100%
rename from packages/strapi-bookshelf/.npmignore
rename to packages/strapi-hook-bookshelf/.npmignore
diff --git a/packages/strapi-bookshelf/LICENSE.md b/packages/strapi-hook-bookshelf/LICENSE.md
similarity index 100%
rename from packages/strapi-bookshelf/LICENSE.md
rename to packages/strapi-hook-bookshelf/LICENSE.md
diff --git a/packages/strapi-bookshelf/README.md b/packages/strapi-hook-bookshelf/README.md
similarity index 62%
rename from packages/strapi-bookshelf/README.md
rename to packages/strapi-hook-bookshelf/README.md
index 5d1ce7ecb7..6e67c8c6f4 100755
--- a/packages/strapi-bookshelf/README.md
+++ b/packages/strapi-hook-bookshelf/README.md
@@ -1,12 +1,12 @@
-# strapi-bookshelf
+# strapi-boohook-kshelf
 
-[![npm version](https://img.shields.io/npm/v/strapi-bookshelf.svg)](https://www.npmjs.org/package/strapi-bookshelf)
-[![npm downloads](https://img.shields.io/npm/dm/strapi-bookshelf.svg)](https://www.npmjs.org/package/strapi-bookshelf)
-[![npm dependencies](https://david-dm.org/strapi/strapi-bookshelf.svg)](https://david-dm.org/strapi/strapi-bookshelf)
-[![Build status](https://travis-ci.org/strapi/strapi-bookshelf.svg?branch=master)](https://travis-ci.org/strapi/strapi-bookshelf)
+[![npm version](https://img.shields.io/npm/v/strapi-hook-bookshelf.svg)](https://www.npmjs.org/package/strapi-hook-bookshelf)
+[![npm downloads](https://img.shields.io/npm/dm/strapi-hook-bookshelf.svg)](https://www.npmjs.org/package/strapi-hook-bookshelf)
+[![npm dependencies](https://david-dm.org/strapi/strapi-hook-bookshelf.svg)](https://david-dm.org/strapi/strapi-hook-bookshelf)
+[![Build status](https://travis-ci.org/strapi/strapi-hook-bookshelf.svg?branch=master)](https://travis-ci.org/strapi/strapi-hook-bookshelf)
 [![Slack status](http://strapi-slack.herokuapp.com/badge.svg)](http://slack.strapi.io)
 
-This built-in hook allows you to use the [Bookshelf ORM](http://bookshelfjs.org/) using the `strapi-knex` hook.
+This built-in hook allows you to use the [Bookshelf ORM](http://bookshelfjs.org/) using the `strapi-hook-knex` hook.
 
 [Bookshelf ORM](http://bookshelfjs.org/) is a JavaScript ORM for Node.js, built on the [Knex node module](http://knexjs.org/) SQL query builder. Featuring both promise based and traditional callback interfaces, providing transaction support, eager/nested-eager relation loading, polymorphic associations, and support for one-to-one, one-to-many, and many-to-many relations.
 
diff --git a/packages/strapi-bookshelf/lib/index.js b/packages/strapi-hook-bookshelf/lib/index.js
similarity index 99%
rename from packages/strapi-bookshelf/lib/index.js
rename to packages/strapi-hook-bookshelf/lib/index.js
index d73418eba4..39214f7cc8 100755
--- a/packages/strapi-bookshelf/lib/index.js
+++ b/packages/strapi-hook-bookshelf/lib/index.js
@@ -45,7 +45,7 @@ module.exports = function(strapi) {
      */
 
     initialize: async cb => {
-      const connections = _.pickBy(strapi.config.connections, { connector: 'strapi-bookshelf' });
+      const connections = _.pickBy(strapi.config.connections, { connector: 'strapi-hook-bookshelf' });
 
       const databaseUpdate = [];
 
diff --git a/packages/strapi-bookshelf/lib/relations.js b/packages/strapi-hook-bookshelf/lib/relations.js
similarity index 100%
rename from packages/strapi-bookshelf/lib/relations.js
rename to packages/strapi-hook-bookshelf/lib/relations.js
diff --git a/packages/strapi-bookshelf/lib/utils/connectivity.js b/packages/strapi-hook-bookshelf/lib/utils/connectivity.js
similarity index 100%
rename from packages/strapi-bookshelf/lib/utils/connectivity.js
rename to packages/strapi-hook-bookshelf/lib/utils/connectivity.js
diff --git a/packages/strapi-bookshelf/lib/utils/graphql.js b/packages/strapi-hook-bookshelf/lib/utils/graphql.js
similarity index 100%
rename from packages/strapi-bookshelf/lib/utils/graphql.js
rename to packages/strapi-hook-bookshelf/lib/utils/graphql.js
diff --git a/packages/strapi-bookshelf/lib/utils/index.js b/packages/strapi-hook-bookshelf/lib/utils/index.js
similarity index 100%
rename from packages/strapi-bookshelf/lib/utils/index.js
rename to packages/strapi-hook-bookshelf/lib/utils/index.js
diff --git a/packages/strapi-bookshelf/package.json b/packages/strapi-hook-bookshelf/package.json
similarity index 90%
rename from packages/strapi-bookshelf/package.json
rename to packages/strapi-hook-bookshelf/package.json
index 7b3117939d..ea37786086 100755
--- a/packages/strapi-bookshelf/package.json
+++ b/packages/strapi-hook-bookshelf/package.json
@@ -1,5 +1,5 @@
 {
-  "name": "strapi-bookshelf",
+  "name": "strapi-hook-bookshelf",
   "version": "3.0.0-alpha.12.7.1",
   "description": "Bookshelf hook for the Strapi framework",
   "homepage": "http://strapi.io",
@@ -20,13 +20,12 @@
     "inquirer": "^5.2.0",
     "lodash": "^4.17.4",
     "pluralize": "^6.0.0",
-    "strapi-knex": "3.0.0-alpha.12.7.1",
+    "strapi-hook-knex": "3.0.0-alpha.12.7.1",
     "strapi-utils": "3.0.0-alpha.12.7.1"
   },
   "strapi": {
-    "isHook": true,
     "dependencies": [
-      "strapi-knex"
+      "strapi-hook-knex"
     ]
   },
   "scripts": {
diff --git a/packages/strapi-ejs/.editorconfig b/packages/strapi-hook-ejs/.editorconfig
similarity index 100%
rename from packages/strapi-ejs/.editorconfig
rename to packages/strapi-hook-ejs/.editorconfig
diff --git a/packages/strapi-ejs/.gitignore b/packages/strapi-hook-ejs/.gitignore
similarity index 100%
rename from packages/strapi-ejs/.gitignore
rename to packages/strapi-hook-ejs/.gitignore
diff --git a/packages/strapi-ejs/.npmignore b/packages/strapi-hook-ejs/.npmignore
similarity index 100%
rename from packages/strapi-ejs/.npmignore
rename to packages/strapi-hook-ejs/.npmignore
diff --git a/packages/strapi-ejs/LICENSE.md b/packages/strapi-hook-ejs/LICENSE.md
similarity index 100%
rename from packages/strapi-ejs/LICENSE.md
rename to packages/strapi-hook-ejs/LICENSE.md
diff --git a/packages/strapi-ejs/README.md b/packages/strapi-hook-ejs/README.md
similarity index 100%
rename from packages/strapi-ejs/README.md
rename to packages/strapi-hook-ejs/README.md
diff --git a/packages/strapi-ejs/lib/index.js b/packages/strapi-hook-ejs/lib/index.js
similarity index 100%
rename from packages/strapi-ejs/lib/index.js
rename to packages/strapi-hook-ejs/lib/index.js
diff --git a/packages/strapi-ejs/package.json b/packages/strapi-hook-ejs/package.json
similarity index 93%
rename from packages/strapi-ejs/package.json
rename to packages/strapi-hook-ejs/package.json
index 110ec9b2c3..8d2e9af34f 100755
--- a/packages/strapi-ejs/package.json
+++ b/packages/strapi-hook-ejs/package.json
@@ -1,5 +1,5 @@
 {
-  "name": "strapi-ejs",
+  "name": "strapi-hook-ejs",
   "version": "3.0.0-alpha.12.7.1",
   "description": "EJS hook for the Strapi framework",
   "homepage": "http://strapi.io",
@@ -16,9 +16,6 @@
     "co": "^4.6.0",
     "koa-ejs": "^4.1.0"
   },
-  "strapi": {
-    "isHook": true
-  },
   "scripts": {
     "prepublishOnly": "npm prune"
   },
diff --git a/packages/strapi-knex/.editorconfig b/packages/strapi-hook-knex/.editorconfig
similarity index 100%
rename from packages/strapi-knex/.editorconfig
rename to packages/strapi-hook-knex/.editorconfig
diff --git a/packages/strapi-knex/.gitignore b/packages/strapi-hook-knex/.gitignore
similarity index 100%
rename from packages/strapi-knex/.gitignore
rename to packages/strapi-hook-knex/.gitignore
diff --git a/packages/strapi-knex/.npmignore b/packages/strapi-hook-knex/.npmignore
similarity index 100%
rename from packages/strapi-knex/.npmignore
rename to packages/strapi-hook-knex/.npmignore
diff --git a/packages/strapi-knex/LICENSE.md b/packages/strapi-hook-knex/LICENSE.md
similarity index 100%
rename from packages/strapi-knex/LICENSE.md
rename to packages/strapi-hook-knex/LICENSE.md
diff --git a/packages/strapi-knex/README.md b/packages/strapi-hook-knex/README.md
similarity index 65%
rename from packages/strapi-knex/README.md
rename to packages/strapi-hook-knex/README.md
index 694ced22bb..eb8fbb5470 100755
--- a/packages/strapi-knex/README.md
+++ b/packages/strapi-hook-knex/README.md
@@ -1,9 +1,9 @@
-# strapi-knex
+# strapi-hook-knex
 
-[![npm version](https://img.shields.io/npm/v/strapi-knex.svg)](https://www.npmjs.org/package/strapi-knex)
-[![npm downloads](https://img.shields.io/npm/dm/strapi-knex.svg)](https://www.npmjs.org/package/strapi-knex)
-[![npm dependencies](https://david-dm.org/strapi/strapi-knex.svg)](https://david-dm.org/strapi/strapi-knex)
-[![Build status](https://travis-ci.org/strapi/strapi-knex.svg?branch=master)](https://travis-ci.org/strapi/strapi-knex)
+[![npm version](https://img.shields.io/npm/v/strapi-hook-knex.svg)](https://www.npmjs.org/package/strapi-hook-knex)
+[![npm downloads](https://img.shields.io/npm/dm/strapi-hook-knex.svg)](https://www.npmjs.org/package/strapi-hook-knex)
+[![npm dependencies](https://david-dm.org/strapi/strapi-hook-knex.svg)](https://david-dm.org/strapi/strapi-hook-knex)
+[![Build status](https://travis-ci.org/strapi/strapi-hook-knex.svg?branch=master)](https://travis-ci.org/strapi/strapi-hook-knex)
 [![Slack status](http://strapi-slack.herokuapp.com/badge.svg)](http://slack.strapi.io)
 
 This built-in hook allows you to directly make SQL queries from your Strapi connections to your databases thanks to the [Knex node module](http://knexjs.org/).
diff --git a/packages/strapi-knex/lib/index.js b/packages/strapi-hook-knex/lib/index.js
similarity index 98%
rename from packages/strapi-knex/lib/index.js
rename to packages/strapi-hook-knex/lib/index.js
index f853163ecf..ceacd92131 100755
--- a/packages/strapi-knex/lib/index.js
+++ b/packages/strapi-hook-knex/lib/index.js
@@ -46,7 +46,7 @@ module.exports = strapi => {
 
     initialize: cb => {
       // For each connection in the config register a new Knex connection.
-      _.forEach(_.pickBy(strapi.config.connections, {connector: 'strapi-bookshelf'}), (connection, name) => {
+      _.forEach(_.pickBy(strapi.config.connections, {connector: 'strapi-hook-bookshelf'}), (connection, name) => {
 
         // Make sure we use the client even if the typo is not the exact one.
         switch (connection.settings.client) {
diff --git a/packages/strapi-knex/package.json b/packages/strapi-hook-knex/package.json
similarity index 93%
rename from packages/strapi-knex/package.json
rename to packages/strapi-hook-knex/package.json
index 4fa1428fa6..b6dc3c3df5 100755
--- a/packages/strapi-knex/package.json
+++ b/packages/strapi-hook-knex/package.json
@@ -1,5 +1,5 @@
 {
-  "name": "strapi-knex",
+  "name": "strapi-hook-knex",
   "version": "3.0.0-alpha.12.7.1",
   "description": "Knex hook for the Strapi framework",
   "homepage": "http://strapi.io",
@@ -19,9 +19,6 @@
     "knex": "^0.13.0",
     "lodash": "^4.17.4"
   },
-  "strapi": {
-    "isHook": true
-  },
   "author": {
     "email": "hi@strapi.io",
     "name": "Strapi team",
diff --git a/packages/strapi-mongoose/.editorconfig b/packages/strapi-hook-mongoose/.editorconfig
similarity index 100%
rename from packages/strapi-mongoose/.editorconfig
rename to packages/strapi-hook-mongoose/.editorconfig
diff --git a/packages/strapi-mongoose/.gitignore b/packages/strapi-hook-mongoose/.gitignore
similarity index 100%
rename from packages/strapi-mongoose/.gitignore
rename to packages/strapi-hook-mongoose/.gitignore
diff --git a/packages/strapi-mongoose/.npmignore b/packages/strapi-hook-mongoose/.npmignore
similarity index 100%
rename from packages/strapi-mongoose/.npmignore
rename to packages/strapi-hook-mongoose/.npmignore
diff --git a/packages/strapi-mongoose/LICENSE.md b/packages/strapi-hook-mongoose/LICENSE.md
similarity index 100%
rename from packages/strapi-mongoose/LICENSE.md
rename to packages/strapi-hook-mongoose/LICENSE.md
diff --git a/packages/strapi-mongoose/README.md b/packages/strapi-hook-mongoose/README.md
similarity index 52%
rename from packages/strapi-mongoose/README.md
rename to packages/strapi-hook-mongoose/README.md
index 49c59d8f23..5f45c405c7 100755
--- a/packages/strapi-mongoose/README.md
+++ b/packages/strapi-hook-mongoose/README.md
@@ -1,9 +1,9 @@
-# strapi-mongoose
+# strapi-hook-mongoose
 
-[![npm version](https://img.shields.io/npm/v/strapi-mongoose.svg)](https://www.npmjs.org/package/strapi-mongoose)
-[![npm downloads](https://img.shields.io/npm/dm/strapi-mongoose.svg)](https://www.npmjs.org/package/strapi-mongoose)
-[![npm dependencies](https://david-dm.org/strapi/strapi-mongoose.svg)](https://david-dm.org/strapi/strapi-mongoose)
-[![Build status](https://travis-ci.org/strapi/strapi-mongoose.svg?branch=master)](https://travis-ci.org/strapi/strapi-bookshelf)
+[![npm version](https://img.shields.io/npm/v/strapi-hook-mongoose.svg)](https://www.npmjs.org/package/strapi-hook-mongoose)
+[![npm downloads](https://img.shields.io/npm/dm/strapi-hook-mongoose.svg)](https://www.npmjs.org/package/strapi-hook-mongoose)
+[![npm dependencies](https://david-dm.org/strapi/strapi-hook-mongoose.svg)](https://david-dm.org/strapi/strapi-hook-mongoose)
+[![Build status](https://travis-ci.org/strapi/strapi-hook-mongoose.svg?branch=master)](https://travis-ci.org/strapi/strapi-hook-mongoose)
 [![Slack status](http://strapi-slack.herokuapp.com/badge.svg)](http://slack.strapi.io)
 
 This built-in hook allows you to use the [Mongoose ORM](http://mongoosejs.com/).
diff --git a/packages/strapi-mongoose/lib/index.js b/packages/strapi-hook-mongoose/lib/index.js
similarity index 99%
rename from packages/strapi-mongoose/lib/index.js
rename to packages/strapi-hook-mongoose/lib/index.js
index 3b688a5608..a0c3e5e9d4 100755
--- a/packages/strapi-mongoose/lib/index.js
+++ b/packages/strapi-hook-mongoose/lib/index.js
@@ -49,7 +49,7 @@ module.exports = function (strapi) {
      */
 
     initialize: cb => {
-      _.forEach(_.pickBy(strapi.config.connections, {connector: 'strapi-mongoose'}), (connection, connectionName) => {
+      _.forEach(_.pickBy(strapi.config.connections, {connector: 'strapi-hook-mongoose'}), (connection, connectionName) => {
         const instance = new Mongoose();
         const { uri, host, port, username, password, database } = _.defaults(connection.settings, strapi.config.hook.settings.mongoose);
         const uriOptions = uri ? url.parse(uri, true).query : {};
diff --git a/packages/strapi-mongoose/lib/relations.js b/packages/strapi-hook-mongoose/lib/relations.js
similarity index 99%
rename from packages/strapi-mongoose/lib/relations.js
rename to packages/strapi-hook-mongoose/lib/relations.js
index 1b1de2c7b5..1fbe976cac 100644
--- a/packages/strapi-mongoose/lib/relations.js
+++ b/packages/strapi-hook-mongoose/lib/relations.js
@@ -174,7 +174,7 @@ module.exports = {
                 strapi.models[_.toLower(obj.ref)].globalId;
 
               // Define the object stored in database.
-              // The shape is this object is defined by the strapi-mongoose connector.
+              // The shape is this object is defined by the strapi-hook-mongoose connector.
               return {
                 ref: obj.refId,
                 kind: globalId,
diff --git a/packages/strapi-mongoose/lib/utils/connectivity.js b/packages/strapi-hook-mongoose/lib/utils/connectivity.js
similarity index 100%
rename from packages/strapi-mongoose/lib/utils/connectivity.js
rename to packages/strapi-hook-mongoose/lib/utils/connectivity.js
diff --git a/packages/strapi-mongoose/lib/utils/index.js b/packages/strapi-hook-mongoose/lib/utils/index.js
similarity index 100%
rename from packages/strapi-mongoose/lib/utils/index.js
rename to packages/strapi-hook-mongoose/lib/utils/index.js
diff --git a/packages/strapi-mongoose/package.json b/packages/strapi-hook-mongoose/package.json
similarity index 93%
rename from packages/strapi-mongoose/package.json
rename to packages/strapi-hook-mongoose/package.json
index 0becf7761b..9386fbfa8d 100755
--- a/packages/strapi-mongoose/package.json
+++ b/packages/strapi-hook-mongoose/package.json
@@ -1,5 +1,5 @@
 {
-  "name": "strapi-mongoose",
+  "name": "strapi-hook-mongoose",
   "version": "3.0.0-alpha.12.7.1",
   "description": "Mongoose hook for the Strapi framework",
   "homepage": "http://strapi.io",
@@ -21,9 +21,6 @@
     "pluralize": "^6.0.0",
     "strapi-utils": "3.0.0-alpha.12.7.1"
   },
-  "strapi": {
-    "isHook": true
-  },
   "author": {
     "email": "hi@strapi.io",
     "name": "Strapi team",
diff --git a/packages/strapi-redis/.editorconfig b/packages/strapi-hook-redis/.editorconfig
similarity index 100%
rename from packages/strapi-redis/.editorconfig
rename to packages/strapi-hook-redis/.editorconfig
diff --git a/packages/strapi-redis/.gitignore b/packages/strapi-hook-redis/.gitignore
similarity index 100%
rename from packages/strapi-redis/.gitignore
rename to packages/strapi-hook-redis/.gitignore
diff --git a/packages/strapi-redis/.npmignore b/packages/strapi-hook-redis/.npmignore
similarity index 100%
rename from packages/strapi-redis/.npmignore
rename to packages/strapi-hook-redis/.npmignore
diff --git a/packages/strapi-redis/LICENSE.md b/packages/strapi-hook-redis/LICENSE.md
similarity index 100%
rename from packages/strapi-redis/LICENSE.md
rename to packages/strapi-hook-redis/LICENSE.md
diff --git a/packages/strapi-redis/README.md b/packages/strapi-hook-redis/README.md
similarity index 100%
rename from packages/strapi-redis/README.md
rename to packages/strapi-hook-redis/README.md
diff --git a/packages/strapi-redis/lib/index.js b/packages/strapi-hook-redis/lib/index.js
similarity index 98%
rename from packages/strapi-redis/lib/index.js
rename to packages/strapi-hook-redis/lib/index.js
index 6b26ad51e8..c224615397 100755
--- a/packages/strapi-redis/lib/index.js
+++ b/packages/strapi-hook-redis/lib/index.js
@@ -38,13 +38,13 @@ module.exports = function(strapi) {
 
     initialize: cb => {
       if (_.isEmpty(strapi.models) || !_.pickBy(strapi.config.connections, {
-        connector: 'strapi-redis'
+        connector: 'strapi-hook-redis'
       })) {
         return cb();
       }
 
       const connections = _.pickBy(strapi.config.connections, {
-        connector: 'strapi-redis'
+        connector: 'strapi-hook-redis'
       });
 
       if(_.size(connections) === 0) {
diff --git a/packages/strapi-redis/lib/utils/connectivity.js b/packages/strapi-hook-redis/lib/utils/connectivity.js
similarity index 100%
rename from packages/strapi-redis/lib/utils/connectivity.js
rename to packages/strapi-hook-redis/lib/utils/connectivity.js
diff --git a/packages/strapi-redis/package.json b/packages/strapi-hook-redis/package.json
similarity index 93%
rename from packages/strapi-redis/package.json
rename to packages/strapi-hook-redis/package.json
index d4058c94e3..bd0487a8ff 100755
--- a/packages/strapi-redis/package.json
+++ b/packages/strapi-hook-redis/package.json
@@ -1,5 +1,5 @@
 {
-  "name": "strapi-redis",
+  "name": "strapi-hook-redis",
   "version": "3.0.0-alpha.12.7.1",
   "description": "Redis hook for the Strapi framework",
   "homepage": "http://strapi.io",
@@ -20,9 +20,6 @@
     "stack-trace": "0.0.10",
     "strapi-utils": "3.0.0-alpha.12.7.1"
   },
-  "strapi": {
-    "isHook": true
-  },
   "author": {
     "email": "hi@strapi.io",
     "name": "Strapi team",
diff --git a/packages/strapi-middleware-views/package.json b/packages/strapi-middleware-views/package.json
index d11be2e120..77852a7944 100755
--- a/packages/strapi-middleware-views/package.json
+++ b/packages/strapi-middleware-views/package.json
@@ -1,7 +1,7 @@
 {
   "name": "strapi-middleware-views",
   "version": "3.0.0-alpha.12.7.1",
-  "description": "Views hook to enable server-side rendering for the Strapi framework",
+  "description": "Views middleware to enable server-side rendering for the Strapi framework",
   "homepage": "http://strapi.io",
   "keywords": [
     "redis",
@@ -19,9 +19,6 @@
     "koa-views": "^6.1.1",
     "lodash": "^4.17.4"
   },
-  "strapi": {
-    "isHook": true
-  },
   "author": {
     "email": "hi@strapi.io",
     "name": "Strapi team",
diff --git a/packages/strapi-plugin-content-type-builder/controllers/ContentTypeBuilder.js b/packages/strapi-plugin-content-type-builder/controllers/ContentTypeBuilder.js
index ba08e31551..0e8e7ac4da 100755
--- a/packages/strapi-plugin-content-type-builder/controllers/ContentTypeBuilder.js
+++ b/packages/strapi-plugin-content-type-builder/controllers/ContentTypeBuilder.js
@@ -207,7 +207,7 @@ module.exports = {
       return ctx.badRequest(null, [{ messages: [{ id: 'Connection doesn\'t exist' }] }]);
     }
 
-    if (connector === 'strapi-bookshelf') {
+    if (connector === 'strapi-hook-bookshelf') {
       try {
         const tableExists = await strapi.connections[connection].schema.hasTable(model);
 
diff --git a/packages/strapi-plugin-content-type-builder/services/ContentTypeBuilder.js b/packages/strapi-plugin-content-type-builder/services/ContentTypeBuilder.js
index eebcc5d686..0726bf0229 100755
--- a/packages/strapi-plugin-content-type-builder/services/ContentTypeBuilder.js
+++ b/packages/strapi-plugin-content-type-builder/services/ContentTypeBuilder.js
@@ -117,7 +117,7 @@ module.exports = {
   },
 
   generateAPI: (name, description, connection, collectionName, attributes) => {
-    const template = _.get(strapi.config.currentEnvironment, `database.connections.${connection}.connector`, 'strapi-mongoose').split('-')[1];
+    const template = _.get(strapi.config.currentEnvironment, `database.connections.${connection}.connector`, 'strapi-hook-mongoose').split('-')[1];
 
     return new Promise((resolve, reject) => {
       const scope = {
diff --git a/packages/strapi-plugin-settings-manager/services/SettingsManager.js b/packages/strapi-plugin-settings-manager/services/SettingsManager.js
index 530b272d3b..7e104de4e9 100755
--- a/packages/strapi-plugin-settings-manager/services/SettingsManager.js
+++ b/packages/strapi-plugin-settings-manager/services/SettingsManager.js
@@ -650,9 +650,9 @@ module.exports = {
     const redisClients = ['redis'];
 
     let connector;
-    if (_.indexOf(bookshelfClients, client) !== -1) connector = 'strapi-bookshelf';
-    if (_.indexOf(mongooseClients, client) !== -1) connector = 'strapi-mongoose';
-    if (_.indexOf(redisClients, client) !== -1) connector = 'strapi-redis';
+    if (_.indexOf(bookshelfClients, client) !== -1) connector = 'strapi-hook-bookshelf';
+    if (_.indexOf(mongooseClients, client) !== -1) connector = 'strapi-hook-mongoose';
+    if (_.indexOf(redisClients, client) !== -1) connector = 'strapi-hook-redis';
 
     return connector;
   },
@@ -911,7 +911,7 @@ module.exports = {
   },
 
   cleanDependency: (env, config) => {
-    const availableConnectors = ['strapi-mongoose', 'strapi-bookshelf', 'strapi-redis'];
+    const availableConnectors = ['strapi-hook-mongoose', 'strapi-hook-bookshelf', 'strapi-hook-redis'];
     let usedConnectors = [];
     const errors = [];
 
diff --git a/packages/strapi-utils/lib/knex.js b/packages/strapi-utils/lib/knex.js
index 03b4c8affa..66d4621aa2 100755
--- a/packages/strapi-utils/lib/knex.js
+++ b/packages/strapi-utils/lib/knex.js
@@ -21,10 +21,10 @@ module.exports = scope => {
   // First, make sure the application we have access to
   // the migration generator.
   try {
-    require.resolve(path.resolve(scope.rootPath, 'node_modules', 'strapi-knex'));
+    require.resolve(path.resolve(scope.rootPath, 'node_modules', 'strapi-hook-knex'));
   } catch (err) {
     console.error('Impossible to call the Knex migration tool.');
-    console.error('You can install it with `$ npm install strapi-knex --save`.');
+    console.error('You can install it with `$ npm install strapi-hook-knex --save`.');
     process.exit(1);
   }
 
diff --git a/packages/strapi/lib/core/configurations.js b/packages/strapi/lib/core/configurations.js
index ae39c6b89c..ceabc5fae6 100755
--- a/packages/strapi/lib/core/configurations.js
+++ b/packages/strapi/lib/core/configurations.js
@@ -281,7 +281,7 @@ module.exports.app = async function() {
   // Enable hooks and dependencies related to the connections.
   for (let name in this.config.connections) {
     const connection = this.config.connections[name];
-    const connector = connection.connector.replace('strapi-', '');
+    const connector = connection.connector.replace('strapi-hook-', '');
 
     enableHookNestedDependencies.call(this, connector, flattenHooksConfig);
   }
@@ -333,7 +333,7 @@ module.exports.app = async function() {
 
 const enableHookNestedDependencies = function (name, flattenHooksConfig, force = false) {
   if (!this.hook[name]) {
-    this.log.warn(`(hook:${name}) \`strapi-${name}\` is missing in your dependencies. Please run \`npm install strapi-${name}\``);
+    this.log.warn(`(hook:${name}) \`strapi-hook-${name}\` is missing in your dependencies. Please run \`npm install strapi-hook-${name}\``);
   }
 
   // Couldn't find configurations for this hook.
@@ -347,7 +347,7 @@ const enableHookNestedDependencies = function (name, flattenHooksConfig, force =
           const connector = get(this.config.connections, models[model].connection, {}).connector;
 
           if (connector) {
-            return connector.replace('strapi-', '') === name;
+            return connector.replace('strapi-hook-', '') === name;
           }
 
           return false;
@@ -363,7 +363,7 @@ const enableHookNestedDependencies = function (name, flattenHooksConfig, force =
     // Enabled dependencies.
     if (get(this.hook, `${name}.dependencies`, []).length > 0) {
       this.hook[name].dependencies.forEach(dependency => {
-        enableHookNestedDependencies.call(this, dependency.replace('strapi-', ''), flattenHooksConfig, true);
+        enableHookNestedDependencies.call(this, dependency.replace('strapi-hook-', ''), flattenHooksConfig, true);
       });
     }
   }
diff --git a/packages/strapi/lib/core/hooks.js b/packages/strapi/lib/core/hooks.js
index e03c210761..834da78848 100755
--- a/packages/strapi/lib/core/hooks.js
+++ b/packages/strapi/lib/core/hooks.js
@@ -15,18 +15,7 @@ module.exports = function() {
       const cwd = '';
 
       // Load configurations.
-      glob('./node_modules/strapi-*', {
-        ignore: [
-          './node_modules/strapi-admin',
-          './node_modules/strapi-utils',
-          './node_modules/strapi-generate*',
-          './node_modules/strapi-plugin-*',
-          './node_modules/strapi-helper-*',
-          './node_modules/strapi-middleware-*',
-          './node_modules/strapi-upload-*',
-          './node_modules/strapi-email-*',
-          './node_modules/strapi-lint'
-        ],
+      glob('./node_modules/strapi-hook-*', {
         cwd: this.config.appPath
       }, (err, files) => {
         if (err) {
@@ -71,17 +60,9 @@ const mountHooks = function (files, cwd, isPlugin) {
   return (resolve, reject) =>
     parallel(
       files.map(p => cb => {
-        const extractStr = p
-          .split('/')
-          .pop()
-          .replace(/^strapi(-|\.)/, '')
-          .split('-');
-
-        const name = lowerFirst(
-          extractStr.length === 1
-            ? extractStr[0]
-            : extractStr.map(p => upperFirst(p)).join('')
-        );
+        const folders = p.replace(/^.\/node_modules\/strapi-hook-/, './')
+          .split('/');
+        const name = isPlugin ? folders[folders.length - 2] : folders[1];
 
         fs.readFile(path.resolve(this.config.appPath, cwd, p, 'package.json'), (err, content) => {
           try {
diff --git a/packages/strapi/lib/hooks/index.js b/packages/strapi/lib/hooks/index.js
index ae3d3e1a81..c7e2cb11cf 100755
--- a/packages/strapi/lib/hooks/index.js
+++ b/packages/strapi/lib/hooks/index.js
@@ -83,7 +83,7 @@ module.exports = async function() {
           }
 
           // Initialize array.
-          let previousDependencies = this.hook[hook].dependencies.map(x => x.replace('strapi-', '')) || [];
+          let previousDependencies = this.hook[hook].dependencies.map(x => x.replace('strapi-hook', '')) || [];
 
           // Add BEFORE middlewares to load and remove the current one
           // to avoid that it waits itself.
diff --git a/scripts/setup.js b/scripts/setup.js
index 908a20391d..3d58c6d9c4 100755
--- a/scripts/setup.js
+++ b/scripts/setup.js
@@ -99,17 +99,17 @@ shell.cd('../strapi-generate-new');
 watcher('', 'npm install ../strapi-utils');
 watcher('📦  Linking strapi-generate-new', 'npm link');
 
-shell.cd('../strapi-mongoose');
+shell.cd('../strapi-hook-mongoose');
 watcher('', 'npm install ../strapi-utils');
-watcher('📦  Linking strapi-mongoose...', 'npm link');
+watcher('📦  Linking strapi-hook-mongoose...', 'npm link');
 
-shell.cd('../strapi-knex');
-watcher('📦  Linking strapi-knex...', 'npm link');
+shell.cd('../strapi-hook-knex');
+watcher('📦  Linking strapi-hook-knex...', 'npm link');
 
-shell.cd('../strapi-bookshelf');
+shell.cd('../strapi-hook-bookshelf');
 watcher('', 'npm install ../strapi-utils');
-watcher('', 'npm install ../strapi-knex');
-watcher('📦  Linking strapi-bookshelf...', 'npm link');
+watcher('', 'npm install ../strapi-hook-knex');
+watcher('📦  Linking strapi-hook-bookshelf...', 'npm link');
 
 shell.cd('../strapi');
 watcher('', 'npm install ../strapi-generate ../strapi-generate-admin ../strapi-generate-api ../strapi-generate-new ../strapi-generate-plugin ../strapi-generate-policy ../strapi-generate-service ../strapi-utils');

From 1ba62cc591ad11ef2d39c31a7d3dc0aa24c3dea7 Mon Sep 17 00:00:00 2001
From: Vasilis Kortsimelidis <vaskort@gmail.com>
Date: Wed, 11 Jul 2018 16:42:12 +0100
Subject: [PATCH 39/65] Add two options at CLI - SSL and db auth

---
 packages/strapi/bin/strapi-new.js | 7 +++++--
 packages/strapi/bin/strapi.js     | 2 ++
 2 files changed, 7 insertions(+), 2 deletions(-)

diff --git a/packages/strapi/bin/strapi-new.js b/packages/strapi/bin/strapi-new.js
index c939bccb83..b5dcf25d79 100755
--- a/packages/strapi/bin/strapi-new.js
+++ b/packages/strapi/bin/strapi-new.js
@@ -45,7 +45,7 @@ module.exports = function (name, cliArguments) {
     developerMode
   };
 
-  const dbArguments = ['dbclient', 'dbhost', 'dbport', 'dbname', 'dbusername', 'dbpassword'];
+  const dbArguments = ['dbclient', 'dbhost', 'dbport', 'dbname', 'dbusername', 'dbpassword', 'dbssl', 'dbauth'];
   const matchingDbArguments = _.intersection(_.keys(cliArguments), dbArguments);
 
   if (matchingDbArguments.length) {
@@ -63,7 +63,10 @@ module.exports = function (name, cliArguments) {
         username: cliArguments.dbusername,
         password: cliArguments.dbpassword
       },
-      options: {}
+      options: {
+        authenticationDatabase: cliArguments.dbauth,
+        ssl: cliArguments.dbssl
+      }
     };
   }
 
diff --git a/packages/strapi/bin/strapi.js b/packages/strapi/bin/strapi.js
index 7d497e2517..453a7705eb 100755
--- a/packages/strapi/bin/strapi.js
+++ b/packages/strapi/bin/strapi.js
@@ -59,6 +59,8 @@ program
   .option('--dbname <dbname>', 'Database name')
   .option('--dbusername <dbusername>', 'Database username')
   .option('--dbpassword <dbpassword>', 'Database password')
+  .option('--dbssl <dbssl>', 'Database SSL')
+  .option('--dbauth <dbauth>', 'Authentication Database')
   .description('create a new application')
   .action(require('./strapi-new'));
 

From beeaa55bd511eb8b319bf1134ec2bc151ab75bce Mon Sep 17 00:00:00 2001
From: Alberto Maturano <alberto@maturano.mx>
Date: Wed, 11 Jul 2018 22:44:04 -0500
Subject: [PATCH 40/65] Fix temp directory reference for Yarn

Also: fix logic detecting installation with Yarn and fix minor linter
errors.

related #1548 & #1463
---
 packages/strapi-generate-new/lib/before.js  | 10 +++++-----
 packages/strapi-utils/lib/packageManager.js |  4 ++--
 2 files changed, 7 insertions(+), 7 deletions(-)

diff --git a/packages/strapi-generate-new/lib/before.js b/packages/strapi-generate-new/lib/before.js
index 9ad9e8c985..b22f2edca6 100755
--- a/packages/strapi-generate-new/lib/before.js
+++ b/packages/strapi-generate-new/lib/before.js
@@ -214,7 +214,7 @@ module.exports = (scope, cb) => {
             let packageCmd = packageManager.commands('install --prefix', scope.tmpPath);
             // Manually create the temp directory for yarn
             if (!isStrapiInstalledWithNPM) {
-              shell.exec('mkdir tmp');
+              shell.exec(`mkdir ${scope.tmpPath}`);
             }
 
             let cmd = `${packageCmd} ${scope.client.connector}@alpha`;
@@ -224,18 +224,18 @@ module.exports = (scope, cb) => {
             }
 
             if (scope.client.connector === 'strapi-bookshelf') {
-              cmd += ` strapi-knex@alpha`;
+              cmd += ' strapi-knex@alpha';
 
               scope.additionalsDependencies = ['strapi-knex', 'knex'];
             }
 
             exec(cmd, () => {
               if (scope.client.module) {
-                const lock = require(path.join(`${scope.tmpPath}`,`/node_modules/`,`${scope.client.module}/package.json`));
+                const lock = require(path.join(`${scope.tmpPath}`, '/node_modules/', `${scope.client.module}/package.json`));
                 scope.client.version = lock.version;
 
                 if (scope.developerMode === true && scope.client.connector === 'strapi-bookshelf') {
-                  const knexVersion = require(path.join(`${scope.tmpPath}`,`/node_modules/`,`knex/package.json`));
+                  const knexVersion = require(path.join(`${scope.tmpPath}`, '/node_modules/', 'knex/package.json'));
                   scope.additionalsDependencies[1] = `knex@${knexVersion.version || 'latest'}`;
                 }
               }
@@ -248,7 +248,7 @@ module.exports = (scope, cb) => {
         Promise.all(asyncFn)
           .then(() => {
             try {
-              require(path.join(`${scope.tmpPath}`,`/node_modules/`,`${scope.client.connector}/lib/utils/connectivity.js`))(scope, cb.success, connectionValidation);
+              require(path.join(`${scope.tmpPath}`, '/node_modules/', `${scope.client.connector}/lib/utils/connectivity.js`))(scope, cb.success, connectionValidation);
             } catch(err) {
               shell.rm('-r', scope.tmpPath);
               cb.success();
diff --git a/packages/strapi-utils/lib/packageManager.js b/packages/strapi-utils/lib/packageManager.js
index 37f518e940..ee8e657420 100644
--- a/packages/strapi-utils/lib/packageManager.js
+++ b/packages/strapi-utils/lib/packageManager.js
@@ -43,8 +43,8 @@ module.exports = {
         }
 
         try {
-          const yarnData = watcher('yarn global ls');
-          isNPM = includes(yarnData, 'strapi');
+          const yarnData = watcher('yarn global list');
+          isNPM = !includes(yarnData, 'strapi');
         } catch(err) {
           isNPM = true;
         }

From 7d12a89f8f0deaf8ca8e16d862580f526a152437 Mon Sep 17 00:00:00 2001
From: Jim LAURIE <j.laurie6993@gmail.com>
Date: Thu, 12 Jul 2018 12:36:45 +0200
Subject: [PATCH 41/65] Fix custom hook load

---
 docs/3.x.x/en/advanced/hooks.md            |  2 +
 docs/3.x.x/en/advanced/middlewares.md      | 10 +++-
 packages/strapi/lib/core/configurations.js | 23 +++-------
 packages/strapi/lib/core/hooks.js          | 53 +++++++++-------------
 packages/strapi/lib/hooks/index.js         | 52 ++++++++++-----------
 5 files changed, 63 insertions(+), 77 deletions(-)

diff --git a/docs/3.x.x/en/advanced/hooks.md b/docs/3.x.x/en/advanced/hooks.md
index eb4e5dbfbf..a624aaeca9 100644
--- a/docs/3.x.x/en/advanced/hooks.md
+++ b/docs/3.x.x/en/advanced/hooks.md
@@ -107,7 +107,9 @@ The framework allows to load hooks from the project directly without having to i
 └─── config
 └─── hooks
 │   └─── strapi-documentation
+│        - index.js
 │   └─── strapi-server-side-rendering
+│        - index.js
 └─── plugins
 └─── public
 - favicon.ico
diff --git a/docs/3.x.x/en/advanced/middlewares.md b/docs/3.x.x/en/advanced/middlewares.md
index 9adc669171..46e2bd8890 100644
--- a/docs/3.x.x/en/advanced/middlewares.md
+++ b/docs/3.x.x/en/advanced/middlewares.md
@@ -65,8 +65,12 @@ The core of Strapi embraces a small list of middlewares for performances, securi
 A middleware needs to follow the structure below:
 
 ```
-/lib
-- index.js
+/middleware
+└─── lib
+     - index.js
+- LICENSE.md
+- package.json
+- README.md
 ```
 
 The `index.js` is the entry point to your middleware. It should look like the example above.
@@ -82,7 +86,9 @@ The framework allows the application to override the default middlewares and add
 └─── config
 └─── middlewares
 │   └─── responseTime // It will override the core default responseTime middleware
+│        - index.js
 │   └─── views // It will be added into the stack of middleware
+│        - index.js
 └─── plugins
 └─── public
 - favicon.ico
diff --git a/packages/strapi/lib/core/configurations.js b/packages/strapi/lib/core/configurations.js
index ceabc5fae6..c011683707 100755
--- a/packages/strapi/lib/core/configurations.js
+++ b/packages/strapi/lib/core/configurations.js
@@ -304,25 +304,16 @@ module.exports.app = async function() {
 
   this.config.hook.settings = Object.keys(this.hook).reduce((acc, current) => {
     // Try to find the settings in the current environment, then in the main configurations.
-    const currentSettings = flattenHooksConfig[current] || this.config[current];
+    const currentSettings = merge(get(cloneDeep(this.hook[current]), ['defaults', current], {}), flattenHooksConfig[current] || this.config.currentEnvironment[current] || this.config[current]);
+    acc[current] = !isObject(currentSettings) ? {} : currentSettings;
 
-    if (isString(currentSettings)) {
-      acc[current] = currentSettings;
-    } else {
-      acc[current] = !isObject(currentSettings) ? {} : currentSettings;
-
-      if (this.hook[current].isPlugin) {
-        acc[current].enabled = true;
-      }
-
-      if (!acc[current].hasOwnProperty('enabled')) {
-        this.log.warn(`(hook:${current}) wasn't loaded due to missing key \`enabled\` in the configuration`);
-      }
-
-      // Ensure that enabled key exist by forcing to false.
-      defaults(acc[current], { enabled : false });
+    if (!acc[current].hasOwnProperty('enabled')) {
+      this.log.warn(`(hook:${current}) wasn't loaded due to missing key \`enabled\` in the configuration`);
     }
 
+    // Ensure that enabled key exist by forcing to false.
+    defaults(acc[current], { enabled : false });
+
     return acc;
   }, {});
 
diff --git a/packages/strapi/lib/core/hooks.js b/packages/strapi/lib/core/hooks.js
index 834da78848..63c5c91545 100755
--- a/packages/strapi/lib/core/hooks.js
+++ b/packages/strapi/lib/core/hooks.js
@@ -2,21 +2,20 @@
 
 // Dependencies.
 const path = require('path');
-const fs = require('fs');
 const glob = require('glob');
 const { parallel } = require('async');
-const { upperFirst, lowerFirst, get } = require('lodash');
+const { endsWith } = require('lodash');
 
 module.exports = function() {
   this.hook = {};
 
   return Promise.all([
     new Promise((resolve, reject) => {
-      const cwd = '';
+      const cwd = this.config.appPath;
 
       // Load configurations.
-      glob('./node_modules/strapi-hook-*', {
-        cwd: this.config.appPath
+      glob('./node_modules/*(strapi-hook-*)/*/*(index|defaults).*(js|json)', {
+        cwd
       }, (err, files) => {
         if (err) {
           return reject(err);
@@ -26,11 +25,11 @@ module.exports = function() {
       });
     }),
     new Promise((resolve, reject) => {
-      const cwd = 'hooks';
+      const cwd = path.resolve(this.config.appPath, 'hooks');
 
       // Load configurations.
-      glob('./*', {
-        cwd: path.resolve(this.config.appPath, 'hooks')
+      glob('./*/*(index|defaults).*(js|json)', {
+        cwd
       }, (err, files) => {
         if (err) {
           return reject(err);
@@ -43,7 +42,7 @@ module.exports = function() {
       const cwd = path.resolve(this.config.appPath, 'plugins');
 
       // Load configurations.
-      glob('./*/hooks/*', {
+      glob('./*/hooks/*/*(index|defaults).*(js|json)', {
         cwd
       }, (err, files) => {
         if (err) {
@@ -64,30 +63,22 @@ const mountHooks = function (files, cwd, isPlugin) {
           .split('/');
         const name = isPlugin ? folders[folders.length - 2] : folders[1];
 
-        fs.readFile(path.resolve(this.config.appPath, cwd, p, 'package.json'), (err, content) => {
-          try {
-            const pkg = isPlugin ? {} : JSON.parse(content);
+        this.hook[name] = this.hook[name] || {
+          loaded: false
+        };
 
-            this.hook[name] = {
-              isPlugin,
-              loaded: false,
-              identity: name,
-              dependencies: get(pkg, 'strapi.dependencies') || []
-            };
+        if (endsWith(p, 'index.js') && !this.hook[name].load) {
+          // Lazy loading.
+          Object.defineProperty(this.hook[name], 'load', {
+            configurable: false,
+            enumerable: true,
+            get: () => require(path.resolve(cwd, p))(this)
+          });
+        } else if (endsWith(p, 'defaults.json')) {
+          this.hook[name].defaults = require(path.resolve(cwd, p));
+        }
 
-            // Lazy loading.
-            Object.defineProperty(this.hook[name], 'load', {
-              configurable: false,
-              enumerable: true,
-              get: () => require(path.resolve(this.config.appPath, cwd, p))
-            });
-
-            cb();
-          } catch (e) {
-            cb(e);
-          }
-
-        });
+        cb();
       }),
       (err) => {
         if (err) {
diff --git a/packages/strapi/lib/hooks/index.js b/packages/strapi/lib/hooks/index.js
index c7e2cb11cf..3b0db34f3e 100755
--- a/packages/strapi/lib/hooks/index.js
+++ b/packages/strapi/lib/hooks/index.js
@@ -6,39 +6,35 @@ const { after, includes, indexOf, drop, dropRight, uniq, defaultsDeep, get, set,
 module.exports = async function() {
   // Method to initialize hooks and emit an event.
   const initialize = (module, hook) => (resolve, reject) => {
-    if (typeof module === 'function') {
-      let timeout = true;
+    let timeout = true;
 
-      setTimeout(() => {
-        if (timeout) {
-          reject(`(hook:${hook}) takes too long to load`);
-        }
-      }, this.config.hook.timeout || 1000);
+    setTimeout(() => {
+      if (timeout) {
+        reject(`(hook:${hook}) takes too long to load`);
+      }
+    }, this.config.hook.timeout || 1000);
 
-      const loadedModule = module(this);
+    const loadedModule = module;
 
-      loadedModule.initialize.call(module, err => {
-        timeout = false;
+    loadedModule.initialize.call(module, err => {
+      timeout = false;
 
-        if (err) {
-          this.emit('hook:' + hook + ':error');
+      if (err) {
+        this.emit('hook:' + hook + ':error');
 
-          return reject(err);
-        }
+        return reject(err);
+      }
 
-        this.hook[hook].loaded = true;
+      this.hook[hook].loaded = true;
 
-        this.hook[hook] = merge(this.hook[hook], loadedModule);
+      this.hook[hook] = merge(this.hook[hook], loadedModule);
 
-        this.emit('hook:' + hook + ':loaded');
-        // Remove listeners.
-        this.removeAllListeners('hook:' + hook + ':loaded');
+      this.emit('hook:' + hook + ':loaded');
+      // Remove listeners.
+      this.removeAllListeners('hook:' + hook + ':loaded');
 
-        resolve();
-      });
-    } else {
       resolve();
-    }
+    });
   };
 
   await Promise.all(
@@ -50,8 +46,8 @@ module.exports = async function() {
 
         const module = this.hook[hook].load;
 
-        if (module(this).beforeInitialize) {
-          await module(this).beforeInitialize.call(module);
+        if (module.beforeInitialize) {
+          await module.beforeInitialize.call(module);
         }
       }
     )
@@ -78,12 +74,12 @@ module.exports = async function() {
             set(this.config.hook, `settings.${hook}`, {});
           }
 
-          if (module(this).defaults && this.config.hook.settings[hook] !== false) {
-            defaultsDeep(this.config.hook.settings[hook], module(this).defaults[hook] || module(this).defaults);
+          if (module.defaults && this.config.hook.settings[hook] !== false) {
+            defaultsDeep(this.config.hook.settings[hook], module.defaults[hook] || module.defaults);
           }
 
           // Initialize array.
-          let previousDependencies = this.hook[hook].dependencies.map(x => x.replace('strapi-hook', '')) || [];
+          let previousDependencies = [];
 
           // Add BEFORE middlewares to load and remove the current one
           // to avoid that it waits itself.

From e888007878a09dc94376bd90529e97562e3c76d8 Mon Sep 17 00:00:00 2001
From: Jim LAURIE <j.laurie6993@gmail.com>
Date: Thu, 12 Jul 2018 14:31:39 +0200
Subject: [PATCH 42/65] Fix hook dependencies

---
 packages/strapi-hook-bookshelf/package.json |  4 ++--
 packages/strapi/lib/core/hooks.js           | 24 +++++++++++++++------
 packages/strapi/lib/hooks/index.js          |  2 +-
 3 files changed, 21 insertions(+), 9 deletions(-)

diff --git a/packages/strapi-hook-bookshelf/package.json b/packages/strapi-hook-bookshelf/package.json
index ea37786086..1f1c25f35b 100755
--- a/packages/strapi-hook-bookshelf/package.json
+++ b/packages/strapi-hook-bookshelf/package.json
@@ -25,7 +25,7 @@
   },
   "strapi": {
     "dependencies": [
-      "strapi-hook-knex"
+      "knex"
     ]
   },
   "scripts": {
@@ -55,4 +55,4 @@
     "npm": ">= 5.3.0"
   },
   "license": "MIT"
-}
\ No newline at end of file
+}
diff --git a/packages/strapi/lib/core/hooks.js b/packages/strapi/lib/core/hooks.js
index 63c5c91545..74e26241b0 100755
--- a/packages/strapi/lib/core/hooks.js
+++ b/packages/strapi/lib/core/hooks.js
@@ -4,7 +4,7 @@
 const path = require('path');
 const glob = require('glob');
 const { parallel } = require('async');
-const { endsWith } = require('lodash');
+const { endsWith, get } = require('lodash');
 
 module.exports = function() {
   this.hook = {};
@@ -21,7 +21,7 @@ module.exports = function() {
           return reject(err);
         }
 
-        mountHooks.call(this, files, cwd)(resolve, reject);
+        mountHooks.call(this, files, cwd, 'node_modules')(resolve, reject);
       });
     }),
     new Promise((resolve, reject) => {
@@ -49,31 +49,43 @@ module.exports = function() {
           return reject(err);
         }
 
-        mountHooks.call(this, files, cwd, true)(resolve, reject);
+        mountHooks.call(this, files, cwd, 'plugins')(resolve, reject);
       });
     })
   ]);
 };
 
-const mountHooks = function (files, cwd, isPlugin) {
+const mountHooks = function (files, cwd, source) {
   return (resolve, reject) =>
     parallel(
       files.map(p => cb => {
         const folders = p.replace(/^.\/node_modules\/strapi-hook-/, './')
           .split('/');
-        const name = isPlugin ? folders[folders.length - 2] : folders[1];
+        const name = source === 'plugins' ? folders[folders.length - 2] : folders[1];
 
         this.hook[name] = this.hook[name] || {
           loaded: false
         };
 
+        let dependencies = [];
+        if (source === 'node_modules') {
+          try {
+            dependencies = get(require(path.resolve(this.config.appPath, 'node_modules', `strapi-hook-${name}`, 'package.json')), 'strapi.dependencies', []);
+          } catch(err) {
+            // Silent
+          }
+        }
+
         if (endsWith(p, 'index.js') && !this.hook[name].load) {
           // Lazy loading.
           Object.defineProperty(this.hook[name], 'load', {
             configurable: false,
             enumerable: true,
-            get: () => require(path.resolve(cwd, p))(this)
+            get: () => require(path.resolve(cwd, p))(this),
+            dependencies
           });
+
+          this.hook[name].dependencies = dependencies;
         } else if (endsWith(p, 'defaults.json')) {
           this.hook[name].defaults = require(path.resolve(cwd, p));
         }
diff --git a/packages/strapi/lib/hooks/index.js b/packages/strapi/lib/hooks/index.js
index 3b0db34f3e..31a9dd4e99 100755
--- a/packages/strapi/lib/hooks/index.js
+++ b/packages/strapi/lib/hooks/index.js
@@ -79,7 +79,7 @@ module.exports = async function() {
           }
 
           // Initialize array.
-          let previousDependencies = [];
+          let previousDependencies = this.hook[hook].dependencies || [];
 
           // Add BEFORE middlewares to load and remove the current one
           // to avoid that it waits itself.

From c2d7d8f21d859cc4fa5447681e37b9000da8effe Mon Sep 17 00:00:00 2001
From: Vasilis Kortsimelidis <vaskort@gmail.com>
Date: Thu, 12 Jul 2018 14:36:44 +0100
Subject: [PATCH 43/65] Made new options optional - Merged them to the answers
 object

---
 packages/strapi-generate-new/lib/before.js | 2 +-
 packages/strapi/bin/strapi-new.js          | 2 +-
 2 files changed, 2 insertions(+), 2 deletions(-)

diff --git a/packages/strapi-generate-new/lib/before.js b/packages/strapi-generate-new/lib/before.js
index 9ad9e8c985..aa851df512 100755
--- a/packages/strapi-generate-new/lib/before.js
+++ b/packages/strapi-generate-new/lib/before.js
@@ -192,7 +192,7 @@ module.exports = (scope, cb) => {
               ])
               .then(answers => {
                 if (hasDatabaseConfig) {
-                  answers = _.omit(scope.database.settings, ['client']);
+                  answers = _.merge((_.omit(scope.database.settings, ['client'])), scope.database.options);
                 }
 
                 scope.database.settings.host = answers.host;
diff --git a/packages/strapi/bin/strapi-new.js b/packages/strapi/bin/strapi-new.js
index b5dcf25d79..6c475c28f7 100755
--- a/packages/strapi/bin/strapi-new.js
+++ b/packages/strapi/bin/strapi-new.js
@@ -45,7 +45,7 @@ module.exports = function (name, cliArguments) {
     developerMode
   };
 
-  const dbArguments = ['dbclient', 'dbhost', 'dbport', 'dbname', 'dbusername', 'dbpassword', 'dbssl', 'dbauth'];
+  const dbArguments = ['dbclient', 'dbhost', 'dbport', 'dbname', 'dbusername', 'dbpassword'];
   const matchingDbArguments = _.intersection(_.keys(cliArguments), dbArguments);
 
   if (matchingDbArguments.length) {

From 53fa2eb279897bddc3d079d00d99eaca1dae55db Mon Sep 17 00:00:00 2001
From: Vasilis Kortsimelidis <vaskort@gmail.com>
Date: Thu, 12 Jul 2018 15:59:35 +0100
Subject: [PATCH 44/65] Updated the CLI docks

---
 docs/3.x.x/en/cli/CLI.md | 6 +++---
 1 file changed, 3 insertions(+), 3 deletions(-)

diff --git a/docs/3.x.x/en/cli/CLI.md b/docs/3.x.x/en/cli/CLI.md
index daac90433d..9759038fef 100644
--- a/docs/3.x.x/en/cli/CLI.md
+++ b/docs/3.x.x/en/cli/CLI.md
@@ -11,7 +11,7 @@ Create a new project
 ```bash
 strapi new <name>
 
-options: [--dev|--dbclient=<dbclient> --dbhost=<dbhost> --dbport=<dbport> --dbname=<dbname> --dbusername=<dbusername> --dbpassword=<dbpassword>]
+options: [--dev|--dbclient=<dbclient> --dbhost=<dbhost> --dbport=<dbport> --dbname=<dbname> --dbusername=<dbusername> --dbpassword=<dbpassword> --dbssl=<dbssl> --dbauth=<dbauth>]
 ```
 
 - **strapi new &#60;name&#62;**<br/>
@@ -20,8 +20,8 @@ options: [--dev|--dbclient=<dbclient> --dbhost=<dbhost> --dbport=<dbport> --dbna
 - **strapi new &#60;name&#62; --dev**<br/>
   Generates a new project called **&#60;name&#62;** and creates symlinks for the `./admin` folder and each plugin inside the `./plugin` folder. It means that the Strapi's development workflow has been set up on the machine earlier.
 
-- **strapi new &#60;name&#62; --dbclient=&#60;dbclient&#62; --dbhost=&#60;dbhost&#62; --dbport=&#60;dbport&#62; --dbname=&#60;dbname&#62; --dbusername=&#60;dbusername&#62; --dbpassword=&#60;dbpassword&#62;**<br/>
-  Generates a new project called **&#60;name&#62;** and skip the interactive database configuration and initilize with these options. **&#60;dbclient&#62;** can be `mongo`, `postgres`, `mysql`, `sqlite3` or `redis`. **&#60;dbusername&#62;** and **&#60;dbpassword&#62;** are optional.
+- **strapi new &#60;name&#62; --dbclient=&#60;dbclient&#62; --dbhost=&#60;dbhost&#62; --dbport=&#60;dbport&#62; --dbname=&#60;dbname&#62; --dbusername=&#60;dbusername&#62; --dbpassword=&#60;dbpassword&#62; --dbssl=&#60;dbssl&#62; --dbauth=&#60;dbauth&#62;**<br/>
+  Generates a new project called **&#60;name&#62;** and skip the interactive database configuration and initilize with these options. **&#60;dbclient&#62;** can be `mongo`, `postgres`, `mysql`, `sqlite3` or `redis`. **&#60;dbssl&#62;** and **&#60;dbauth&#62;** are optional.
   
 
   See the [CONTRIBUTING guide](https://github.com/strapi/strapi/blob/master/CONTRIBUTING.md) for more details.

From 634165c3796b96a9d5bcdff52ec58a26d53b6720 Mon Sep 17 00:00:00 2001
From: Jim LAURIE <j.laurie6993@gmail.com>
Date: Thu, 12 Jul 2018 17:27:32 +0200
Subject: [PATCH 45/65] Fix strapi utils hook detection

---
 packages/strapi-hook-bookshelf/package.json | 2 +-
 packages/strapi-utils/lib/models.js         | 2 +-
 2 files changed, 2 insertions(+), 2 deletions(-)

diff --git a/packages/strapi-hook-bookshelf/package.json b/packages/strapi-hook-bookshelf/package.json
index 1f1c25f35b..6db9ad31c2 100755
--- a/packages/strapi-hook-bookshelf/package.json
+++ b/packages/strapi-hook-bookshelf/package.json
@@ -55,4 +55,4 @@
     "npm": ">= 5.3.0"
   },
   "license": "MIT"
-}
+}
\ No newline at end of file
diff --git a/packages/strapi-utils/lib/models.js b/packages/strapi-utils/lib/models.js
index 4f416be13a..3668fe1838 100755
--- a/packages/strapi-utils/lib/models.js
+++ b/packages/strapi-utils/lib/models.js
@@ -446,7 +446,7 @@ module.exports = {
       throw new Error(`Impossible to determine the ORM used for the model ${model}.`);
     }
 
-    const convertor = strapi.hook[connector].load().getQueryParams;
+    const convertor = strapi.hook[connector].getQueryParams;
     const convertParams = {
       where: {},
       sort: '',

From cfb68eca0f8200784b8c092c0860bf39fd0cf6e8 Mon Sep 17 00:00:00 2001
From: DMehaffy <derrickmehaffy@gmail.com>
Date: Thu, 12 Jul 2018 11:11:43 -0700
Subject: [PATCH 46/65] Update per comments

---
 docs/3.x.x/en/advanced/customize-admin.md | 6 ++++--
 1 file changed, 4 insertions(+), 2 deletions(-)

diff --git a/docs/3.x.x/en/advanced/customize-admin.md b/docs/3.x.x/en/advanced/customize-admin.md
index 9a40b4cb83..efe380e7b4 100644
--- a/docs/3.x.x/en/advanced/customize-admin.md
+++ b/docs/3.x.x/en/advanced/customize-admin.md
@@ -101,14 +101,16 @@ Note: make sure the size of your image is the same as the existing one (434px x
 
 ## Build
 
-To build the administration, run the following command from the root directory of your project, **not** the `./admin folder:
+To build the administration, run the following command from the root directory of your project.
 
 ```
-npm run build
+npm run setup
 ```
 
 This will replace the folder's content located at `./admin/admin/build`. Visit http://localhost:1337/admin/ to make sure your updates have been taken in account.
 
+After you have built the admininistration you can now create a new project to develop your API with the changes implemented. **Note:** You should now create a project without `--dev` 
+
 ***
 
 ## Deployment

From c2c9d95d1a4ebb898385319927f7c42a16588089 Mon Sep 17 00:00:00 2001
From: soupette <cyril.lpz@gmail.com>
Date: Fri, 13 Jul 2018 11:48:35 +0200
Subject: [PATCH 47/65] Fix PR feedback

---
 .../src/components/InputToggle/styles.scss    | 14 ++++++++++-
 .../src/assets/images/icon-cross-blue.svg     | 19 +-------------
 .../admin/src/assets/images/icon-cross.svg    | 15 +----------
 .../src/assets/images/icon-edit-blue.svg      | 25 +------------------
 .../admin/src/components/SettingsRow/index.js |  2 +-
 .../admin/src/translations/fr.json            | 10 ++++----
 6 files changed, 22 insertions(+), 63 deletions(-)

diff --git a/packages/strapi-helper-plugin/lib/src/components/InputToggle/styles.scss b/packages/strapi-helper-plugin/lib/src/components/InputToggle/styles.scss
index 15586f9ca7..8c257908a4 100644
--- a/packages/strapi-helper-plugin/lib/src/components/InputToggle/styles.scss
+++ b/packages/strapi-helper-plugin/lib/src/components/InputToggle/styles.scss
@@ -1,13 +1,25 @@
 .gradientOff {
   background-image: linear-gradient( to bottom right, #F65A1D, #F68E0E );
   color: white !important;
-  box-shadow: inset -1px 1px 3px rgba(0,0,0,0.1);
+  z-index: 0!important;
+  
+  &:active, :hover {
+    box-shadow: inset -1px 1px 3px rgba(0,0,0,0.1);
+    background-image: linear-gradient( to bottom right, #F65A1D, #F68E0E );
+    color: white !important;
+    z-index: 0!important;
+  }
 }
 
 .gradientOn {
   background-image: linear-gradient( to bottom right, #005EEA, #0097F6);
   color: white !important;
   box-shadow: inset 1px 1px 3px rgba(0,0,0,0.1);
+  &:active, :hover {
+    background-image: linear-gradient( to bottom right, #005EEA, #0097F6);
+    color: white !important;
+    z-index: 0!important;
+  }
 }
 
 .inputToggleContainer {
diff --git a/packages/strapi-plugin-content-manager/admin/src/assets/images/icon-cross-blue.svg b/packages/strapi-plugin-content-manager/admin/src/assets/images/icon-cross-blue.svg
index 58f0a5d8c7..2c77b183ae 100644
--- a/packages/strapi-plugin-content-manager/admin/src/assets/images/icon-cross-blue.svg
+++ b/packages/strapi-plugin-content-manager/admin/src/assets/images/icon-cross-blue.svg
@@ -1,18 +1 @@
-<?xml version="1.0" encoding="UTF-8"?>
-<svg width="8px" height="8px" viewBox="0 0 8 8" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
-    <!-- Generator: Sketch 49.3 (51167) - http://www.bohemiancoding.com/sketch -->
-    <title>Shape</title>
-    <desc>Created with Sketch.</desc>
-    <defs></defs>
-    <g id="Pages" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
-        <g id="Content-Manager---List-view" transform="translate(-568.000000, -172.000000)" fill="#007EFF">
-            <g id="Container" transform="translate(234.000000, 0.000000)">
-                <g id="Filter" transform="translate(29.000000, 160.000000)">
-                    <g id="Filter-#1" transform="translate(91.000000, 0.000000)">
-                        <path d="M221.779774,18.7197709 L219.060003,16 L221.779774,13.2802291 C222.073409,12.9865938 222.073409,12.5138618 221.779774,12.2202265 C221.486138,11.9265912 221.013406,11.9265912 220.719771,12.2202265 L218,14.9399974 L215.280229,12.2202265 C214.986594,11.9265912 214.513862,11.9265912 214.220226,12.2202265 C213.926591,12.5138618 213.926591,12.9865938 214.220226,13.2802291 L216.939997,16 L214.220226,18.7197709 C213.926591,19.0134062 213.926591,19.4861382 214.220226,19.7797735 C214.513862,20.0734088 214.986594,20.0734088 215.280229,19.7797735 L218,17.0600026 L220.719771,19.7797735 C221.013406,20.0734088 221.486138,20.0734088 221.779774,19.7797735 C222.071326,19.4861382 222.071326,19.0113237 221.779774,18.7197709 L221.779774,18.7197709 Z" id="Shape"></path>
-                    </g>
-                </g>
-            </g>
-        </g>
-    </g>
-</svg>
\ No newline at end of file
+<svg width="8" height="8" xmlns="http://www.w3.org/2000/svg"><path d="M7.78 6.72L5.06 4l2.72-2.72a.748.748 0 0 0 0-1.06.748.748 0 0 0-1.06 0L4 2.94 1.28.22a.748.748 0 0 0-1.06 0 .748.748 0 0 0 0 1.06L2.94 4 .22 6.72a.748.748 0 0 0 0 1.06.748.748 0 0 0 1.06 0L4 5.06l2.72 2.72a.748.748 0 0 0 1.06 0 .752.752 0 0 0 0-1.06z" fill="#007EFF" fill-rule="evenodd"/></svg>
\ No newline at end of file
diff --git a/packages/strapi-plugin-content-manager/admin/src/assets/images/icon-cross.svg b/packages/strapi-plugin-content-manager/admin/src/assets/images/icon-cross.svg
index aa113a980d..d627d9bdac 100644
--- a/packages/strapi-plugin-content-manager/admin/src/assets/images/icon-cross.svg
+++ b/packages/strapi-plugin-content-manager/admin/src/assets/images/icon-cross.svg
@@ -1,14 +1 @@
-<?xml version="1.0" encoding="UTF-8"?>
-<svg width="8px" height="8px" viewBox="0 0 8 8" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
-    <!-- Generator: Sketch 49.3 (51167) - http://www.bohemiancoding.com/sketch -->
-    <title>Shape</title>
-    <desc>Created with Sketch.</desc>
-    <defs></defs>
-    <g id="Symbols" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
-        <g id="Search" transform="translate(-300.000000, -29.000000)" fill="#B3B5B9">
-            <g id="Shape">
-                <path d="M307.779774,35.7197709 L305.060003,33 L307.779774,30.2802291 C308.073409,29.9865938 308.073409,29.5138618 307.779774,29.2202265 C307.486138,28.9265912 307.013406,28.9265912 306.719771,29.2202265 L304,31.9399974 L301.280229,29.2202265 C300.986594,28.9265912 300.513862,28.9265912 300.220226,29.2202265 C299.926591,29.5138618 299.926591,29.9865938 300.220226,30.2802291 L302.939997,33 L300.220226,35.7197709 C299.926591,36.0134062 299.926591,36.4861382 300.220226,36.7797735 C300.513862,37.0734088 300.986594,37.0734088 301.280229,36.7797735 L304,34.0600026 L306.719771,36.7797735 C307.013406,37.0734088 307.486138,37.0734088 307.779774,36.7797735 C308.071326,36.4861382 308.071326,36.0113237 307.779774,35.7197709 L307.779774,35.7197709 Z"></path>
-            </g>
-        </g>
-    </g>
-</svg>
\ No newline at end of file
+<svg width="8" height="8" xmlns="http://www.w3.org/2000/svg"><path d="M7.78 6.72L5.06 4l2.72-2.72a.748.748 0 0 0 0-1.06.748.748 0 0 0-1.06 0L4 2.94 1.28.22a.748.748 0 0 0-1.06 0 .748.748 0 0 0 0 1.06L2.94 4 .22 6.72a.748.748 0 0 0 0 1.06.748.748 0 0 0 1.06 0L4 5.06l2.72 2.72a.748.748 0 0 0 1.06 0 .752.752 0 0 0 0-1.06z" fill="#B3B5B9" fill-rule="evenodd"/></svg>
\ No newline at end of file
diff --git a/packages/strapi-plugin-content-manager/admin/src/assets/images/icon-edit-blue.svg b/packages/strapi-plugin-content-manager/admin/src/assets/images/icon-edit-blue.svg
index 3fc5c78b59..0da67b8b3b 100644
--- a/packages/strapi-plugin-content-manager/admin/src/assets/images/icon-edit-blue.svg
+++ b/packages/strapi-plugin-content-manager/admin/src/assets/images/icon-edit-blue.svg
@@ -1,24 +1 @@
-<?xml version="1.0" encoding="UTF-8"?>
-<svg width="10px" height="10px" viewBox="0 0 10 10" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
-    <!-- Generator: Sketch 50.2 (55047) - http://www.bohemiancoding.com/sketch -->
-    <title>Shape</title>
-    <desc>Created with Sketch.</desc>
-    <defs></defs>
-    <g id="Pages" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
-        <g id="Content-Manager---Settings-view---Single" transform="translate(-668.000000, -604.000000)" fill="#007EFF" fill-rule="nonzero">
-            <g id="Container" transform="translate(257.000000, 84.000000)">
-                <g id="Forms" transform="translate(0.000000, 77.000000)">
-                    <g id="Settings">
-                        <g id="Attributes" transform="translate(12.000000, 327.000000)">
-                            <g id="Order-attributes" transform="translate(0.000000, 23.000000)">
-                                <g id="Link" transform="translate(35.000000, 0.000000)">
-                                    <path d="M366.39604,102.155116 L366.9967,101.554455 L365.445545,100.0033 L364.844884,100.60396 L364.844884,101.310231 L365.689769,101.310231 L365.689769,102.155116 L366.39604,102.155116 Z M369.848185,96.029703 C369.848185,95.9328933 369.79978,95.8844884 369.70297,95.8844884 C369.658966,95.8844884 369.621562,95.89989 369.590759,95.9306931 L366.013201,99.5082508 C365.982398,99.5390539 365.966997,99.5764576 365.966997,99.620462 C365.966997,99.7172717 366.015402,99.7656766 366.112211,99.7656766 C366.156216,99.7656766 366.193619,99.750275 366.224422,99.7194719 L369.80198,96.1419142 C369.832783,96.1111111 369.848185,96.0737074 369.848185,96.029703 Z M369.491749,94.7623762 L372.237624,97.5082508 L366.745875,103 L364,103 L364,100.254125 L369.491749,94.7623762 Z M374,95.3960396 C374,95.6292629 373.918592,95.8272827 373.755776,95.990099 L372.660066,97.0858086 L369.914191,94.339934 L371.009901,93.2508251 C371.168317,93.0836084 371.366337,93 371.60396,93 C371.837184,93 372.037404,93.0836084 372.20462,93.2508251 L373.755776,94.7953795 C373.918592,94.9669967 374,95.1672167 374,95.3960396 Z" id="Shape"></path>
-                                </g>
-                            </g>
-                        </g>
-                    </g>
-                </g>
-            </g>
-        </g>
-    </g>
-</svg>
\ No newline at end of file
+<svg width="10" height="10" xmlns="http://www.w3.org/2000/svg"><path d="M2.396 9.155l.6-.6-1.55-1.552-.601.601v.706h.845v.845h.706zM5.848 3.03c0-.097-.048-.146-.145-.146a.153.153 0 0 0-.112.047L2.013 6.508a.153.153 0 0 0-.046.112c0 .097.048.146.145.146a.153.153 0 0 0 .112-.047l3.578-3.577a.153.153 0 0 0 .046-.112zm-.356-1.268l2.746 2.746L2.746 10H0V7.254l5.492-5.492zM10 2.396a.809.809 0 0 1-.244.594L8.66 4.086 5.914 1.34 7.01.25A.784.784 0 0 1 7.604 0a.82.82 0 0 1 .6.25l1.552 1.545a.845.845 0 0 1 .244.601z" fill="#007EFF" fill-rule="nonzero"/></svg>
\ No newline at end of file
diff --git a/packages/strapi-plugin-content-manager/admin/src/components/SettingsRow/index.js b/packages/strapi-plugin-content-manager/admin/src/components/SettingsRow/index.js
index 1375637bd8..dd73c72aee 100644
--- a/packages/strapi-plugin-content-manager/admin/src/components/SettingsRow/index.js
+++ b/packages/strapi-plugin-content-manager/admin/src/components/SettingsRow/index.js
@@ -21,7 +21,7 @@ function SettingsRow({ destination, name, onClick }) {
           </div>
           {upperFirst(name)}
         </div>
-        <IcoContainer icons={[{icoType: 'cog'}]} />
+        <IcoContainer icons={[{ icoType: 'cog', onClick: () => onClick(destination) }]} />
       </div>
     </div>
   );
diff --git a/packages/strapi-plugin-content-manager/admin/src/translations/fr.json b/packages/strapi-plugin-content-manager/admin/src/translations/fr.json
index 971325d272..c10a298c05 100755
--- a/packages/strapi-plugin-content-manager/admin/src/translations/fr.json
+++ b/packages/strapi-plugin-content-manager/admin/src/translations/fr.json
@@ -89,14 +89,14 @@
   "form.Input.search": "Autoriser la search",
   "form.Input.search.field": "Autoriser la search sur ce champs",
   "form.Input.filters": "Autoriser les filtres",
-  "form.Input.sort.field": "Autoriser le trie sur ce champs",
-  "form.Input.bulkActions": "Autoriser les bulk actions",
+  "form.Input.sort.field": "Autoriser le tri sur ce champs",
+  "form.Input.bulkActions": "Autoriser les actions groupées",
   "form.Input.pageEntries": "Nombre d'entrées par page",
-  "form.Input.pageEntries.inputDescription": "Note: Vous pouvez les modifier ces valeurs par modèle",
-  "form.Input.defaultSort": "Attribut de trie par défault",
+  "form.Input.pageEntries.inputDescription": "Note: Vous pouvez modifier ces valeurs par modèle",
+  "form.Input.defaultSort": "Attribut de tri par défault",
 
   "notification.error.relationship.fetch": "Une erreur est survenue en récupérant les relations.",
-  "notification.info.SettingPage.disableSort": "Vous devez avoir au moins un attribut de trie par défaut",
+  "notification.info.SettingPage.disableSort": "Vous devez avoir au moins un attribut de tri par défaut",
 
   "success.record.delete": "Supprimé",
   "success.record.save": "Sauvegardé",

From 927e5afb5075894d4b7b0badc9bd8ce075573d66 Mon Sep 17 00:00:00 2001
From: soupette <cyril.lpz@gmail.com>
Date: Fri, 13 Jul 2018 12:07:59 +0200
Subject: [PATCH 48/65] Add PopUpWarning when cancelling modifications in
 settings views

---
 .../admin/src/containers/SettingPage/index.js | 34 +++++++++++++++++--
 .../src/containers/SettingsPage/index.js      | 30 +++++++++++++---
 .../admin/src/translations/en.json            |  1 +
 .../admin/src/translations/fr.json            |  1 +
 4 files changed, 59 insertions(+), 7 deletions(-)

diff --git a/packages/strapi-plugin-content-manager/admin/src/containers/SettingPage/index.js b/packages/strapi-plugin-content-manager/admin/src/containers/SettingPage/index.js
index a354db7a29..87020c0fcc 100644
--- a/packages/strapi-plugin-content-manager/admin/src/containers/SettingPage/index.js
+++ b/packages/strapi-plugin-content-manager/admin/src/containers/SettingPage/index.js
@@ -46,7 +46,12 @@ import styles from './styles.scss';
 
 
 class SettingPage extends React.PureComponent {
-  state = { showWarning: false, isDraggingSibling: false, isOpen: false };
+  state = {
+    isDraggingSibling: false,
+    isOpen: false,
+    showWarning: false,
+    showWarningCancel: false,
+  };
 
   componentDidMount() {
     this.handleClickEditAttr(0);
@@ -123,7 +128,7 @@ class SettingPage extends React.PureComponent {
       {
         label: 'content-manager.popUpWarning.button.cancel',
         kind: 'secondary',
-        onClick: this.props.onReset,
+        onClick: this.handleReset,
         type: 'button',
       },
       {
@@ -186,6 +191,11 @@ class SettingPage extends React.PureComponent {
     this.props.onRemove(index, keys);
   }
 
+  handleReset = (e) => {
+    e.preventDefault();
+    this.setState({ showWarningCancel: true });
+  }
+
   handleSubmit = (e) => {
     e.preventDefault();
     this.setState({ showWarning: true });
@@ -204,6 +214,8 @@ class SettingPage extends React.PureComponent {
 
   toggle = () => this.setState(prevState => ({ showWarning: !prevState.showWarning }));
 
+  toggleWarningCancel = () => this.setState(prevState => ({ showWarningCancel: !prevState.showWarningCancel }));
+  
   toggleDropdown = () => {
     if (this.getDropDownItems().length > 0) {
       this.setState(prevState => ({ isOpen: !prevState.isOpen }));
@@ -211,11 +223,12 @@ class SettingPage extends React.PureComponent {
   }
 
   render() {
-    const { isDraggingSibling, isOpen, showWarning } = this.state;
+    const { isDraggingSibling, isOpen, showWarning, showWarningCancel } = this.state;
     const {
       moveAttr,
       onChangeSettings,
       onClickAddAttr,
+      onReset,
       onSubmit,
     } = this.props;
     const namePath = this.getPath();
@@ -243,6 +256,21 @@ class SettingPage extends React.PureComponent {
               onSubmit();
             }}
           />
+          <PopUpWarning
+            isOpen={showWarningCancel}
+            toggleModal={this.toggleWarningCancel}
+            content={{
+              title: 'content-manager.popUpWarning.title',
+              message: 'content-manager.popUpWarning.warning.cancelAllSettings',
+              cancel: 'content-manager.popUpWarning.button.cancel',
+              confirm: 'content-manager.popUpWarning.button.confirm',
+            }}
+            popUpWarningType="danger"
+            onConfirm={() => {
+              onReset();
+              this.toggleWarningCancel();
+            }}
+          />
           <div className={cn('row', styles.container)}>
             <Block
               description="content-manager.containers.SettingPage.listSettings.description"
diff --git a/packages/strapi-plugin-content-manager/admin/src/containers/SettingsPage/index.js b/packages/strapi-plugin-content-manager/admin/src/containers/SettingsPage/index.js
index 5265cbc2c2..23e2734fd8 100644
--- a/packages/strapi-plugin-content-manager/admin/src/containers/SettingsPage/index.js
+++ b/packages/strapi-plugin-content-manager/admin/src/containers/SettingsPage/index.js
@@ -31,7 +31,7 @@ import styles from './styles.scss';
 import forms from './forms.json';
 
 class SettingsPage extends React.PureComponent {
-  state = { showWarning: false };
+  state = { showWarning: false, showWarningCancel: false };
 
   componentDidUpdate(prevProps) {
     if (prevProps.submitSuccess !== this.props.submitSuccess) {
@@ -68,7 +68,7 @@ class SettingsPage extends React.PureComponent {
       {
         label: 'content-manager.popUpWarning.button.cancel',
         kind: 'secondary',
-        onClick: this.props.onReset,
+        onClick: this.handleReset,
         type: 'button',
       },
       {
@@ -92,6 +92,11 @@ class SettingsPage extends React.PureComponent {
     this.props.history.push(`${pathname}${destination}`);
   }
 
+  handleReset = (e) => {
+    e.preventDefault();
+    this.setState({ showWarningCancel: true });
+  }
+
   handleSubmit = (e) => {
     e.preventDefault();
     this.setState({ showWarning: true });
@@ -99,9 +104,11 @@ class SettingsPage extends React.PureComponent {
 
   toggle = () => this.setState(prevState => ({ showWarning: !prevState.showWarning }));
 
+  toggleWarningCancel = () => this.setState(prevState => ({ showWarningCancel: !prevState.showWarningCancel }));
+
   render() {
-    const { showWarning } = this.state;
-    const { onChange, onSubmit } = this.props;
+    const { showWarning, showWarningCancel } = this.state;
+    const { onChange, onReset, onSubmit } = this.props;
 
     return (
       <div className={cn('container-fluid', styles.containerFluid)}>
@@ -124,6 +131,21 @@ class SettingsPage extends React.PureComponent {
             onSubmit();
           }}
         />
+        <PopUpWarning
+          isOpen={showWarningCancel}
+          toggleModal={this.toggleWarningCancel}
+          content={{
+            title: 'content-manager.popUpWarning.title',
+            message: 'content-manager.popUpWarning.warning.cancelAllSettings',
+            cancel: 'content-manager.popUpWarning.button.cancel',
+            confirm: 'content-manager.popUpWarning.button.confirm',
+          }}
+          popUpWarningType="danger"
+          onConfirm={() => {
+            onReset();
+            this.toggleWarningCancel();
+          }}
+        />
         <div className={cn('row', styles.container)}>
           <Block
             description="content-manager.containers.SettingsPage.Block.generalSettings.description"
diff --git a/packages/strapi-plugin-content-manager/admin/src/translations/en.json b/packages/strapi-plugin-content-manager/admin/src/translations/en.json
index b4995e2b71..7f96cbbd48 100755
--- a/packages/strapi-plugin-content-manager/admin/src/translations/en.json
+++ b/packages/strapi-plugin-content-manager/admin/src/translations/en.json
@@ -111,5 +111,6 @@
   "popUpWarning.title": "Please confirm",
   "popUpWarning.bodyMessage.contentType.delete": "Are you sure you want to delete this entry?",
   "popUpWarning.bodyMessage.contentType.delete.all": "Are you sure you want to delete theses entries?",
+  "popUpWarning.warning.cancelAllSettings": "Are you sure you want to cancel your modifications?",
   "popUpWarning.warning.updateAllSettings": "This will modify all your settings"
 }
diff --git a/packages/strapi-plugin-content-manager/admin/src/translations/fr.json b/packages/strapi-plugin-content-manager/admin/src/translations/fr.json
index c10a298c05..8546d06e92 100755
--- a/packages/strapi-plugin-content-manager/admin/src/translations/fr.json
+++ b/packages/strapi-plugin-content-manager/admin/src/translations/fr.json
@@ -106,5 +106,6 @@
   "popUpWarning.title": "Confirmation requise",
   "popUpWarning.bodyMessage.contentType.delete": "Êtes-vous sûr de vouloir supprimer cette entrée ?",
   "popUpWarning.bodyMessage.contentType.delete.all": "Êtes-vous sûr de vouloir supprimer ces entrées ?",
+  "popUpWarning.warning.cancelAllSettings": "Êtes-vous sûr de vouloir vos modifications?",
   "popUpWarning.warning.updateAllSettings": "Cela modifiera tous vos précédents paramètres."
 }

From 0b1a280c7aa96742281c9b0ba6bd7c0739f98ee3 Mon Sep 17 00:00:00 2001
From: soupette <cyril.lpz@gmail.com>
Date: Fri, 13 Jul 2018 12:19:07 +0200
Subject: [PATCH 49/65] Add PopUpWarning in edit page to warn before cancel
 changes

---
 .../src/components/PopUpWarning/styles.scss   |  1 +
 .../admin/src/containers/EditPage/index.js    | 25 +++++++++++++++++--
 2 files changed, 24 insertions(+), 2 deletions(-)

diff --git a/packages/strapi-helper-plugin/lib/src/components/PopUpWarning/styles.scss b/packages/strapi-helper-plugin/lib/src/components/PopUpWarning/styles.scss
index c573bda639..4616bcf0b8 100644
--- a/packages/strapi-helper-plugin/lib/src/components/PopUpWarning/styles.scss
+++ b/packages/strapi-helper-plugin/lib/src/components/PopUpWarning/styles.scss
@@ -48,6 +48,7 @@
 }
 
 .modalPosition {
+  max-width: 37.5rem !important;
   > div {
     width: 37.5rem;
     padding: 0 !important;
diff --git a/packages/strapi-plugin-content-manager/admin/src/containers/EditPage/index.js b/packages/strapi-plugin-content-manager/admin/src/containers/EditPage/index.js
index 9adcb7a892..cffe9faab2 100644
--- a/packages/strapi-plugin-content-manager/admin/src/containers/EditPage/index.js
+++ b/packages/strapi-plugin-content-manager/admin/src/containers/EditPage/index.js
@@ -19,6 +19,7 @@ import cn from 'classnames';
 import BackHeader from 'components/BackHeader';
 import LoadingIndicator from 'components/LoadingIndicator';
 import PluginHeader from 'components/PluginHeader';
+import PopUpWarning from 'components/PopUpWarning';
 
 // Plugin's components
 import Edit from 'components/Edit';
@@ -53,6 +54,8 @@ import makeSelectEditPage from './selectors';
 import styles from './styles.scss';
 
 export class EditPage extends React.Component {
+  state = { showWarning: false };
+
   componentDidMount() {
     this.props.initModelProps(this.getModelName(), this.isCreating(), this.getSource(), this.getModelAttributes());
 
@@ -243,7 +246,7 @@ export class EditPage extends React.Component {
       {
         label: 'content-manager.containers.Edit.reset',
         kind: 'secondary',
-        onClick: this.props.onCancel,
+        onClick: this.toggle,
         type: 'button',
         disabled: this.showLoaders(),
       },
@@ -265,8 +268,11 @@ export class EditPage extends React.Component {
     return isLoading && !this.isCreating() || isLoading && get(layout, this.getModelName()) === undefined;
   }
 
+  toggle = () => this.setState(prevState => ({ showWarning: !prevState.showWarning }));
+
   render() {
-    const { editPage } = this.props;
+    const { editPage, onCancel } = this.props;
+    const { showWarning } = this.state;
 
     return (
       <div>
@@ -277,6 +283,21 @@ export class EditPage extends React.Component {
               actions={this.pluginHeaderActions()}
               title={{ id: this.getPluginHeaderTitle() }}
             />
+            <PopUpWarning
+              isOpen={showWarning}
+              toggleModal={this.toggle}
+              content={{
+                title: 'content-manager.popUpWarning.title',
+                message: 'content-manager.popUpWarning.warning.cancelAllSettings',
+                cancel: 'content-manager.popUpWarning.button.cancel',
+                confirm: 'content-manager.popUpWarning.button.confirm',
+              }}
+              popUpWarningType="danger"
+              onConfirm={() => {
+                onCancel();
+                this.toggle();
+              }}
+            />
             <div className="row">
               <div className={this.isRelationComponentNull() ? 'col-lg-12' : 'col-lg-9'}>
                 <div className={styles.main_wrapper}>

From 5b633efacfff2ac39a18f51f9e2c44e3180c1e31 Mon Sep 17 00:00:00 2001
From: Jim LAURIE <j.laurie6993@gmail.com>
Date: Fri, 13 Jul 2018 16:42:10 +0200
Subject: [PATCH 50/65] Fix API generator database hook

---
 .../services/ContentTypeBuilder.js                              | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/packages/strapi-plugin-content-type-builder/services/ContentTypeBuilder.js b/packages/strapi-plugin-content-type-builder/services/ContentTypeBuilder.js
index 0726bf0229..4d0a13417a 100755
--- a/packages/strapi-plugin-content-type-builder/services/ContentTypeBuilder.js
+++ b/packages/strapi-plugin-content-type-builder/services/ContentTypeBuilder.js
@@ -117,7 +117,7 @@ module.exports = {
   },
 
   generateAPI: (name, description, connection, collectionName, attributes) => {
-    const template = _.get(strapi.config.currentEnvironment, `database.connections.${connection}.connector`, 'strapi-hook-mongoose').split('-')[1];
+    const template = _.get(strapi.config.currentEnvironment, `database.connections.${connection}.connector`, 'strapi-hook-mongoose').split('-')[2];
 
     return new Promise((resolve, reject) => {
       const scope = {

From d79a16b18c42a562a32460ca3f5fa57ed7646348 Mon Sep 17 00:00:00 2001
From: Jim LAURIE <j.laurie6993@gmail.com>
Date: Fri, 13 Jul 2018 16:59:57 +0200
Subject: [PATCH 51/65] Fix hook lazy loading

---
 packages/strapi-utils/lib/models.js | 2 +-
 packages/strapi/lib/core/hooks.js   | 2 +-
 packages/strapi/lib/hooks/index.js  | 2 +-
 3 files changed, 3 insertions(+), 3 deletions(-)

diff --git a/packages/strapi-utils/lib/models.js b/packages/strapi-utils/lib/models.js
index 3668fe1838..4f416be13a 100755
--- a/packages/strapi-utils/lib/models.js
+++ b/packages/strapi-utils/lib/models.js
@@ -446,7 +446,7 @@ module.exports = {
       throw new Error(`Impossible to determine the ORM used for the model ${model}.`);
     }
 
-    const convertor = strapi.hook[connector].getQueryParams;
+    const convertor = strapi.hook[connector].load().getQueryParams;
     const convertParams = {
       where: {},
       sort: '',
diff --git a/packages/strapi/lib/core/hooks.js b/packages/strapi/lib/core/hooks.js
index 74e26241b0..5416b503ed 100755
--- a/packages/strapi/lib/core/hooks.js
+++ b/packages/strapi/lib/core/hooks.js
@@ -81,7 +81,7 @@ const mountHooks = function (files, cwd, source) {
           Object.defineProperty(this.hook[name], 'load', {
             configurable: false,
             enumerable: true,
-            get: () => require(path.resolve(cwd, p))(this),
+            get: () => require(path.resolve(cwd, p)),
             dependencies
           });
 
diff --git a/packages/strapi/lib/hooks/index.js b/packages/strapi/lib/hooks/index.js
index 31a9dd4e99..67bde36c42 100755
--- a/packages/strapi/lib/hooks/index.js
+++ b/packages/strapi/lib/hooks/index.js
@@ -14,7 +14,7 @@ module.exports = async function() {
       }
     }, this.config.hook.timeout || 1000);
 
-    const loadedModule = module;
+    const loadedModule = module(this);
 
     loadedModule.initialize.call(module, err => {
       timeout = false;

From c7d4858f4e0bb043ce29064c9c073144bb029659 Mon Sep 17 00:00:00 2001
From: Jim LAURIE <j.laurie6993@gmail.com>
Date: Fri, 13 Jul 2018 17:03:34 +0200
Subject: [PATCH 52/65] Fix rename readme

---
 packages/strapi-hook-bookshelf/README.md | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/packages/strapi-hook-bookshelf/README.md b/packages/strapi-hook-bookshelf/README.md
index 6e67c8c6f4..96ba285413 100755
--- a/packages/strapi-hook-bookshelf/README.md
+++ b/packages/strapi-hook-bookshelf/README.md
@@ -1,4 +1,4 @@
-# strapi-boohook-kshelf
+# strapi-hook-bookshelf
 
 [![npm version](https://img.shields.io/npm/v/strapi-hook-bookshelf.svg)](https://www.npmjs.org/package/strapi-hook-bookshelf)
 [![npm downloads](https://img.shields.io/npm/dm/strapi-hook-bookshelf.svg)](https://www.npmjs.org/package/strapi-hook-bookshelf)

From 422530ceed5d17aaadda0a24a3558bc3683ea524 Mon Sep 17 00:00:00 2001
From: David Thomas <dev@synth3.tk>
Date: Fri, 13 Jul 2018 18:00:47 -0400
Subject: [PATCH 53/65] Update fieldType comparison operator to strict

---
 packages/strapi-utils/lib/models.js | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/packages/strapi-utils/lib/models.js b/packages/strapi-utils/lib/models.js
index 7af0be329f..0b1a212de9 100644
--- a/packages/strapi-utils/lib/models.js
+++ b/packages/strapi-utils/lib/models.js
@@ -469,7 +469,7 @@ module.exports = {
         }
       }
       // Check if the value is a valid candidate to be converted to a number value
-      if (fieldType != 'string') {
+      if (fieldType !== 'string') {
         formattedValue = isNumeric(value)
           ? _.toNumber(value)
           : value;

From c785248b2ce517b4b8b5900c79945e4f9aa57ada Mon Sep 17 00:00:00 2001
From: David Thomas <dev@synth3.tk>
Date: Fri, 13 Jul 2018 19:25:40 -0400
Subject: [PATCH 54/65] Fix removal of the filter keyword for field type
 comparison

---
 packages/strapi-utils/lib/models.js | 5 ++++-
 1 file changed, 4 insertions(+), 1 deletion(-)

diff --git a/packages/strapi-utils/lib/models.js b/packages/strapi-utils/lib/models.js
index 0b1a212de9..0cfebd0248 100644
--- a/packages/strapi-utils/lib/models.js
+++ b/packages/strapi-utils/lib/models.js
@@ -463,7 +463,10 @@ module.exports = {
       if (modelAttributes[key]) {
         fieldType = modelAttributes[key]['type'];
       } else {
-        let splitKey = key.split('_').pop();
+        // Remove the filter keyword at the end
+        let splitKey = key.split('_').slice(0,-1);
+        splitKey = splitKey.join('_');
+        
         if (modelAttributes[splitKey]) {
           fieldType = modelAttributes[splitKey]['type'];
         }

From fed929455d907d25fdf5ac1dc86ed3816ab81c18 Mon Sep 17 00:00:00 2001
From: Kamal Bennani <kamalbouchboy1@hotmail.fr>
Date: Sun, 15 Jul 2018 15:51:30 +0200
Subject: [PATCH 55/65] Reset the reloading state after files changes

---
 packages/strapi/lib/Strapi.js | 2 ++
 1 file changed, 2 insertions(+)

diff --git a/packages/strapi/lib/Strapi.js b/packages/strapi/lib/Strapi.js
index 152dfe90d5..f899574dd3 100755
--- a/packages/strapi/lib/Strapi.js
+++ b/packages/strapi/lib/Strapi.js
@@ -231,6 +231,8 @@ class Strapi extends EventEmitter {
 
     const reload = function() {
       if (state.shouldReload === false) {
+        // Reset the reloading state
+        reload.isReloading = false;
         return;
       }
 

From f76e9baac90ca5391bdc0b9b881cbe8744d19344 Mon Sep 17 00:00:00 2001
From: Kamal Bennani <kamalbouchboy1@hotmail.fr>
Date: Mon, 16 Jul 2018 23:47:08 +0200
Subject: [PATCH 56/65] Take into account allowGa config prop

---
 .../strapi-admin/admin/src/containers/AdminPage/saga.js     | 6 +++---
 1 file changed, 3 insertions(+), 3 deletions(-)

diff --git a/packages/strapi-admin/admin/src/containers/AdminPage/saga.js b/packages/strapi-admin/admin/src/containers/AdminPage/saga.js
index 6f2437af0e..6bb488aeb9 100644
--- a/packages/strapi-admin/admin/src/containers/AdminPage/saga.js
+++ b/packages/strapi-admin/admin/src/containers/AdminPage/saga.js
@@ -11,15 +11,15 @@ import { GET_GA_STATUS, GET_LAYOUT } from './constants';
 
 function* getGaStatus() {
   try {
-    const [allowGa, strapiVersion, currentEnvironment] = yield [
+    const [{ allowGa }, { strapiVersion }, { currentEnvironment }] = yield [
       call(request, '/admin/gaConfig', { method: 'GET' }),
       call(request, '/admin/strapiVersion', { method: 'GET' }),
       call(request, '/admin/currentEnvironment', { method: 'GET' }),
     ];
 
-    yield put(getCurrEnvSucceeded(currentEnvironment.currentEnvironment));
+    yield put(getCurrEnvSucceeded(currentEnvironment));
     yield put(getGaStatusSucceeded(allowGa));
-    yield put(getStrapiVersionSucceeded(strapiVersion.strapiVersion));
+    yield put(getStrapiVersionSucceeded(strapiVersion));
   } catch(err) {
     strapi.notification.error('notification.error');
   }

From a1330a5d811a4549dde4d62545065e3781b0c479 Mon Sep 17 00:00:00 2001
From: John Williamson <johnjwilliamson@live.com>
Date: Tue, 17 Jul 2018 13:52:18 +1000
Subject: [PATCH 57/65] clarified path

---
 docs/3.x.x/en/guides/email.md | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/docs/3.x.x/en/guides/email.md b/docs/3.x.x/en/guides/email.md
index b9edddd7f8..f852e57929 100644
--- a/docs/3.x.x/en/guides/email.md
+++ b/docs/3.x.x/en/guides/email.md
@@ -27,8 +27,8 @@ To install a new provider run:
 $ npm install strapi-email-sendgrid@alpha --save
 ```
 
-We have two providers available `strapi-email-sendgrid` and `strapi-upload-mailgun`, use the alpha tag to install one of them. Then, visit `/admin/plugins/email/configurations/development` and configure the provider.
+We have two providers available `strapi-email-sendgrid` and `strapi-upload-mailgun`, use the alpha tag to install one of them. Then, visit `/admin/plugins/email/configurations/development` on your web browser and configure the provider.
 
 If you want to create your own, make sure the name starts with `strapi-email-` (duplicating an existing one will be easier to create), modify the `auth` config object and customize the `send` functions.
 
-Check all community providers available on npmjs.org - [Providers list](https://www.npmjs.com/search?q=strapi-email-)
\ No newline at end of file
+Check all community providers available on npmjs.org - [Providers list](https://www.npmjs.com/search?q=strapi-email-)

From ea35200b8c05e049c6b6c8ae3eb38ad20ebf2026 Mon Sep 17 00:00:00 2001
From: John Williamson <johnjwilliamson@live.com>
Date: Tue, 17 Jul 2018 14:06:12 +1000
Subject: [PATCH 58/65] Update upload.md

---
 docs/3.x.x/en/guides/upload.md | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/docs/3.x.x/en/guides/upload.md b/docs/3.x.x/en/guides/upload.md
index eae41c75f4..67a82b7054 100644
--- a/docs/3.x.x/en/guides/upload.md
+++ b/docs/3.x.x/en/guides/upload.md
@@ -133,7 +133,7 @@ To install a new provider run:
 $ npm install strapi-upload-aws-s3@alpha --save
 ```
 
-We have two providers available `strapi-upload-aws-s3` and `strapi-upload-cloudinary`, use the alpha tag to install one of them. Then, visit `/admin/plugins/upload/configurations/development` and configure the provider.
+We have two providers available `strapi-upload-aws-s3` and `strapi-upload-cloudinary`, use the alpha tag to install one of them. Then, visit `/admin/plugins/upload/configurations/development` on your web browser and configure the provider.
 
 If you want to create your own, make sure the name starts with `strapi-upload-` (duplicating an existing one will be easier to create), modify the `auth` config object and customize the `upload` and `delete` functions.
 

From 9905fd022968566171e4e337df6aa7c4458a4539 Mon Sep 17 00:00:00 2001
From: Jim LAURIE <j.laurie6993@gmail.com>
Date: Wed, 18 Jul 2018 11:57:09 +0200
Subject: [PATCH 59/65] Fix PR feedback

---
 packages/strapi/lib/hooks/index.js | 8 ++++----
 1 file changed, 4 insertions(+), 4 deletions(-)

diff --git a/packages/strapi/lib/hooks/index.js b/packages/strapi/lib/hooks/index.js
index 67bde36c42..7305f316fc 100755
--- a/packages/strapi/lib/hooks/index.js
+++ b/packages/strapi/lib/hooks/index.js
@@ -46,8 +46,8 @@ module.exports = async function() {
 
         const module = this.hook[hook].load;
 
-        if (module.beforeInitialize) {
-          await module.beforeInitialize.call(module);
+        if (module(this).beforeInitialize) {
+          await module(this).beforeInitialize.call(module);
         }
       }
     )
@@ -74,8 +74,8 @@ module.exports = async function() {
             set(this.config.hook, `settings.${hook}`, {});
           }
 
-          if (module.defaults && this.config.hook.settings[hook] !== false) {
-            defaultsDeep(this.config.hook.settings[hook], module.defaults[hook] || module.defaults);
+          if (module(this).defaults && this.config.hook.settings[hook] !== false) {
+            defaultsDeep(this.config.hook.settings[hook], module(this).defaults[hook] || module(this).defaults);
           }
 
           // Initialize array.

From 9840247d1c2bd61a2020e9a368bea7bc093e14e2 Mon Sep 17 00:00:00 2001
From: Jim LAURIE <j.laurie6993@gmail.com>
Date: Thu, 19 Jul 2018 14:46:03 +0200
Subject: [PATCH 60/65] Test generated API endpoint

---
 packages/strapi-generate-api/jest.config.js   |   5 +
 .../templates/mongoose/service.template       |   2 +-
 .../strapi-generate-api/test/endpoint.test.js | 843 ++++++++++++++++++
 .../package.json                              |   2 +-
 .../test/index.test.js                        |  34 +-
 test/helpers/auth.js                          |  26 +
 test/index.test.js                            |  15 +
 7 files changed, 912 insertions(+), 15 deletions(-)
 create mode 100644 packages/strapi-generate-api/jest.config.js
 create mode 100644 packages/strapi-generate-api/test/endpoint.test.js
 create mode 100644 test/helpers/auth.js

diff --git a/packages/strapi-generate-api/jest.config.js b/packages/strapi-generate-api/jest.config.js
new file mode 100644
index 0000000000..e8e1096d92
--- /dev/null
+++ b/packages/strapi-generate-api/jest.config.js
@@ -0,0 +1,5 @@
+module.exports = {
+  name: 'generate-api',
+  displayName: 'Generated API',
+  testMatch: ['**/test/?(*.)+(spec|test).js']
+};
diff --git a/packages/strapi-generate-api/templates/mongoose/service.template b/packages/strapi-generate-api/templates/mongoose/service.template
index 324fdedd6c..e94e72554e 100755
--- a/packages/strapi-generate-api/templates/mongoose/service.template
+++ b/packages/strapi-generate-api/templates/mongoose/service.template
@@ -83,7 +83,7 @@ module.exports = {
     const entry = await <%= globalID %>.create(data);
 
     // Create relational data and return the entry.
-    return <%= globalID %>.updateRelations({ id: entry.id, values: relations });
+    return <%= globalID %>.updateRelations({ _id: entry.id, values: relations });
   },
 
   /**
diff --git a/packages/strapi-generate-api/test/endpoint.test.js b/packages/strapi-generate-api/test/endpoint.test.js
new file mode 100644
index 0000000000..9def326869
--- /dev/null
+++ b/packages/strapi-generate-api/test/endpoint.test.js
@@ -0,0 +1,843 @@
+// Helpers.
+const {login} = require('../../../test/helpers/auth');
+const form = require('../../../test/helpers/generators');
+const restart = require('../../../test/helpers/restart');
+const rq = require('../../../test/helpers/request');
+
+const cleanDate = (entry) => {
+  delete entry.updatedAt;
+  delete entry.createdAt;
+  delete entry.created_at;
+  delete entry.updated_at;
+};
+
+let data;
+
+describe('App setup auth', () => {
+  test(
+    'Login admin user',
+    async () => {
+      await restart(rq);
+
+      const body = await login();
+
+      rq.defaults({
+        headers: {
+          'Authorization': `Bearer ${body.jwt}`
+        }
+      });
+    }
+  );
+});
+
+describe('Generate test APIs', () => {
+  beforeEach(async () => {
+    await restart(rq);
+  }, 60000);
+
+  test(
+    'Create new article API',
+    async () => {
+      await rq({
+        url: `/content-type-builder/models`,
+        method: 'POST',
+        body: form.article,
+        json: true
+      });
+    }
+  );
+  test(
+    'Create new tag API',
+    async () => {
+      await rq({
+        url: `/content-type-builder/models`,
+        method: 'POST',
+        body: form.tag,
+        json: true
+      });
+    }
+  );
+  test(
+    'Create new category API',
+    async () => {
+      await rq({
+        url: `/content-type-builder/models`,
+        method: 'POST',
+        body: form.category,
+        json: true
+      });
+    }
+  );
+  test(
+    'Create new reference API',
+    async () => {
+      await rq({
+        url: `/content-type-builder/models`,
+        method: 'POST',
+        body: form.reference,
+        json: true
+      });
+    }
+  );
+});
+
+describe('Test manyToMany relation (article - tag) with Content Manager', () => {
+  beforeAll(() => {
+    data = {
+      articles: [],
+      tags: []
+    };
+  });
+
+  beforeEach(async () => {
+    await restart(rq);
+  }, 60000);
+
+  test(
+    'Create tag1',
+    async () => {
+      let body = await rq({
+        url: `/tag`,
+        method: 'POST',
+        body: {
+          name: 'tag1'
+        },
+        json: true
+      });
+
+      data.tags.push(body);
+
+      expect(body.id);
+      expect(Array.isArray(body.articles)).toBeTruthy();
+      expect(body.name).toBe('tag1');
+    }
+  );
+  test(
+    'Create tag2',
+    async () => {
+      let body = await rq({
+        url: `/tag`,
+        method: 'POST',
+        body: {
+          name: 'tag2'
+        },
+        json: true
+      });
+
+      data.tags.push(body);
+
+      expect(body.id);
+      expect(Array.isArray(body.articles)).toBeTruthy();
+      expect(body.name).toBe('tag2');
+    }
+  );
+  test(
+    'Create tag3',
+    async () => {
+      let body = await rq({
+        url: `/tag`,
+        method: 'POST',
+        body: {
+          name: 'tag3'
+        },
+        json: true
+      });
+
+      data.tags.push(body);
+
+      expect(body.id);
+      expect(Array.isArray(body.articles)).toBeTruthy();
+      expect(body.name).toBe('tag3');
+    }
+  );
+  test(
+    'Create article1 without relation',
+    async () => {
+      const entry = {
+        title: 'Article 1',
+        content: 'My super content 1'
+      };
+
+      let body = await rq({
+        url: `/article`,
+        method: 'POST',
+        body: entry,
+        json: true
+      });
+
+      data.articles.push(body);
+
+      expect(body.id);
+      expect(body.title).toBe(entry.title);
+      expect(body.content).toBe(entry.content);
+      expect(Array.isArray(body.tags)).toBeTruthy();
+      expect(body.tags.length).toBe(0);
+    }
+  );
+  test(
+    'Create article2 with tag1',
+    async () => {
+      const entry = {
+        title: 'Article 2',
+        content: 'Content 2',
+        tags: [data.tags[0]]
+      };
+
+      let body = await rq({
+        url: `/article`,
+        method: 'POST',
+        body: entry,
+        json: true
+      });
+
+      data.articles.push(body);
+
+      expect(body.id);
+      expect(body.title).toBe(entry.title);
+      expect(body.content).toBe(entry.content);
+      expect(Array.isArray(body.tags)).toBeTruthy();
+      expect(body.tags.length).toBe(1);
+      expect(body.tags[0].id).toBe(data.tags[0].id);
+    }
+  );
+  test(
+    'Update article1 add tag2',
+    async () => {
+      const entry = Object.assign({}, data.articles[0], {
+        tags: [data.tags[1]]
+      });
+
+      cleanDate(entry);
+
+      let body = await rq({
+        url: `/article/${entry.id}`,
+        method: 'PUT',
+        body: entry,
+        json: true
+      });
+
+      data.articles[0] = body;
+
+      expect(body.id);
+      expect(body.title).toBe(entry.title);
+      expect(body.content).toBe(entry.content);
+      expect(Array.isArray(body.tags)).toBeTruthy();
+      expect(body.tags.length).toBe(1);
+      expect(body.tags[0].id).toBe(data.tags[1].id);
+    }
+  );
+  test(
+    'Update article1 add tag1 and tag3',
+    async () => {
+      const entry = Object.assign({}, data.articles[0]);
+      entry.tags.push(data.tags[0]);
+      entry.tags.push(data.tags[2]);
+
+      cleanDate(entry);
+
+      let body = await rq({
+        url: `/article/${entry.id}`,
+        method: 'PUT',
+        body: entry,
+        json: true
+      });
+
+      data.articles[0] = body;
+
+      expect(body.id);
+      expect(body.title).toBe(entry.title);
+      expect(body.content).toBe(entry.content);
+      expect(Array.isArray(body.tags)).toBeTruthy();
+      expect(body.tags.length).toBe(3);
+    }
+  );
+  test(
+    'Update article1 remove one tag',
+    async () => {
+      const entry = Object.assign({}, data.articles[0]);
+      entry.tags = entry.tags.slice(1);
+
+      cleanDate(entry);
+
+      let body = await rq({
+        url: `/article/${entry.id}`,
+        method: 'PUT',
+        body: entry,
+        json: true
+      });
+
+      data.articles[0] = body;
+
+      expect(body.id);
+      expect(body.title).toBe(entry.title);
+      expect(body.content).toBe(entry.content);
+      expect(Array.isArray(body.tags)).toBeTruthy();
+      expect(body.tags.length).toBe(2);
+    }
+  );
+  test(
+    'Update article1 remove all tag',
+    async () => {
+      const entry = Object.assign({}, data.articles[0], {
+        tags: []
+      });
+
+      cleanDate(entry);
+
+      let body = await rq({
+        url: `/article/${entry.id}`,
+        method: 'PUT',
+        body: entry,
+        json: true
+      });
+
+      data.articles[0] = body;
+
+      expect(body.id);
+      expect(body.title).toBe(entry.title);
+      expect(body.content).toBe(entry.content);
+      expect(Array.isArray(body.tags)).toBeTruthy();
+      expect(body.tags.length).toBe(0);
+    }
+  );
+});
+
+describe('Test oneToMany - manyToOne relation (article - category) with Content Manager', () => {
+  beforeAll(() => {
+    data = {
+      articles: [],
+      categories: []
+    };
+  });
+
+  beforeEach(async () => {
+    await restart(rq);
+  }, 60000);
+
+  test(
+    'Create cat1',
+    async () => {
+      let body = await rq({
+        url: `/category`,
+        method: 'POST',
+        body: {
+          name: 'cat1'
+        },
+        json: true
+      });
+
+      data.categories.push(body);
+
+      expect(body.id);
+      expect(Array.isArray(body.articles)).toBeTruthy();
+      expect(body.name).toBe('cat1');
+    }
+  );
+  test(
+    'Create cat2',
+    async () => {
+      let body = await rq({
+        url: `/category`,
+        method: 'POST',
+        body: {
+          name: 'cat2'
+        },
+        json: true
+      });
+
+      data.categories.push(body);
+
+      expect(body.id);
+      expect(Array.isArray(body.articles)).toBeTruthy();
+      expect(body.name).toBe('cat2');
+    }
+  );
+  test(
+    'Create article1 with cat1',
+    async () => {
+      const entry = {
+        title: 'Article 1',
+        content: 'Content 1',
+        category: data.categories[0]
+      };
+
+      let body = await rq({
+        url: `/article`,
+        method: 'POST',
+        body: entry,
+        json: true
+      });
+
+      data.articles.push(body);
+
+      expect(body.id);
+      expect(body.title).toBe(entry.title);
+      expect(body.content).toBe(entry.content);
+      expect(body.category.name).toBe(entry.category.name);
+      expect(Array.isArray(body.tags)).toBeTruthy();
+    }
+  );
+  test(
+    'Update article1 with cat2',
+    async () => {
+      const entry = Object.assign({}, data.articles[0], {
+        category: data.categories[1]
+      });
+
+      cleanDate(entry);
+
+      let body = await rq({
+        url: `/article/${entry.id}`,
+        method: 'PUT',
+        body: entry,
+        json: true
+      });
+
+      data.articles[0] = body;
+
+      expect(body.id);
+      expect(body.title).toBe(entry.title);
+      expect(body.content).toBe(entry.content);
+      expect(body.category.name).toBe(entry.category.name);
+      expect(Array.isArray(body.tags)).toBeTruthy();
+    }
+  );
+  test(
+    'Create article2',
+    async () => {
+      const entry = {
+        title: 'Article 2',
+        content: 'Content 2'
+      };
+
+      let body = await rq({
+        url: `/article`,
+        method: 'POST',
+        body: entry,
+        json: true
+      });
+
+      data.articles.push(body);
+
+      expect(body.id);
+      expect(body.title).toBe(entry.title);
+      expect(body.content).toBe(entry.content);
+      expect(Array.isArray(body.tags)).toBeTruthy();
+    }
+  );
+  test(
+    'Update article2 with cat2',
+    async () => {
+      const entry = Object.assign({}, data.articles[1], {
+        category: data.categories[1]
+      });
+
+      cleanDate(entry);
+
+      let body = await rq({
+        url: `/article/${entry.id}`,
+        method: 'PUT',
+        body: entry,
+        json: true
+      });
+
+      data.articles[1] = body;
+
+      expect(body.id);
+      expect(body.title).toBe(entry.title);
+      expect(body.content).toBe(entry.content);
+      expect(body.category.name).toBe(entry.category.name);
+      expect(Array.isArray(body.tags)).toBeTruthy();
+    }
+  );
+  test(
+    'Update cat1 with article1',
+    async () => {
+      const entry = Object.assign({}, data.categories[0]);
+      entry.articles.push(data.articles[0]);
+
+      cleanDate(entry);
+
+      let body = await rq({
+        url: `/category/${entry.id}`,
+        method: 'PUT',
+        body: entry,
+        json: true
+      });
+
+      data.categories[0] = body;
+
+      expect(body.id);
+      expect(Array.isArray(body.articles)).toBeTruthy();
+      expect(body.articles.length).toBe(1);
+      expect(body.name).toBe(entry.name);
+    }
+  );
+  test(
+    'Create cat3 with article1',
+    async () => {
+      const entry = {
+        name: 'cat3',
+        articles: [data.articles[0]]
+      };
+
+      let body = await rq({
+        url: `/category`,
+        method: 'POST',
+        body: entry,
+        json: true
+      });
+
+      data.categories.push(body);
+
+      expect(body.id);
+      expect(Array.isArray(body.articles)).toBeTruthy();
+      expect(body.articles.length).toBe(1);
+      expect(body.name).toBe(entry.name);
+    }
+  );
+  test(
+    'Get article1 with cat3',
+    async () => {
+      let body = await rq({
+        url: `/article/${data.articles[0].id}`,
+        method: 'GET',
+        json: true
+      });
+
+      expect(body.id);
+      expect(body.category.id).toBe(data.categories[2].id)
+    }
+  );
+  test(
+    'Get article2 with cat2',
+    async () => {
+      let body = await rq({
+        url: `/article/${data.articles[1].id}`,
+        method: 'GET',
+        json: true
+      });
+
+      expect(body.id);
+      expect(body.category.id).toBe(data.categories[1].id)
+    }
+  );
+  test(
+    'Get cat1 without relations',
+    async () => {
+      let body = await rq({
+        url: `/category/${data.categories[0].id}`,
+        method: 'GET',
+        json: true
+      });
+
+      expect(body.id);
+      expect(body.articles.length).toBe(0);
+    }
+  );
+  test(
+    'Get cat2 with article2',
+    async () => {
+      let body = await rq({
+        url: `/category/${data.categories[1].id}`,
+        method: 'GET',
+        json: true
+      });
+
+      expect(body.id);
+      expect(body.articles.length).toBe(1);
+      expect(body.articles[0].id).toBe(data.articles[1].id);
+    }
+  );
+  test(
+    'Get cat3 with article1',
+    async () => {
+      let body = await rq({
+        url: `/category/${data.categories[2].id}`,
+        method: 'GET',
+        json: true
+      });
+
+      expect(body.id);
+      expect(body.articles.length).toBe(1);
+      expect(body.articles[0].id).toBe(data.articles[0].id);
+    }
+  );
+});
+
+describe('Test oneToOne relation (article - reference) with Content Manager', () => {
+  beforeAll(() => {
+    data = {
+      articles: [],
+      references: []
+    };
+  });
+
+  beforeEach(async () => {
+    await restart(rq);
+  }, 60000);
+
+  test(
+    'Create ref1',
+    async () => {
+      let body = await rq({
+        url: `/reference`,
+        method: 'POST',
+        body: {
+          name: 'ref1'
+        },
+        json: true
+      });
+
+      data.references.push(body);
+
+      expect(body.id);
+      expect(body.name).toBe('ref1');
+    }
+  );
+  test(
+    'Create article1',
+    async () => {
+      const entry = {
+        title: 'Article 1',
+        content: 'Content 1'
+      };
+
+      let body = await rq({
+        url: `/article`,
+        method: 'POST',
+        body: entry,
+        json: true
+      });
+
+      data.articles.push(body);
+
+      expect(body.id);
+      expect(body.title).toBe(entry.title);
+      expect(body.content).toBe(entry.content);
+    }
+  );
+  test(
+    'Update article1 with ref1',
+    async () => {
+      const entry = Object.assign({}, data.articles[0], {
+        reference: data.references[0].id
+      });
+
+      cleanDate(entry);
+
+      let body = await rq({
+        url: `/article/${entry.id}`,
+        method: 'PUT',
+        body: entry,
+        json: true
+      });
+
+      data.articles[0] = body;
+
+      expect(body.id);
+      expect(body.title).toBe(entry.title);
+      expect(body.content).toBe(entry.content);
+      expect(body.reference.id).toBe(entry.reference);
+    }
+  );
+  test(
+    'Create article2 with ref1',
+    async () => {
+      const entry = {
+        title: 'Article 2',
+        content: 'Content 2',
+        reference: data.references[0].id
+      };
+
+      let body = await rq({
+        url: `/article`,
+        method: 'POST',
+        body: entry,
+        json: true
+      });
+
+      data.articles.push(body);
+
+      expect(body.id);
+      expect(body.title).toBe(entry.title);
+      expect(body.content).toBe(entry.content);
+      expect(body.reference.id).toBe(entry.reference);
+    }
+  );
+  test(
+    'Get article1 without relations',
+    async () => {
+      let body = await rq({
+        url: `/article/${data.articles[0].id}`,
+        method: 'GET',
+        json: true
+      });
+
+      expect(body.id);
+      expect(body.reference).toBe(null);
+    }
+  );
+});
+
+describe('Test oneWay relation (reference - tag) with Content Manager', () => {
+  beforeEach(async () => {
+    await restart(rq);
+  }, 60000);
+
+  test(
+    'Attach Tag to a Reference',
+    async () => {
+      const tagToCreate = await rq({
+        url: `/tag`,
+        method: 'POST',
+        json: true,
+        body: {
+          name: 'tag111'
+        }
+      });
+
+      const referenceToCreate = await rq({
+        url: `/reference`,
+        method: 'POST',
+        json: true,
+        body: {
+          name: 'cat111',
+          tag: tagToCreate
+        }
+      });
+
+      expect(referenceToCreate.tag.id).toBe(tagToCreate.id);
+    }
+  );
+
+  test(
+    'Detach Tag to a Reference',
+    async () => {
+      const tagToCreate = await rq({
+        url: `/tag`,
+        method: 'POST',
+        json: true,
+        body: {
+          name: 'tag111'
+        }
+      });
+
+      const referenceToCreate = await rq({
+        url: `/reference`,
+        method: 'POST',
+        json: true,
+        body: {
+          name: 'cat111',
+          tag: tagToCreate
+        }
+      });
+
+      expect(referenceToCreate.tag.id).toBe(tagToCreate.id);
+
+      const referenceToUpdate = await rq({
+        url: `/reference/${referenceToCreate.id}`,
+        method: 'PUT',
+        json: true,
+        body: {
+          tag: null
+        }
+      });
+
+      expect(referenceToUpdate.tag).toBe(null);
+    }
+  );
+
+  test(
+    'Delete Tag so the relation in the Reference side should be removed',
+    async () => {
+      const tagToCreate = await rq({
+        url: `/tag`,
+        method: 'POST',
+        json: true,
+        body: {
+          name: 'tag111'
+        }
+      });
+
+      const referenceToCreate = await rq({
+        url: `/reference`,
+        method: 'POST',
+        json: true,
+        body: {
+          name: 'cat111',
+          tag: tagToCreate
+        }
+      });
+
+      const tagToDelete = await rq({
+        url: `/tag/${tagToCreate.id}`,
+        method: 'DELETE',
+        json: true
+      });
+
+      const referenceToGet = await rq({
+        url: `/reference/${referenceToCreate.id}`,
+        method: 'GET',
+        json: true
+      });
+
+      try {
+        if (Object.keys(referenceToGet.tag).length == 0) {
+          referenceToGet.tag = null;
+        }
+      } catch(err) {
+        // Silent
+      }
+
+      expect(referenceToGet.tag).toBe(null);
+    }
+  );
+});
+
+describe('Delete test APIs', () => {
+  beforeEach(async () => {
+    await restart(rq);
+  }, 60000);
+
+  test(
+    'Delete article API',
+    async () => {
+      await rq({
+        url: `/content-type-builder/models/article`,
+        method: 'DELETE',
+        json: true
+      });
+    }
+  );
+  test(
+    'Delete tag API',
+    async () => {
+      await rq({
+        url: `/content-type-builder/models/tag`,
+        method: 'DELETE',
+        json: true
+      });
+    }
+  );
+  test(
+    'Delete category API',
+    async () => {
+      await rq({
+        url: `/content-type-builder/models/category`,
+        method: 'DELETE',
+        json: true
+      });
+    }
+  );
+  test(
+    'Delete reference API',
+    async () => {
+      await rq({
+        url: `/content-type-builder/models/reference`,
+        method: 'DELETE',
+        json: true
+      });
+    }
+  );
+});
diff --git a/packages/strapi-plugin-content-manager/package.json b/packages/strapi-plugin-content-manager/package.json
index af4cfd290f..28bd99b5c4 100755
--- a/packages/strapi-plugin-content-manager/package.json
+++ b/packages/strapi-plugin-content-manager/package.json
@@ -51,4 +51,4 @@
     "npm": ">= 5.0.0"
   },
   "license": "MIT"
-}
+}
\ No newline at end of file
diff --git a/packages/strapi-plugin-content-manager/test/index.test.js b/packages/strapi-plugin-content-manager/test/index.test.js
index 0280307f05..74194bb832 100644
--- a/packages/strapi-plugin-content-manager/test/index.test.js
+++ b/packages/strapi-plugin-content-manager/test/index.test.js
@@ -1,4 +1,5 @@
 // Helpers.
+const {login} = require('../../../test/helpers/auth');
 const form = require('../../../test/helpers/generators');
 const restart = require('../../../test/helpers/restart');
 const rq = require('../../../test/helpers/request');
@@ -14,18 +15,11 @@ let data;
 
 describe('App setup auth', () => {
   test(
-    'Register admin user',
+    'Login admin user',
     async () => {
-      const body = await rq({
-        url: `/auth/local/register`,
-        method: 'POST',
-        body: {
-          username: 'admin',
-          email: 'admin@strapi.io',
-          password: 'pcw123'
-        },
-        json: true
-      });
+      await restart(rq);
+
+      const body = await login();
 
       rq.defaults({
         headers: {
@@ -881,8 +875,12 @@ describe('Test oneWay relation (reference - tag) with Content Manager', () => {
         json: true
       });
 
-      if (Object.keys(referenceToGet.tag).length == 0) {
-        referenceToGet.tag = null;
+      try {
+        if (Object.keys(referenceToGet.tag).length == 0) {
+          referenceToGet.tag = null;
+        }
+      } catch(err) {
+        // Silent
       }
 
       expect(referenceToGet.tag).toBe(null);
@@ -925,4 +923,14 @@ describe('Delete test APIs', () => {
       });
     }
   );
+  test(
+    'Delete reference API',
+    async () => {
+      await rq({
+        url: `/content-type-builder/models/reference`,
+        method: 'DELETE',
+        json: true
+      });
+    }
+  );
 });
diff --git a/test/helpers/auth.js b/test/helpers/auth.js
new file mode 100644
index 0000000000..8b8f333499
--- /dev/null
+++ b/test/helpers/auth.js
@@ -0,0 +1,26 @@
+const rq = require('./request');
+
+const auth = {
+  username: 'admin',
+  email: 'admin@strapi.io',
+  password: 'pcw123'
+};
+
+module.exports = {
+  auth,
+  login: () => {
+    return new Promise(async (resolve) => {
+      const body = await rq({
+        url: `/auth/local`,
+        method: 'POST',
+        body: {
+          identifier: auth.email,
+          password: auth.password
+        },
+        json: true
+      });
+
+      resolve(body);
+    });
+  }
+};
diff --git a/test/index.test.js b/test/index.test.js
index 932f771690..0ec226a7ea 100644
--- a/test/index.test.js
+++ b/test/index.test.js
@@ -1,3 +1,6 @@
+const {auth} = require('./helpers/auth');
+const rq = require('./helpers/request');
+
 describe('Initialize', () => {
   test(
     'Avoid failure',
@@ -5,4 +8,16 @@ describe('Initialize', () => {
       expect(true).toBeTruthy();
     }
   );
+
+  test(
+    'Register admin user',
+    async () => {
+      await rq({
+        url: `/auth/local/register`,
+        method: 'POST',
+        body: auth,
+        json: true
+      });
+    }
+  );
 });

From 269e9390100b4b7bde8c0be4d73be029792065de Mon Sep 17 00:00:00 2001
From: Pierre Burgy <pierre.burgy@gmail.com>
Date: Thu, 19 Jul 2018 18:40:29 +0200
Subject: [PATCH 61/65] Add job offer

---
 README.md | 16 ++++++++++++++--
 1 file changed, 14 insertions(+), 2 deletions(-)

diff --git a/README.md b/README.md
index d08a19d2ab..f7beeb6e72 100755
--- a/README.md
+++ b/README.md
@@ -1,4 +1,12 @@
-<p align="center"><img src="https://blog.strapi.io/content/images/2017/10/logo.png" width="318px" /></p>
+<p align="center"><strong>We're hiring!</strong> Located in Paris 🇫🇷 and dreaming of being full-time on Strapi? <a href="https://strapi.io/company#looking-for-talents">Join us</a>!</p>
+
+---
+
+<p align="center">
+  <a href="https://strapi.io">
+    <img src="https://blog.strapi.io/content/images/2017/10/logo.png" width="318px" alt="Strapi logo" />
+  </a>
+</p>
 <h3 align="center">API creation made simple, secure and fast.</h3>
 <p align="center">The most advanced open-source Content Management Framework to build powerful API with no effort.</p>
 <br />
@@ -19,7 +27,11 @@
 
 <br>
 
-<p align="center"><img src="https://blog.strapi.io/content/images/2017/10/Github-Preview.png" /></p>
+<p align="center">
+  <a href="https://strapi.io">
+    <img src="https://blog.strapi.io/content/images/2017/10/Github-Preview.png" />
+  </a>
+</p>
 
 <br>
 

From 3ac0ec1149c939cb17fe4a90b9b530afea9f1c99 Mon Sep 17 00:00:00 2001
From: Pierre Burgy <pierre.burgy@gmail.com>
Date: Fri, 20 Jul 2018 10:55:26 +0200
Subject: [PATCH 62/65] Indent Readme

---
 README.md | 5 ++++-
 1 file changed, 4 insertions(+), 1 deletion(-)

diff --git a/README.md b/README.md
index f7beeb6e72..8d8a1610c0 100755
--- a/README.md
+++ b/README.md
@@ -1,4 +1,7 @@
-<p align="center"><strong>We're hiring!</strong> Located in Paris 🇫🇷 and dreaming of being full-time on Strapi? <a href="https://strapi.io/company#looking-for-talents">Join us</a>!</p>
+<p align="center">
+  <strong>We're hiring!</strong> Located in Paris 🇫🇷 and dreaming of being full-time on Strapi?
+  <a href="https://strapi.io/company#looking-for-talents">Join us</a>!
+</p>
 
 ---
 

From f108494cd9b4fc95cc95f06d1bb82e3c78625d64 Mon Sep 17 00:00:00 2001
From: Kati Frantz <frantzenterprises777@gmail.com>
Date: Thu, 19 Jul 2018 18:42:59 +0100
Subject: [PATCH 63/65] update connect function to check for duplicate email
 and not provider

---
 .../strapi-plugin-users-permissions/services/Providers.js     | 4 +++-
 1 file changed, 3 insertions(+), 1 deletion(-)

diff --git a/packages/strapi-plugin-users-permissions/services/Providers.js b/packages/strapi-plugin-users-permissions/services/Providers.js
index a7f32886a1..b2ea84b495 100644
--- a/packages/strapi-plugin-users-permissions/services/Providers.js
+++ b/packages/strapi-plugin-users-permissions/services/Providers.js
@@ -46,7 +46,9 @@ exports.connect = (provider, query) => {
 
       try {
         const users = await strapi.query('user', 'users-permissions').find({
-          email: profile.email
+          where: {
+            email: profile.email
+          }
         });
 
         const advanced = await strapi.store({

From aba7de44ce99ab90724af8b8a983252f84302a1d Mon Sep 17 00:00:00 2001
From: Jim LAURIE <j.laurie6993@gmail.com>
Date: Fri, 20 Jul 2018 15:09:14 +0200
Subject: [PATCH 64/65] Fix delete uploaded file SQL fix #1459

---
 packages/strapi-plugin-upload/services/Upload.js | 3 ++-
 1 file changed, 2 insertions(+), 1 deletion(-)

diff --git a/packages/strapi-plugin-upload/services/Upload.js b/packages/strapi-plugin-upload/services/Upload.js
index cef660041e..1b28422278 100644
--- a/packages/strapi-plugin-upload/services/Upload.js
+++ b/packages/strapi-plugin-upload/services/Upload.js
@@ -101,6 +101,8 @@ module.exports = {
   },
 
   remove: async (params, config) => {
+    params.id = (params._id || params.id);
+
     const file = await strapi.plugins['upload'].services.upload.fetch(params);
 
     // get upload provider settings to configure the provider to use
@@ -116,7 +118,6 @@ module.exports = {
     // Use Content Manager business logic to handle relation.
     if (strapi.plugins['content-manager']) {
       params.model = 'file';
-      params.id = (params._id || params.id);
 
       await strapi.plugins['content-manager'].services['contentmanager'].delete(params, {source: 'upload'});
     }

From 83b032e9b360c106557a1286fc552f09058fa0c3 Mon Sep 17 00:00:00 2001
From: Jim LAURIE <j.laurie6993@gmail.com>
Date: Fri, 20 Jul 2018 17:20:06 +0200
Subject: [PATCH 65/65] Fix udpate file SQL via content manager fix #1461

---
 packages/strapi-hook-bookshelf/lib/relations.js | 16 +++++++++-------
 1 file changed, 9 insertions(+), 7 deletions(-)

diff --git a/packages/strapi-hook-bookshelf/lib/relations.js b/packages/strapi-hook-bookshelf/lib/relations.js
index 57ab4bf757..4b3083bad9 100644
--- a/packages/strapi-hook-bookshelf/lib/relations.js
+++ b/packages/strapi-hook-bookshelf/lib/relations.js
@@ -10,15 +10,17 @@ const _ = require('lodash');
 // Utils
 const { models: { getValuePrimaryKey } } = require('strapi-utils');
 
-const transformToArrayID = (array) => {
+const transformToArrayID = (array, association) => {
   if(_.isArray(array)) {
-    return array.map(value => {
+    array = array.map(value => {
       if (_.isPlainObject(value)) {
-        return value._id || value.id;
+        return value._id || value.id || false;
       }
 
       return value;
     });
+
+    return array.filter(n => n);
   }
 
   if (association.type === 'model' || (association.type === 'collection' && _.isObject(array))) {
@@ -140,8 +142,8 @@ module.exports = {
           case 'manyToMany':
             if (response[current] && _.isArray(response[current]) && current !== 'id') {
               // Compare array of ID to find deleted files.
-              const currentValue = transformToArrayID(response[current]).map(id => id.toString());
-              const storedValue = transformToArrayID(params.values[current]).map(id => id.toString());
+              const currentValue = transformToArrayID(response[current], association).map(id => id.toString());
+              const storedValue = transformToArrayID(params.values[current], association).map(id => id.toString());
 
               const toAdd = _.difference(storedValue, currentValue);
               const toRemove = _.difference(currentValue, storedValue);
@@ -229,8 +231,8 @@ module.exports = {
           case 'oneToManyMorph':
           case 'manyToManyMorph': {
             // Compare array of ID to find deleted files.
-            const currentValue = transformToArrayID(response[current]).map(id => id.toString());
-            const storedValue = transformToArrayID(params.values[current]).map(id => id.toString());
+            const currentValue = transformToArrayID(response[current], association).map(id => id.toString());
+            const storedValue = transformToArrayID(params.values[current], association).map(id => id.toString());
 
             const toAdd = _.difference(storedValue, currentValue);
             const toRemove = _.difference(currentValue, storedValue);