add massive deleting, add error detalis view, get config from parse server, add custom error view

.vagrant/machines/default/virtualbox/action_set_name

-1467994135
\ No newline at end of file
+1468357419
\ No newline at end of file

path.json

-module.exports = {"main":{"js":"/907311bundle.js"}}
\ No newline at end of file
+module.exports = {"main":{"js":"/451280bundle.js"}}
\ No newline at end of file

src/components/404/404.jsx

+import React from 'react';
+
+import * as Utils from '../../utils/utils.jsx';
+
+export default class NotFound404 extends React.Component {
+    render() {
+        const clouds = [];
+        const totalClouds = Utils.randomRange(30, 20);
+        const screenHeight = window.innerHeight;
+        const screenWidth = window.innerWidth;
+
+        for (let i = 0; i < totalClouds; i++) {
+            const topStyle = Utils.randomRange(screenHeight, 80);
+            const sizeCloud = Utils.randomRange(1, 5);
+            const leftStyle = Utils.randomRange(screenWidth + 300, screenWidth);
+            //const scale = Utils.randomRange(1, 0.1);
+
+            clouds.push(
+                (
+                    <i
+                        key={`cloud-${i}`}
+                        style={{top: topStyle + 'px', left: leftStyle + 'px'}}
+                        className={`fa fa-cloud fa-${sizeCloud}x`}
+                    ></i>
+                )
+            );
+        }
+
+        return (
+            <div className='wrapper-error'>
+                <div className='zboxPlain'>
+                    <i className='fa fa-paper-plane'></i>
+                    <i className='fa fa-paper-plane-o underPlain'></i>
+                </div>
+
+                {clouds}
+            </div>
+        );
+    }
+}

src/components/errors_from_action.jsx

+import React from 'react';
+
+import Panel from './panel.jsx';
+import PageInfo from './page_info.jsx';
+import * as GlobalActions from '../action_creators/global_actions.jsx';
+
+import ErrorStore from '../stores/error_store.jsx';
+
+export default class ErrorDetails extends React.Component {
+    constructor(props) {
+        super(props);
+
+        this.getDetails = this.getDetails.bind(this);
+
+        this.state = {
+            errors: null
+        };
+    }
+
+    getDetails() {
+        const errors = ErrorStore.getErrors();
+
+        this.setState({
+            errors
+        });
+    }
+
+    componentDidMount() {
+        GlobalActions.emitEndLoading();
+        this.getDetails();
+    }
+
+    componentWillUnmount() {
+        ErrorStore.destroy();
+    }
+
+    render() {
+        const {errors} = this.state;
+        let bodyError = null;
+        let title;
+        let message;
+
+        if (!errors) {
+            bodyError = (
+                <div className='text-center'>
+                    <h3 className='page-header'>
+                        Por suerte no tenemos errores para mostrar <small><i className='fa fa-smile-o fa-3x color-smile'></i></small>
+                    </h3>
+                </div>
+            );
+        }
+
+        if (errors) {
+            title = errors.title;
+            message = errors.message;
+            const elements = [];
+            const keys = Object.keys(errors.data || []);
+
+            keys.forEach((key) => {
+                errors.data[key].forEach((error, i) => {
+                    elements.push(
+                        (
+                            <li key={`error-${i}`}>
+                                {`${error.item} : ${error.error}`}
+                            </li>
+                        )
+                    );
+                });
+            });
+
+            bodyError = (
+                <div className='alert alert-danger'>
+                    <ul className='list-errors list-unstyled'>
+                        {elements}
+                    </ul>
+                </div>
+            );
+        }
+
+        return (
+            <div>
+                <PageInfo
+                    titlePage={title || 'No hay errores que mostrar'}
+                    descriptionPage={message || ''}
+                />
+                <div className='content animate-panel'>
+                    <div className='row'>
+                        <div className='col-md-12 central-content'>
+                            <Panel
+                                children={bodyError}
+                                hasHeader={false}
+                            />
+                        </div>
+                    </div>
+                </div>
+            </div>
+        );
+    }
+}

src/components/import_massive_modal.jsx

@@ -148,7 +148,7 @@ export default class ImportMassiveModal extends React.Component {
     }
 
     extractCols(data, flagDefault) {
-        let splitConditio = /\r\n|\r|\n/g;
+        let splitConditio = /\r\n|\r|\n/gi;
         let hasError = false;
         const dataArray = data.split(splitConditio);
 

src/index.jsx

@@ -24,6 +24,9 @@ import DistributionLists from './components/distribution/distribution_lists.jsx'
 import EditDistributionList from './components/distribution/edit_distribution_lists.jsx';
 import SearchView from './components/search/search.jsx';
 import SalesForm from './components/sales/sales.jsx';
+import deleteMassive from './components/massive/masive_delete.jsx';
+import ErrorsFromActions from './components/errors_from_action.jsx';
+import Template404 from './components/404/404.jsx';
 
 import * as Client from './utils/client.jsx';
 import * as Utils from './utils/utils.jsx';
@@ -46,13 +49,15 @@ const notFoundParams = {
 function preRenderSetup(callwhendone) {
     const d1 = Client.getClientConfig(
         (data) => {
-            if (!data) {
+            const config = data.result;
+
+            if (!config) {
                 return;
             }
 
-            global.window.manager_config = data;
+            global.window.manager_config = config;
 
-            if (data.debug) {
+            if (config.debug) {
                 global.window.Client = Client;
                 global.window.Utils = Utils;
             }
@@ -119,7 +124,7 @@ function renderRootComponent() {
                 >
                     <Route
                         path='error'
-                        component={ErrorPage}
+                        component={ErrorPage || Template404}
                     />
                     <Route
                         component={LoggedIn}
@@ -213,6 +218,16 @@ function renderRootComponent() {
                             path='sales/:domainId/mailboxes'
                             component={SalesForm}
                         />
+
+                        <Route
+                            path='massive'
+                            component={deleteMassive}
+                        />
+
+                        <Route
+                            path='errorsFromAction'
+                            component={ErrorsFromActions}
+                        />
                     </Route>
                     <Route component={NotLoggedIn}>
                         <IndexRedirect to='login'/>

src/sass/components/_various.scss

@@ -1686,3 +1686,118 @@ label {
     right: 0;
   }
 }
+
+.wrapper-console {
+  margin-bottom: 15px;
+  overflow: hidden;
+  position: relative;
+
+  .consoleText {
+    background: $black;
+    color: $color-console;
+    font-weight: 500;
+    max-height: 600px;
+    min-height: 300px;
+    overflow: auto;
+    resize: none;
+
+    &:focus + .tooltip-console {
+      top: 4px;
+    }
+  }
+
+  .tooltip-console {
+    border: 1px solid $color-console;
+    color: $white;
+    font-size: 10px;
+    opacity: .6;
+    padding: 5px;
+    position: absolute;
+    right: 18px;
+    top: -50%;
+    transition: top .5s;
+
+    &:hover {
+      opacity: .9;
+    }
+
+    code {
+      margin-right: 5px;
+    }
+  }
+}
+
+// scss-lint:disable all
+
+.custom-blockquote {
+  border-color: $border-color-ok;
+
+  i {
+    font-size: 14px;
+  }
+}
+
+.color-smile {
+  color: $border-color-ok;
+  vertical-align: middle;
+}
+
+.link-error {
+  color: $border-color-ok;
+  text-decoration: underline;
+}
+
+.list-errors {
+  list-style: none;
+
+  li {
+    &::before {
+      content: '\274C';
+      margin-right: 10px;
+    }
+  }
+}
+
+.wrapper-error {
+  background: #6BB9F0;
+
+  .zboxPlain {
+    display: inline-block;
+    font-size: 80px;
+    left: 500px;
+    position: relative;
+    top: 220px;
+    -webkit-animation: flying 3s infinite;
+    transform: rotate(50deg);
+
+    i {
+      color: $white;
+      left: 0;
+      position: absolute;
+      top: 0;
+
+      &.underPlain {
+        color: grey;
+      }
+    }
+  }
+
+  i[class*='cloud'] {
+    color: $white;
+    position: absolute;
+    //animation: wind 27s infinite;
+    //-webkit-animation: wind 27s infinite;
+
+    &:nth-child(2n + 1) {
+      //animation: windSlow 17s infinite;
+      //-webkit-animation: windSlow 17s infinite;
+    }
+
+    &:nth-child(3n + 1) {
+      //animation: windSlower 25s infinite;
+      //-webkit-animation: windSlower 25s infinite;
+    }
+  }
+}
+
+// scss-lint:enable all

src/sass/utils/_functions.scss

 @charset 'UTF-8';
+
+// scss-lint:disable all
+
+@keyframes wind {
+  0% {
+    margin-left: 110%;
+  }
+
+  100% {
+    margin-left: -10%;
+  }
+}
+
+@-webkit-keyframes windSlow {
+  0% {
+    margin-left: 150%;
+  }
+
+  100% {
+    margin-left: -20%;
+  }
+}
+
+@-webkit-keyframes windSlower {
+  0% {
+    margin-left: 180%;
+  }
+
+  100% {
+    margin-left: -70%;
+  }
+}
+
+@-webkit-keyframes flying {
+  0%, 100% {
+    top: 5px;
+  }
+
+  50% {
+    top: 30px;
+  }
+}
+
+// scss-lint:enable all

src/sass/utils/_variables.scss

@@ -130,3 +130,7 @@ $bg-beta: #ee8e4a;
 // tags mailbox style
 
 $border-color-tag: #e2e2e2;
+
+// console color letters
+
+$color-console: #0f0;

src/stores/error_store.jsx

+class ErrorStore {
+    constructor() {
+        this.errors = null;
+    }
+
+    saveErrors(error) {
+        this.errors = error;
+    }
+
+    getErrors() {
+        if (this.errors) {
+            return this.errors;
+        }
+    }
+
+    destroy() {
+        this.errors = null;
+    }
+}
+
+const erroStore = new ErrorStore();
+
+export {erroStore as default};

src/utils/client.jsx

@@ -75,8 +75,13 @@ function initZimbra() {
 
 export function getClientConfig(success, error) {
     return $.ajax({
-        url: '/config/config.json',
+        url: 'https://ventasparse-ventas.hub.zboxapp.com/parse/functions/getConfigManager',
         dataType: 'json',
+        method: 'POST',
+        headers: {
+            'X-Parse-Application-Id': 'salesZboxManagerApp'
+        },
+        data: {target: 'manager'},
         success,
         error: function onError(xhr, status, err) {
             var e = handleError('getClientConfig', err);
@@ -385,6 +390,14 @@ export function getAllAccountsByBatch(attrs) {
     return ZimbraStore.getCurrent().getAllAccounts(attrs);
 }
 
+export function getAccountByBatch(id) {
+    return ZimbraStore.getCurrent().getAccount(id);
+}
+
+export function removeAccountByBatch(id) {
+    return ZimbraStore.getCurrent().removeAccount(id);
+}
+
 export function getAccount(id, success, error) {
     initZimbra().then(
         (zimbra) => {

src/utils/utils.jsx

@@ -842,3 +842,7 @@ export function getDaysFromDate2Date(dateFrom, dateTo) {
     var diffDays = Math.ceil(timeDiff / (1000 * 3600 * 24));
     return diffDays;
 }
+
+export function randomRange(max, min) {
+    return Math.floor(Math.random() * (max - min + 1) + min);
+}