Fix conflicts

packages/strapi-admin/admin/src/app.js

@@ -7,12 +7,10 @@
 import 'babel-polyfill';
 
 // Import all the third party stuff
-import React from 'react';
-import ReactDOM from 'react-dom';
 import { Provider } from 'react-redux';
 import { ConnectedRouter } from 'react-router-redux';
 import createHistory from 'history/createBrowserHistory';
-import _ from 'lodash';
+import { merge, isFunction } from 'lodash';
 import 'sanitize.css/sanitize.css';
 import 'whatwg-fetch';
 
@@ -79,14 +77,19 @@ window.onload = function onLoad() {
  * @param params
  */
 const registerPlugin = (plugin) => {
-  const formattedPlugin = plugin;
-
   // Merge admin translation messages
-  _.merge(translationMessages, formattedPlugin.translationMessages);
+  merge(translationMessages, plugin.translationMessages);
 
-  formattedPlugin.leftMenuSections = formattedPlugin.leftMenuSections || [];
+  plugin.leftMenuSections = plugin.leftMenuSections || [];
 
-  store.dispatch(pluginLoaded(formattedPlugin));
+  // Execute bootstrap function.
+  if (isFunction(plugin.bootstrap)) {
+    plugin.bootstrap(plugin).then(plugin => {
+      store.dispatch(pluginLoaded(plugin));
+    });
+  } else {
+    store.dispatch(pluginLoaded(plugin));
+  }
 };
 
 const displayNotification = (message, status) => {
@@ -116,7 +119,7 @@ window.Strapi = {
   apiUrl,
   refresh: (pluginId) => ({
     translationMessages: (translationMessagesUpdated) => {
-      render(_.merge({}, translationMessages, translationMessagesUpdated));
+      render(merge({}, translationMessages, translationMessagesUpdated));
     },
     leftMenuSections: (leftMenuSectionsUpdated) => {
       store.dispatch(updatePlugin(pluginId, 'leftMenuSections', leftMenuSectionsUpdated));

packages/strapi-admin/admin/src/components/Header/index.js

@@ -4,8 +4,6 @@
 *
 */
 
-import React from 'react';
-
 import styles from './styles.scss';
 
 class Header extends React.Component { // eslint-disable-line react/prefer-stateless-function

packages/strapi-admin/admin/src/components/LeftMenuFooter/index.js

@@ -4,7 +4,6 @@
 *
 */
 
-import React from 'react';
 import { defineMessages, FormattedMessage } from 'react-intl';
 
 import LocaleToggle from 'containers/LocaleToggle';

packages/strapi-admin/admin/src/components/LeftMenuFooter/styles.scss

@@ -6,11 +6,17 @@
   width: 100%;
   bottom: 0;
   height: 3rem;
-  padding-left: 1rem;
-  padding-right: 1rem;
+  padding-left: 15px;
+  padding-right: 15px;
   line-height: 3rem;
+  font-family: 'Lato';
+  font-size: 1rem;
+  font-weight: 300;
+  letter-spacing: 0.05rem;
   vertical-align: middle;
   color: $strapi-gray-light;
-  border-top: 1px solid $strapi-gray;
-  font-size: $font-size-xs;
+
+  select{
+    outline: none;
+  }
 }

packages/strapi-admin/admin/src/components/LeftMenuHeader/index.js

@@ -4,7 +4,6 @@
 *
 */
 
-import React from 'react';
 import { Link } from 'react-router-dom';
 
 import styles from './styles.scss';

packages/strapi-admin/admin/src/components/LeftMenuLink/index.js

@@ -5,7 +5,7 @@
  */
 
 import _ from 'lodash';
-import React from 'react';
+import PropTypes from 'prop-types';
 import { FormattedMessage } from 'react-intl';
 import { Link } from 'react-router-dom';
 
@@ -21,7 +21,14 @@ class LeftMenuLink extends React.Component { // eslint-disable-line react/prefer
       <li className={styles.item}>
         <Link className={`${styles.link} ${isLinkActive ? styles.linkActive : ''}`} to={this.props.destination}>
           <i className={`${styles.linkIcon} fa-${this.props.icon} fa`}></i>
-          <FormattedMessage id={this.props.label} className={styles.linkLabel} />
+          <FormattedMessage
+            id={this.props.label}
+            defaultMessage='{label}'
+            values={{
+              label: this.props.label,
+            }}
+            className={styles.linkLabel}
+          />
         </Link>
       </li>
     );
@@ -29,9 +36,9 @@ class LeftMenuLink extends React.Component { // eslint-disable-line react/prefer
 }
 
 LeftMenuLink.propTypes = {
-  destination: React.PropTypes.string.isRequired,
-  icon: React.PropTypes.string.isRequired,
-  label: React.PropTypes.string.isRequired,
+  destination: PropTypes.string.isRequired,
+  icon: PropTypes.string.isRequired,
+  label: PropTypes.string.isRequired,
 };
 
 export default LeftMenuLink;

packages/strapi-admin/admin/src/components/LeftMenuLinkContainer/index.js

@@ -4,7 +4,7 @@
  *
  */
 
-import React from 'react';
+import PropTypes from 'prop-types';
 import { FormattedMessage } from 'react-intl';
 import { map } from 'lodash';
 
@@ -16,17 +16,17 @@ import messages from './messages.json';
 class LeftMenuLinkContainer extends React.Component { // eslint-disable-line react/prefer-stateless-function
   render() {
     // Generate the list of sections
-    const linkSections = this.props.plugins.valueSeq().map(plugin => (
-      plugin.get('leftMenuSections').map((leftMenuSection, j) => {
-        return (
-          <div key={j}>
-            <p className={styles.title}>{leftMenuSection.get('name')}</p>
-            <ul className={styles.list}>
-              {map(this.links, (link, k) => <LeftMenuLink key={k} icon={link.get('icon') || 'link'} label={link.get('label')} destination={`/plugins/${plugin.get('id')}/${link.get('destination')}`} /> )}
-            </ul>
-          </div>
-        );
-      })
+    const linkSections = map(this.props.plugins.toJS(), plugin => (
+      plugin.leftMenuSections.map((leftMenuSection, j) => (
+        <div key={j}>
+          <p className={styles.title}>{leftMenuSection.name}</p>
+          <ul className={styles.list}>
+            {leftMenuSection.links.map((link, k) =>
+              <LeftMenuLink key={k} icon={link.icon || 'link'} label={link.label} destination={`/plugins/${plugin.id}/${link.destination}`} />
+            )}
+          </ul>
+        </div>
+      ))
     ));
 
     // Check if the plugins list is empty or not
@@ -80,7 +80,7 @@ class LeftMenuLinkContainer extends React.Component { // eslint-disable-line rea
 }
 
 LeftMenuLinkContainer.propTypes = {
-  plugins: React.PropTypes.object.isRequired,
+  plugins: PropTypes.object.isRequired,
 };
 
 export default LeftMenuLinkContainer;

packages/strapi-admin/admin/src/components/Notification/index.js

@@ -4,7 +4,7 @@
  *
  */
 
-import React from 'react';
+import PropTypes from 'prop-types';
 import { FormattedMessage } from 'react-intl';
 
 import styles from './styles.scss';
@@ -53,8 +53,8 @@ class Notification extends React.Component { // eslint-disable-line react/prefer
 }
 
 Notification.propTypes = {
-  notification: React.PropTypes.object.isRequired,
-  onHideNotification: React.PropTypes.func.isRequired,
+  notification: PropTypes.object.isRequired,
+  onHideNotification: PropTypes.func.isRequired,
 };
 
 export default Notification;

packages/strapi-admin/admin/src/components/Notification/styles.scss

@@ -4,69 +4,71 @@
 .notification {
   position: relative;
   display: flex;
-  width: 28.6rem;
   align-items: stretch;
+  width: 300px;
+  min-height: 60px;
+  margin-bottom: 14px;
   background: $white;
-  margin-bottom: 1.4rem;
-  transition: all 0.2s ease;
-  border-radius: 0.1rem;
+  border-radius: 2px;
   box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.15);
   color: #333740;
+  transition: all 0.15s ease;
+  overflow: hidden;
 }
 
 .notification:hover {
-  box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.5);
+  cursor: pointer;
+  box-shadow: 0 1px 5px 0 rgba(0, 0, 0, 0.2);
 }
 
 .notificationIcon {
   position: relative;
   display: block;
-  width: 18%;
+  width: 60px;
   text-align: center;
   font-size: 2.4rem;
 
   &:before {
     position: absolute;
-    top: calc(50% - 1rem);
-    left: calc(50% - 1rem);
+    top: calc(50% - 10px); left: calc(50% - 10px);
+    width: 20px;
+    height: 20px;
+    padding-top: 4px;
     border-radius: 100%;
     border: 1px solid $brand-success;
     color: $brand-success;
-    height: 2rem;
-    width: 2rem;
     font-size: 1.2rem;
-    padding-top: .3rem;
-    padding-left: 0.1rem;
     text-align: center;
   }
 }
 
 .notificationContent {
-  display: block;
+  display: flex;
+  align-items: center;
+  width: 220px;
   margin: 0;
-  padding-top: 1.5rem;
-  padding-bottom: 1.5rem;
-  padding-right: 1rem;
+  padding-right: 10px;
   border-right: 1px solid rgba(255, 255, 255, 0.3);
-  width: 70%;
 }
 
 .notificationTitle {
-  font-weight: 500;
-  font-size: 1.4rem;
   margin-bottom: 0;
+  font-size: 1.4rem;
+  font-weight: 400;
+  line-height: 1.8rem;
 }
 
 
 .notificationClose {
+  cursor: pointer;
+  opacity: 0.6;
   position: relative;
   display: block;
-  cursor: pointer;
-  width: 12%;
-  opacity: 0.6;
-  transition: opacity 0.1s ease;
+
+  width: 20px;
   font-size: 1.6rem;
-  color: #c2c4c7;
+  color: #BBC2BF;
+  transition: opacity 0.1s ease;
 
   &:hover {
     opacity: 1;
@@ -74,28 +76,39 @@
 
   &:before {
     position: absolute;
-    top: calc(50% - .9rem);
-    left: calc(50% - 0.5rem);
+    top: calc(50% - 6px);
+    height: 100%;
+    font-size: 1.4rem;
   }
 }
 
+.notificationSuccess{
+  background: linear-gradient(100deg , #FFFFFF 50%, rgba(39, 183, 15, .05)), $white;
+}
+
 .notificationWarning {
+  background: linear-gradient(100deg , #FFFFFF 50%, rgba(250, 156, 0, .05)), $white;
+
   .notificationIcon:before {
+    padding-top: 4px;
     border-color: $brand-warning;
     color: $brand-warning;
-    padding-top: .4rem;
   }
 }
 
 .notificationError {
+  background: linear-gradient(100deg , #FFFFFF 50%, rgba(255, 93, 0, .05)), $white;
+
   .notificationIcon:before {
+    padding-top: 4px;
     border-color: $brand-danger;
     color: $brand-danger;
-    padding-top: .4rem;
   }
 }
 
 .notificationInfo {
+  background: linear-gradient(100deg , #FFFFFF 50%, rgba(28, 93, 231, .05)), $white;
+
   .notificationIcon:before {
     border-color: $brand-primary;
     color: $brand-primary;

packages/strapi-admin/admin/src/components/NotificationsContainer/index.js

@@ -4,42 +4,47 @@
 *
 */
 
-import React from 'react';
-import ReactCSSTransitionGroup from 'react/lib/ReactCSSTransitionGroup';
+import PropTypes from 'prop-types';
 import Notification from 'components/Notification';
 
 import styles from './styles.scss';
 
+const { CSSTransition, TransitionGroup } = ReactTransitionGroup;
+
 class NotificationsContainer extends React.Component { // eslint-disable-line react/prefer-stateless-function
   render() {
-    let notifications;
+    if (this.props.notifications.length === 0) {
+      return (false);
+    }
 
-    if (this.props.notifications) {
-      notifications = this.props.notifications.map((notification) => (
+    const notifications = this.props.notifications.map((notification, i) => (
+      <CSSTransition
+        key={i}
+        classNames="notification"
+        timeout={{
+          enter: 500,
+          exit: 300,
+        }}
+      >
         <Notification
           key={notification.id}
           onHideNotification={this.props.onHideNotification}
           notification={notification}
-        />));
-    }
+        />
+      </CSSTransition>
+    ));
 
     return (
-      <ul className={styles.notificationsContainer}>
-        <ReactCSSTransitionGroup
-          transitionName="notification"
-          transitionEnterTimeout={0}
-          transitionLeaveTimeout={0}
-        >
-          {notifications}
-        </ReactCSSTransitionGroup>
-      </ul>
+      <TransitionGroup className={styles.notificationsContainer}>
+        {notifications}
+      </TransitionGroup>
     );
   }
 }
 
 NotificationsContainer.propTypes = {
-  notifications: React.PropTypes.object.isRequired,
-  onHideNotification: React.PropTypes.func.isRequired,
+  notifications: PropTypes.object.isRequired,
+  onHideNotification: PropTypes.func.isRequired,
 };
 
 export default NotificationsContainer;

packages/strapi-admin/admin/src/components/NotificationsContainer/styles.scss

@@ -3,8 +3,8 @@
 
 .notificationsContainer { /* stylelint-disable */
   position: absolute;
-  top: 7rem;
-  right: 1rem;
+  top: 72px;
+  right: 15px;
   z-index: 1000;
   list-style: none;
 }

packages/strapi-admin/admin/src/components/Toggle/index.js

@@ -4,7 +4,7 @@
 *
 */
 
-import React from 'react';
+import PropTypes from 'prop-types';
 
 import ToggleOption from 'components/ToggleOption';
 
@@ -28,10 +28,10 @@ function Toggle(props) { // eslint-disable-line react/prefer-stateless-function
 }
 
 Toggle.propTypes = {
-  messages: React.PropTypes.object.isRequired,
-  onToggle: React.PropTypes.func.isRequired,
-  value: React.PropTypes.string.isRequired,
-  values: React.PropTypes.array.isRequired,
+  messages: PropTypes.object.isRequired,
+  onToggle: PropTypes.func.isRequired,
+  value: PropTypes.string.isRequired,
+  values: PropTypes.array.isRequired,
 };
 
 export default Toggle;

packages/strapi-admin/admin/src/components/ToggleOption/index.js

@@ -4,7 +4,7 @@
 *
 */
 
-import React from 'react';
+import PropTypes from 'prop-types';
 import { injectIntl, intlShape } from 'react-intl';
 
 const ToggleOption = ({ value, message, intl }) => (
@@ -15,11 +15,11 @@ const ToggleOption = ({ value, message, intl }) => (
 
 ToggleOption.propTypes = {
   intl: intlShape.isRequired,
-  message: React.PropTypes.oneOfType([
-    React.PropTypes.object.isRequired,
-    React.PropTypes.string.isRequired,
+  message: PropTypes.oneOfType([
+    PropTypes.object.isRequired,
+    PropTypes.string.isRequired,
   ]).isRequired,
-  value: React.PropTypes.string.isRequired,
+  value: PropTypes.string.isRequired,
 };
 
 export default injectIntl(ToggleOption);

packages/strapi-admin/admin/src/containers/AdminPage/index.js

@@ -9,7 +9,7 @@
  * the linting exception.
  */
 
-import React from 'react';
+import PropTypes from 'prop-types';
 import { connect } from 'react-redux';
 import { createStructuredSelector } from 'reselect';
 import { Switch, Route } from 'react-router-dom';
@@ -26,7 +26,7 @@ import { hideNotification } from 'containers/NotificationProvider/actions';
 
 import Header from 'components/Header/index';
 
-import styles from './syles.scss';
+import styles from './styles.scss';
 
 export class AdminPage extends React.Component { // eslint-disable-line react/prefer-stateless-function
   render() {
@@ -53,11 +53,11 @@ export class AdminPage extends React.Component { // eslint-disable-line react/pr
 }
 
 AdminPage.contextTypes = {
-  router: React.PropTypes.object.isRequired,
+  router: PropTypes.object.isRequired,
 };
 
 AdminPage.propTypes = {
-  plugins: React.PropTypes.object.isRequired,
+  plugins: PropTypes.object.isRequired,
 };
 
 const mapStateToProps = createStructuredSelector({

packages/strapi-admin/admin/src/containers/App/index.js

@@ -11,7 +11,7 @@
  * the linting exception.
  */
 
-import React from 'react';
+import PropTypes from 'prop-types';
 import { Switch, Route } from 'react-router-dom';
 
 import AdminPage from 'containers/AdminPage';
@@ -20,6 +20,7 @@ import NotFoundPage from 'containers/NotFoundPage';
 import NotificationProvider from 'containers/NotificationProvider';
 
 import '../../styles/main.scss';
+
 import styles from './styles.scss';
 
 export class App extends React.Component { // eslint-disable-line react/prefer-stateless-function
@@ -39,7 +40,7 @@ export class App extends React.Component { // eslint-disable-line react/prefer-s
 }
 
 App.contextTypes = {
-  router: React.PropTypes.object.isRequired,
+  router: PropTypes.object.isRequired,
 };
 
 App.propTypes = {};

packages/strapi-admin/admin/src/containers/ComingSoonPage/index.js

@@ -4,21 +4,33 @@
  *
  */
 
-import React from 'react';
 import { connect } from 'react-redux';
 import Helmet from 'react-helmet';
-import { FormattedMessage } from 'react-intl';
-import messages from './messages.json';
+
+import PluginHeader from 'components/PluginHeader';
+
 import styles from './styles.scss';
 
 export class ComingSoonPage extends React.Component { // eslint-disable-line react/prefer-stateless-function
   render() {
     return (
-      <div className={styles.wrapper}>
+      <div>
         <Helmet
           title="Coming soon"
         />
-        <p><FormattedMessage {...messages.comingSoon} />.</p>
+        <div>
+          <div className={`container-fluid ${styles.containerFluid}`}>
+            <PluginHeader
+              title={{
+                id: 'app.components.ComingSoonPage.comingSoon',
+              }}
+              description={{
+                id: 'app.components.ComingSoonPage.featuresNotAvailable',
+              }}
+              actions={[]}
+            />
+          </div>
+        </div>
       </div>
     );
   }

packages/strapi-admin/admin/src/containers/ComingSoonPage/styles.scss

@@ -1,3 +1,4 @@
-.wrapper {
-  padding: 2.3rem;
+.containerFluid { /* stylelint-disable */
+  padding: 18px 30px !important;
+  overflow: hidden;
 }

packages/strapi-admin/admin/src/containers/Content/index.js

@@ -4,7 +4,7 @@
  *
  */
 
-import React from 'react';
+import PropTypes from 'prop-types';
 import { connect } from 'react-redux';
 import { createSelector } from 'reselect';
 
@@ -23,7 +23,7 @@ export class Content extends React.Component { // eslint-disable-line react/pref
 }
 
 Content.propTypes = {
-  children: React.PropTypes.node.isRequired,
+  children: PropTypes.node.isRequired,
 };
 
 const mapStateToProps = createSelector(

packages/strapi-admin/admin/src/containers/HomePage/index.js

@@ -4,7 +4,6 @@
  *
  */
 
-import React from 'react';
 import { connect } from 'react-redux';
 import Helmet from 'react-helmet';
 import { FormattedMessage } from 'react-intl';

packages/strapi-admin/admin/src/containers/LanguageProvider/index.js

@@ -6,7 +6,7 @@
  * IntlProvider component and i18n messages (loaded from `app/translations`)
  */
 
-import React from 'react';
+import PropTypes from 'prop-types';
 import { connect } from 'react-redux';
 import { createSelector } from 'reselect';
 import { IntlProvider } from 'react-intl';
@@ -23,9 +23,9 @@ export class LanguageProvider extends React.Component { // eslint-disable-line r
 }
 
 LanguageProvider.propTypes = {
-  children: React.PropTypes.element.isRequired,
-  locale: React.PropTypes.string.isRequired,
-  messages: React.PropTypes.object.isRequired,
+  children: PropTypes.element.isRequired,
+  locale: PropTypes.string.isRequired,
+  messages: PropTypes.object.isRequired,
 };
 
 

packages/strapi-admin/admin/src/containers/LeftMenu/index.js

@@ -4,7 +4,7 @@
  *
  */
 
-import React from 'react';
+import PropTypes from 'prop-types';
 import { connect } from 'react-redux';
 
 import LeftMenuHeader from 'components/LeftMenuHeader';
@@ -26,7 +26,7 @@ export class LeftMenu extends React.Component { // eslint-disable-line react/pre
 }
 
 LeftMenu.propTypes = {
-  plugins: React.PropTypes.object.isRequired,
+  plugins: PropTypes.object.isRequired,
 };
 
 function mapDispatchToProps(dispatch) {

packages/strapi-admin/admin/src/containers/LocaleToggle/index.js

@@ -4,7 +4,7 @@
  *
  */
 
-import React from 'react';
+import PropTypes from 'prop-types';
 import { connect } from 'react-redux';
 import { createSelector } from 'reselect';
 
@@ -32,8 +32,8 @@ export class LocaleToggle extends React.Component { // eslint-disable-line
 }
 
 LocaleToggle.propTypes = {
-  locale: React.PropTypes.string.isRequired,
-  onLocaleToggle: React.PropTypes.func.isRequired,
+  locale: PropTypes.string.isRequired,
+  onLocaleToggle: PropTypes.func.isRequired,
 };
 
 const mapStateToProps = createSelector(

packages/strapi-admin/admin/src/containers/NotFoundPage/index.js

@@ -9,9 +9,10 @@
  * the linting exception.
  */
 
-import React from 'react';
+import PropTypes from 'prop-types';
 import { defineMessages, FormattedMessage } from 'react-intl';
-import { Link } from 'react-router-dom';
+
+import Button from 'components/Button';
 
 import styles from './styles.scss';
 import messages from './messages.json';
@@ -28,8 +29,23 @@ export default class NotFound extends React.Component { // eslint-disable-line r
         <h2 className={styles.notFoundDescription}>
           <FormattedMessage {...messages.description} />
         </h2>
-        <Link to="/admin">Back to home page.</Link>
+        <Button
+          label="app.components.NotFoundPage.back"
+          handlei18n
+          buttonBackground="back"
+          onClick={(e) => {
+            e.stopPropagation();
+
+            this.props.history.goBack();
+          }}
+        />
       </div>
     );
   }
 }
+
+NotFound.propTypes = {
+  history: PropTypes.shape({
+    goBack: PropTypes.func.isRequired,
+  }).isRequired,
+};

packages/strapi-admin/admin/src/containers/NotFoundPage/styles.scss

@@ -2,24 +2,29 @@
 @import "../../styles/variables/variables";
 
 .notFound { /* stylelint-ignore */
-  height: 100vh;
-  background: $strapi-blue-darker;
   display: -webkit-flex;
   display: flex;
   flex-direction: column;
   align-items: center;
   justify-content: center;
-}
+  padding-top: 114px;
 
-.notFoundTitle {
-  color: $white;
-  font-size: 20rem;
-  margin-bottom: 2rem;
-  text-shadow: 0 1rem 4rem rgba(255, 255, 255, 0.8);
-  letter-spacing: 2rem;
-}
+  h1{
+    margin-bottom: 12px;
+    text-shadow: 0 1rem 4rem rgba(255, 255, 255, 0.8);
+    color: #2C3138;
+    font-size: 6.4rem;
+    letter-spacing: 2px;
+  }
 
-.notFoundDescription {
-  color: $white;
-  margin-bottom: 2rem;
+  h2{
+    color: #2C3138;
+    font-size: 1.4rem;
+    font-weight: 400;
+    margin-bottom: 50px;
+  }
+
+  button{
+    margin: 0;
+  }
 }

packages/strapi-admin/admin/src/containers/NotificationProvider/actions.js

@@ -20,7 +20,7 @@ export function showNotification(message, status) {
   ((id) => {
     setTimeout(() => {
       dispatch(hideNotification(id));
-    }, 5000);
+    }, 2500);
   })(nextNotificationId);
 
   return {

packages/strapi-admin/admin/src/containers/NotificationProvider/index.js

@@ -4,7 +4,7 @@
  *
  */
 
-import React from 'react';
+import PropTypes from 'prop-types';
 import { connect } from 'react-redux';
 import { createStructuredSelector } from 'reselect';
 
@@ -25,8 +25,8 @@ export class NotificationProvider extends React.Component { // eslint-disable-li
 }
 
 NotificationProvider.propTypes = {
-  notifications: React.PropTypes.object.isRequired,
-  onHideNotification: React.PropTypes.func.isRequired,
+  notifications: PropTypes.object.isRequired,
+  onHideNotification: PropTypes.func.isRequired,
 };
 
 const mapStateToProps = createStructuredSelector({

packages/strapi-admin/admin/src/containers/PluginPage/index.js

@@ -4,7 +4,7 @@
  *
  */
  
-import React from 'react';
+import PropTypes from 'prop-types';
 import { connect } from 'react-redux';
 import Helmet from 'react-helmet';
 import { createSelector } from 'reselect';
@@ -12,23 +12,27 @@ import { selectPlugins } from 'containers/App/selectors';
 
 export class PluginPage extends React.Component { // eslint-disable-line react/prefer-stateless-function
   render() {
+    let pluginName;
+
     // Detect plugin id from url params
     const pluginId = this.props.match.params.pluginId;
+    const plugins = this.props.plugins.toJS();
 
-    const containers = this.props.plugins.valueSeq().map((plugin) => {
-      if (plugin.get('id') === pluginId) {
-        const Elem = plugin.get('mainComponent');
-        return <Elem key={plugin.get('id')} {...this.props} />;
+    const containers = Object.keys(plugins).map((name) => {
+      const plugin = plugins[name];
+
+      if (plugin.id === pluginId) {
+        pluginName = plugin.name;
+
+        const Elem = plugin.mainComponent;
+        return <Elem key={plugin.id} {...this.props} />;
       }
     });
 
     return (
       <div>
         <Helmet
-          title="Strapi - Plugin"
-          meta={[
-            { name: 'description', content: 'Description of PluginPage' },
-          ]}
+          title={`Strapi - ${pluginName}`}
         />
         {containers}
       </div>
@@ -36,13 +40,9 @@ export class PluginPage extends React.Component { // eslint-disable-line react/p
   }
 }
 
-PluginPage.contextTypes = {
-  router: React.PropTypes.object.isRequired,
-};
-
 PluginPage.propTypes = {
-  match: React.PropTypes.object.isRequired,
-  plugins: React.PropTypes.object.isRequired,
+  match: PropTypes.object.isRequired,
+  plugins: PropTypes.object.isRequired,
 };
 
 const mapStateToProps = createSelector(

packages/strapi-admin/admin/src/index.html

@@ -12,5 +12,9 @@
 <!-- The app hooks into this div -->
 <div id="app"></div>
 <!-- A lot of magic happens in this file. HtmlWebpackPlugin automatically includes all assets (e.g. bundle.js, main.css) with the correct HTML tags, which is why they are missing in this HTML file. Don't add any assets here! (Check out webpackconfig.js if you want to know more) -->
+<script src="https://cdnjs.cloudflare.com/ajax/libs/react/15.6.1/react-with-addons.js"></script>
+<script src="https://cdnjs.cloudflare.com/ajax/libs/react/15.6.1/react-dom.js"></script>
+<script src="https://cdnjs.cloudflare.com/ajax/libs/react-transition-group/2.2.0/react-transition-group.js"></script>
+
 </body>
 </html>

packages/strapi-admin/admin/src/styles/base/animations.scss

@@ -13,12 +13,12 @@
   right: 0;
 }
 
-.notification-leave {
+.notification-exit {
   opacity: 1;
   right: 0;
 }
 
-.notification-leave.notification-leave-active {
+.notification-exit.notification-exit-active {
   opacity: 0.01;
   transition: all 400ms ease-in;
   right: -45rem;

packages/strapi-admin/admin/src/styles/base/bootstrap-override.scss

@@ -8,8 +8,6 @@
   border-radius: .2rem;
   box-shadow: 0 2px 4px rgba(0, 0, 0, 0.05);
   border: none;
-  padding-left: 3rem;
-  padding-right: 3rem;
 }
 
 .modal-backdrop.show {

packages/strapi-admin/admin/src/styles/variables/variables.scss

@@ -23,6 +23,7 @@ $left-menu-title-color: #5B626F;
 $header-height: 6rem;
 
 // -- content
-$content-background: $strapi-gray-light;
+$content-background: #FAFAFB;
+
 // Import bootstrap variables
 @import "variables.bootstrap";

packages/strapi-admin/admin/src/translations/en.json

@@ -1,5 +1,6 @@
 {
   "app.components.ComingSoonPage.comingSoon": "Coming soon",
+  "app.components.ComingSoonPage.featuresNotAvailable": "This feature is still under active development.",
   "app.components.HomePage.welcome": "Welcome to the home page",
   "app.components.LeftMenuFooter.poweredBy": "Proudly powered by",
   "app.components.LeftMenuLinkContainer.configuration": "Configuration",
@@ -8,5 +9,6 @@
   "app.components.LeftMenuLinkContainer.listPlugins": "List plugins",
   "app.components.LeftMenuLinkContainer.noPluginsInstalled": "No plugins installed yet",
   "app.components.LeftMenuLinkContainer.plugins": "Plugins",
-  "app.components.NotFoundPage.description": ""
+  "app.components.NotFoundPage.description": "Not Found",
+  "app.components.NotFoundPage.back": "Back to homepage"
 }

packages/strapi-admin/admin/src/translations/fr.json

@@ -1,5 +1,6 @@
 {
   "app.components.ComingSoonPage.comingSoon": "Bientôt disponible",
+  "app.components.ComingSoonPage.featuresNotAvailable": "Cette fonctionnalité est toujours en cours de développement.",
   "app.components.HomePage.welcome": "Bienvenue sur la page d'accueil",
   "app.components.LeftMenuFooter.poweredBy": "Propulsé par",
   "app.components.LeftMenuLinkContainer.configuration": "Configuration",
@@ -8,5 +9,6 @@
   "app.components.LeftMenuLinkContainer.listPlugins": "Liste des plugins",
   "app.components.LeftMenuLinkContainer.noPluginsInstalled": "Aucun plugin installé",
   "app.components.LeftMenuLinkContainer.plugins": "Plugins",
-  "app.components.NotFoundPage.description": "Page introuvable"
+  "app.components.NotFoundPage.description": "Page introuvable",
+  "app.components.NotFoundPage.back": "Retourner à la page d'accueil"
 }

packages/strapi-admin/admin/src/utils/injectReducer.js

@@ -1,4 +1,4 @@
-import React from 'react';
+
 import PropTypes from 'prop-types';
 import hoistNonReactStatics from 'hoist-non-react-statics';
 

packages/strapi-admin/admin/src/utils/injectSaga.js

@@ -1,4 +1,4 @@
-import React from 'react';
+
 import PropTypes from 'prop-types';
 import hoistNonReactStatics from 'hoist-non-react-statics';
 

packages/strapi-admin/files/package.json

@@ -0,0 +1,28 @@
+{
+  "name": "strapi-admin",
+  "version": "0.0.0",
+  "description": "Strapi Admin",
+  "repository": {
+    "type": "git",
+    "url": "git://github.com/strapi/strapi-admin.git"
+  },
+  "engines": {
+    "npm": ">=3"
+  },
+  "author": "Strapi",
+  "license": "MIT",
+  "scripts": {
+    "setup": "npm install && cd public && npm install && npm run build",
+    "test": "cd public && npm run test"
+  },
+  "pre-commit": [
+    "test"
+  ],
+  "dependencies": {
+    "cheerio": "0.22.0",
+    "lodash": "^4.17.2"
+  },
+  "devDependencies": {
+    "pre-commit": "1.1.3"
+  }
+}

packages/strapi-admin/files/public/.github/CONTRIBUTING.md

@@ -0,0 +1,122 @@
+# Contributing to react-boilerplate
+
+Love react-boilerplate and want to help? Thanks so much, there's something to do for everybody!
+
+Please take a moment to review this document in order to make the contribution process easy and effective for everyone involved.
+
+Following these guidelines helps to communicate that you respect the time of the developers managing and developing this open source project. In return, they should reciprocate that respect in addressing your issue or assessing patches and features.
+
+## Using the issue tracker
+
+The [issue tracker](https://github.com/mxstbr/react-boilerplate/issues) is
+the preferred channel for [bug reports](#bugs), [features requests](#features)
+and [submitting pull requests](#pull-requests).
+
+<a name="bugs"></a>
+## Bug reports
+
+A bug is a _demonstrable problem_ that is caused by the code in the repository.
+Good bug reports are extremely helpful - thank you!
+
+Guidelines for bug reports:
+
+1. **Use the GitHub issue search** &mdash; check if the issue has already been reported.
+
+2. **Check if the issue has been fixed** &mdash; try to reproduce it using the latest `master` or development branch in the repository.
+
+3. **Isolate the problem** &mdash; ideally create a [reduced test case](https://css-tricks.com/reduced-test-cases/) and a live example.
+
+A good bug report shouldn't leave others needing to chase you up for more information. Please try to be as detailed as possible in your report. What is your environment? What steps will reproduce the issue? What browser(s) and OS
+experience the problem? What would you expect to be the outcome? All these details will help people to fix any potential bugs.
+
+Example:
+
+> Short and descriptive example bug report title
+>
+> A summary of the issue and the browser/OS environment in which it occurs. If
+> suitable, include the steps required to reproduce the bug.
+>
+> 1. This is the first step
+> 2. This is the second step
+> 3. Further steps, etc.
+>
+> `<url>` - a link to the reduced test case
+>
+> Any other information you want to share that is relevant to the issue being
+> reported. This might include the lines of code that you have identified as
+> causing the bug, and potential solutions (and your opinions on their
+> merits).
+
+
+<a name="features"></a>
+## Feature requests
+
+Feature requests are welcome. But take a moment to find out whether your idea fits with the scope and aims of the project. It's up to *you* to make a strong case to convince the project's developers of the merits of this feature. Please provide as much detail and context as possible.
+
+
+<a name="pull-requests"></a>
+## Pull requests
+
+Good pull requests - patches, improvements, new features - are a fantastic
+help. They should remain focused in scope and avoid containing unrelated
+commits.
+
+**Please ask first** before embarking on any significant pull request (e.g.
+implementing features, refactoring code, porting to a different language),
+otherwise you risk spending a lot of time working on something that the
+project's developers might not want to merge into the project.
+
+Please adhere to the coding conventions used throughout a project (indentation,
+accurate comments, etc.) and any other requirements (such as test coverage).
+
+Since the `master` branch is what people actually use in production, we have a
+`dev` branch that unstable changes get merged into first. Only when we
+consider that stable we merge it into the `master` branch and release the
+changes for real.
+
+Adhering to the following process is the best way to get your work
+included in the project:
+
+1. [Fork](https://help.github.com/articles/fork-a-repo/) the project, clone your fork, and configure the remotes:
+
+   ```bash
+   # Clone your fork of the repo into the current directory
+   git clone https://github.com/<your-username>/react-boilerplate.git
+   # Navigate to the newly cloned directory
+   cd react-boilerplate
+   # Assign the original repo to a remote called "upstream"
+   git remote add upstream https://github.com/mxstbr/react-boilerplate.git
+   ```
+
+2. If you cloned a while ago, get the latest changes from upstream:
+
+   ```bash
+   git checkout dev
+   git pull upstream dev
+   ```
+
+3. Create a new topic branch (off the `dev` branch) to contain your feature, change, or fix:
+
+   ```bash
+   git checkout -b <topic-branch-name>
+   ```
+
+4. Commit your changes in logical chunks. Please adhere to these [git commit message guidelines](http://tbaggery.com/2008/04/19/a-note-about-git-commit-messages.html) or your code is unlikely be merged into the main project. Use Git's [interactive rebase](https://help.github.com/articles/about-git-rebase/) feature to tidy up your commits before making them public.
+
+5. Locally merge (or rebase) the upstream dev branch into your topic branch:
+
+   ```bash
+   git pull [--rebase] upstream dev
+   ```
+
+6. Push your topic branch up to your fork:
+
+   ```bash
+   git push origin <topic-branch-name>
+   ```
+
+7. [Open a Pull Request](https://help.github.com/articles/using-pull-requests/)
+    with a clear title and description.
+
+**IMPORTANT**: By submitting a patch, you agree to allow the project
+owners to license your work under the terms of the [MIT License](https://github.com/mxstbr/react-boilerplate/blob/master/LICENSE.md).

packages/strapi-admin/files/public/.github/ISSUE_TEMPLATE.md

@@ -0,0 +1,30 @@
+# React Boilerplate
+
+Before opening a new issue, please take a moment to review our [**community guidelines**](https://github.com/mxstbr/react-boilerplate/blob/master/.github/CONTRIBUTING.md) to make the contribution process easy and effective for everyone involved.
+
+Please direct redux-saga related questions to stack overflow:
+http://stackoverflow.com/questions/tagged/redux-saga
+
+For questions related to the boilerplate itself, you can also find answers on our gitter chat:
+https://gitter.im/mxstbr/react-boilerplate
+
+**Before opening a new issue, you may find an answer in already closed issues**:
+https://github.com/mxstbr/react-boilerplate/issues?q=is%3Aissue+is%3Aclosed
+
+## Issue Type
+
+- [ ] Bug (https://github.com/mxstbr/react-boilerplate/blob/master/.github/CONTRIBUTING.md#bug-reports)
+- [ ] Feature (https://github.com/mxstbr/react-boilerplate/blob/master/.github/CONTRIBUTING.md#feature-requests)
+
+## Description
+
+(Add images if possible)
+
+## Steps to reproduce
+
+(Add link to a demo on https://jsfiddle.net or similar if possible)
+
+# Versions
+
+- Node/NPM:
+- Browser:

packages/strapi-admin/files/public/.github/PULL_REQUEST_TEMPLATE.md

@@ -0,0 +1,22 @@
+## React Boilerplate
+
+Thank you for contributing! Please take a moment to review our [**contributing guidelines**](https://github.com/mxstbr/react-boilerplate/blob/master/.github/CONTRIBUTING.md)
+to make the process easy and effective for everyone involved.
+
+**Please open an issue** before embarking on any significant pull request, especially those that
+add a new library or change existing tests, otherwise you risk spending a lot of time working
+on something that might not end up being merged into the project.
+
+Before opening a pull request, please ensure:
+
+- [ ] You have followed our [**contributing guidelines**](https://github.com/mxstbr/react-boilerplate/blob/master/.github/CONTRIBUTING.md)
+- [ ] Pull request has tests (we are going for 100% coverage!)
+- [ ] Code is well-commented, linted and follows project conventions
+- [ ] Documentation is updated (if necessary)
+- [ ] Internal code generators and templates are updated (if necessary)
+- [ ] Description explains the issue/use-case resolved and auto-closes related issues
+
+Be kind to code reviewers, please try to keep pull requests as small and focused as possible :)
+
+**IMPORTANT**: By submitting a patch, you agree to allow the project
+owners to license your work under the terms of the [MIT License](https://github.com/mxstbr/react-boilerplate/blob/master/LICENSE.md).

packages/strapi-admin/files/public/.gitignore

@@ -0,0 +1,10 @@
+# Don't check auto-generated stuff into git
+coverage
+build
+node_modules
+stats.json
+
+# Cruft
+.DS_Store
+npm-debug.log
+.idea

packages/strapi-admin/files/public/.travis.yml

@@ -0,0 +1,18 @@
+language: node_js
+sudo: true
+dist: trusty
+node_js:
+  - "5.0"
+script: npm run build
+before_install:
+  - export CHROME_BIN=/usr/bin/google-chrome
+  - export DISPLAY=:99.0
+  - sudo apt-get update
+  - sudo apt-get install -y libappindicator1 fonts-liberation
+  - wget https://dl.google.com/linux/direct/google-chrome-stable_current_amd64.deb
+  - sudo dpkg -i google-chrome*.deb
+  - sh -e /etc/init.d/xvfb start
+notifications:
+  email:
+    on_failure: change
+after_success: 'npm run coveralls'

packages/strapi-admin/files/public/app/.htaccess

@@ -0,0 +1,44 @@
+<ifModule mod_rewrite.c>
+
+
+  #######################################################################
+  # GENERAL                                                             #
+  #######################################################################
+
+  # Make apache follow sym links to files
+  Options +FollowSymLinks
+  # If somebody opens a folder, hide all files from the resulting folder list
+  IndexIgnore */*
+
+
+  #######################################################################
+  # REWRITING                                                           #
+  #######################################################################
+
+  # Enable rewriting
+  RewriteEngine On
+
+  # If its not HTTPS
+  RewriteCond %{HTTPS} off
+
+  # Comment out the RewriteCond above, and uncomment the RewriteCond below if you're using a load balancer (e.g. CloudFlare) for SSL
+  # RewriteCond %{HTTP:X-Forwarded-Proto} !https
+
+  # Redirect to the same URL with https://, ignoring all further rules if this one is in effect
+  RewriteRule ^(.*) https://%{HTTP_HOST}/$1 [R,L]
+
+  # If we get to here, it means we are on https://
+  
+  # If the file with the specified name in the browser doesn't exist
+  RewriteCond %{REQUEST_FILENAME} !-f
+
+  # and the directory with the specified name in the browser doesn't exist
+  RewriteCond %{REQUEST_FILENAME} !-d
+
+  # and we are not opening the root already (otherwise we get a redirect loop)
+  RewriteCond %{REQUEST_FILENAME} !\/$
+
+  # Rewrite all requests to the root
+  RewriteRule ^(.*) /
+
+</ifModule>

packages/strapi-admin/files/public/app/.nginx.conf

@@ -0,0 +1,66 @@
+##
+# Put this file in /etc/nginx/conf.d folder and make sure
+# you have line 'include /etc/nginx/conf.d/*.conf;'
+# in your main nginx configuration file
+##
+
+##
+# Redirect to the same URL with https://
+##
+
+server {
+
+  listen 80;
+
+# Type your domain name below
+  server_name example.com;
+
+  return 301 https://$server_name$request_uri;
+
+}
+
+##
+# HTTPS configurations
+##
+
+server {
+
+  listen 443;
+
+# Type your domain name below
+  server_name example.com;
+
+  ssl on;
+  ssl_certificate     /path/to/certificate.crt;
+  ssl_certificate_key /path/to/server.key;
+
+# Use only TSL protocols for more secure
+  ssl_protocols TLSv1 TLSv1.1 TLSv1.2;
+
+# Always serve index.html for any request
+  location / {
+    # Set path
+    root /var/www/;
+    try_files $uri /index.html;
+  }
+
+##
+# If you want to use Node/Rails/etc. API server
+# on the same port (443) config Nginx as a reverse proxy.
+# For security reasons use a firewall like ufw in Ubuntu
+# and deny port 3000/tcp.
+##
+
+# location /api/ {
+#
+#   proxy_pass http://localhost:3000;
+#   proxy_http_version 1.1;
+#   proxy_set_header X-Forwarded-Proto https;
+#   proxy_set_header Upgrade $http_upgrade;
+#   proxy_set_header Connection 'upgrade';
+#   proxy_set_header Host $host;
+#   proxy_cache_bypass $http_upgrade;
+#
+# }
+
+}

packages/strapi-admin/files/public/app/components/Header/tests/index.test.js

@@ -0,0 +1,11 @@
+// import Header from '../index';
+
+import expect from 'expect';
+// import { shallow } from 'enzyme';
+// import React from 'react';
+
+describe('<Header />', () => {
+  it('Expect to have unit tests specified', () => {
+    expect(true).toEqual(true);
+  });
+});

packages/strapi-admin/files/public/app/components/LeftMenuFooter/tests/index.test.js

@@ -0,0 +1,11 @@
+// import LeftMenuFooter from '../index';
+
+import expect from 'expect';
+// import { shallow } from 'enzyme';
+// import React from 'react';
+
+describe('<LeftMenuFooter />', () => {
+  it('Expect to have unit tests specified', () => {
+    expect(true).toEqual(true);
+  });
+});