Fix some warnings and errors. (#807)

* Fix error with case sensitive in autocomplete component.

* Fix error in autocomplete test.

* Minor syle change in Tag Selector component.

* Delete ticket/admin-panel-custom-tags and fix some bugs with settings/admin-panel-custom-tags.

* Fix some bugs part 1.

* Replace query2 for queryAtBeginning in search test.

* Fix warning with checkbox value

* fix warnings in admin panel email settings.

* Delete admin panel all tickets page.

* Rename some classNames in admin panel search tickets.

* fix some erros.

client/src/app-components/articles-list.js

@@ -89,7 +89,7 @@ class ArticlesList extends React.Component {
 
 export default connect((store) => {
     return {
-        topics: store.articles.topics,
+        topics: store.articles.topics.map((topic) => {return {...topic, private: topic.private === "1"}}),
         errored: store.articles.errored,
         loading: store.articles.loading
     };

client/src/app-components/ticket-viewer.js

@@ -723,13 +723,13 @@ class TicketViewer extends React.Component {
 
 export default connect((store) => {
     return {
-        userId: store.session.userId,
+        userId: store.session.userId*1,
         userStaff: store.session.staff,
         userDepartments: store.session.userDepartments,
         staffMembers: store.adminData.staffMembers,
         staffMembersLoaded: store.adminData.staffMembersLoaded,
         allowAttachments: store.config['allow-attachments'],
-        userLevel: store.session.userLevel,
+        userLevel: store.session.userLevel*1,
         tags: store.config['tags']
     };
 })(TicketViewer);

client/src/app/admin/panel/settings/admin-panel-custom-tags-modal.js

@@ -103,10 +103,7 @@ class AdminPanelCustomTagsModal extends React.Component {
             }
         }).then(() => {
             this.context.closeModal();
-            this.setState({
+
-                loading: false,
-                errors: {}
-            });
             if(this.props.onTagChange) {
                 this.props.onTagChange();
             }
@@ -135,10 +132,6 @@ class AdminPanelCustomTagsModal extends React.Component {
             }
         }).then(() => {
             this.context.closeModal();
-            this.setState({
-                loading: false,
-                errors: {}
-            });
 
             if(this.props.onTagCreated) {
                 this.props.onTagCreated();

client/src/app/admin/panel/settings/admin-panel-custom-tags.js

@@ -1,7 +1,7 @@
 import React from 'react';
 import {connect}  from 'react-redux';
 
-import AdminPanelCustomTagsModal from 'app/admin/panel/tickets/admin-panel-custom-tags-modal';
+import AdminPanelCustomTagsModal from 'app/admin/panel/settings/admin-panel-custom-tags-modal';
 
 import i18n from 'lib-app/i18n';
 import API from 'lib-app/api-call';
@@ -97,6 +97,6 @@ class AdminPanelCustomTags extends React.Component {
 
 export default connect((store) => {
     return {
-        tags: store.config['tags']
+        tags: store.config['tags'].map((tag) => {return {...tag, id: tag.id*1}})
     };
 })(AdminPanelCustomTags);

client/src/app/admin/panel/settings/admin-panel-email-settings.js

@@ -150,7 +150,11 @@ class AdminPanelEmailSettings extends React.Component {
                             <FormField name="imap-host" label={i18n('IMAP_SERVER')} fieldProps={{size: 'large'}}/>
                             <FormField name="imap-user" label={i18n('IMAP_USER')} fieldProps={{size: 'large'}}/>
                             <FormField name="imap-pass" label={i18n('IMAP_PASSWORD')} fieldProps={{size: 'large'}}/>
-                            <FormField name="imap-token" label={i18n('IMAP_TOKEN')} infoMessage={i18n('IMAP_TOKEN_DESCRIPTION')} fieldProps={{size: 'large', icon: 'refresh', onIconClick: this.generateImapToken.bind(this)}}/>
+                            <FormField
+                                name="imap-token"
+                                label={i18n('IMAP_TOKEN')}
+                                infoMessage={i18n('IMAP_TOKEN_DESCRIPTION')}
+                                fieldProps={{size: 'large', icon: 'refresh', onIconClick: this.generateImapToken.bind(this)}}/>
                             <div className="admin-panel-email-settings__server-form-buttons">
                                 <SubmitButton className="admin-panel-email-settings__submit" type="secondary"
                                               size="small">{i18n('SAVE')}</SubmitButton>
@@ -482,20 +486,20 @@ class AdminPanelEmailSettings extends React.Component {
             path: '/system/get-settings',
             data: {allSettings: 1}
         }).then(result => this.setState({
-            headerImage: result.data['mail-template-header-image'],
+            headerImage: result.data['mail-template-header-image'] || '',
             emailForm: {
-                ['server-email']: result.data['server-email'],
+                ['server-email']: result.data['server-email'] || '',
             },
             smtpForm: {
-                ['smtp-host']: result.data['smtp-host'],
+                ['smtp-host']: result.data['smtp-host'] || '',
-                ['smtp-user']: result.data['smtp-user'],
+                ['smtp-user']: result.data['smtp-user'] || '',
                 ['smtp-pass']: 'HIDDEN',
             },
             imapForm: {
-                ['imap-host']: result.data['imap-host'],
+                ['imap-host']: result.data['imap-host'] || '',
-                ['imap-user']: result.data['imap-user'],
+                ['imap-user']: result.data['imap-user'] || '',
                 ['imap-pass']: 'HIDDEN',
-                ['imap-token']: result.data['imap-token'],
+                ['imap-token']: result.data['imap-token'] || '',
             },
         }));
     }

client/src/app/admin/panel/staff/admin-panel-departments.js

@@ -204,12 +204,13 @@ class AdminPanelDepartments extends React.Component {
         const {
             form,
             errors,
-            formLoading
+            formLoading,
-        } = this.state
+        } = this.state;
 
         return {
-            values: form,
+            values: {...form, private: !!form.private},
             errors: errors,
+            loading: formLoading,
             onChange: (form) => {this.setState({form, edited: true})},
             onValidateErrors: (errors) => {this.setState({errors})},
             onSubmit: this.onFormSubmit.bind(this),
@@ -220,13 +221,15 @@ class AdminPanelDepartments extends React.Component {
 
     getDefaultDepartmentFormProps() {
         const {
-            formLoading
+            formLoading,
+            defaultDepartment,
+            defaultDepartmentLocked
         } = this.state;
 
         return {
             values: {
-                defaultDepartment: getPublicDepartmentIndexFromDepartmentId(this.state.defaultDepartment),
+                defaultDepartment: getPublicDepartmentIndexFromDepartmentId(defaultDepartment),
-                locked: this.state.defaultDepartmentLocked,
+                locked: defaultDepartmentLocked ? true : false,
             },
             onChange: (formValue) => {
                 this.setState({

client/src/app/admin/panel/staff/admin-panel-view-staff.js

@@ -32,7 +32,14 @@ class AdminPanelViewStaff extends React.Component {
     }
 
     getProps() {
-        return _.extend({}, this.state.userData, {
+        const { userData } = this.state;
+        const userDataWithNumericLevel = {
+            ...userData,
+            level: userData.level*1,
+            sendEmailOnNewTicket: userData.sendEmailOnNewTicket === "1"
+        };
+
+        return _.extend({}, userDataWithNumericLevel, {
             staffId: this.props.params.staffId * 1,
             onDelete: this.onDelete.bind(this),
             onChange: this.retrieveStaff.bind(this)

client/src/app/admin/panel/tickets/admin-panel-custom-tags.js

@@ -1,96 +0,0 @@
-import React from 'react';
-import {connect}  from 'react-redux';
-
-import AdminPanelCustomTagsModal from 'app/admin/panel/tickets/admin-panel-custom-tags-modal';
-
-import i18n from 'lib-app/i18n';
-import API from 'lib-app/api-call';
-import ConfigActions from 'actions/config-actions';
-
-import AreYouSure from 'app-components/are-you-sure';
-import ModalContainer from 'app-components/modal-container';
-
-import Icon from 'core-components/icon';
-import Button from 'core-components/button';
-import Header from 'core-components/header';
-import Tag from 'core-components/tag';
-
-class AdminPanelCustomTags extends React.Component {
-    static propTypes = {
-        tags: React.PropTypes.arrayOf(
-            React.PropTypes.shape({
-                name: React.PropTypes.string,
-                color: React.PropTypes.string,
-                id: React.PropTypes.number
-            })
-        ),
-    };
-
-    componentDidMount() {
-        this.retrieveCustomTags();
-    }
-
-    render() {
-        return (
-            <div className="admin-panel-custom-tags">
-                <Header title={i18n('CUSTOM_TAGS')} description={i18n('CUSTOM_TAGS_DESCRIPTION')} />
-                {this.renderContent()}
-            </div>
-        );
-    }
-
-    renderContent() {
-        return (
-            <div className="admin-panel-custom-tags__content">
-                <div>
-                    <Button onClick={this.openTagModal.bind(this)}  type="secondary">
-                        {i18n('ADD_CUSTOM_TAG')}<Icon className="admin-panel-custom-tags__add-button-icon" name="plus"/>
-                    </Button>
-                </div>
-                <div className="admin-panel-custom-tags__tag-list">
-                    {this.props.tags.map(this.renderTag.bind(this))}
-                </div>
-            </div>
-        );
-    }
-
-    renderTag(tag, index) {
-        return (
-            <div key={index} className="admin-panel-custom-tags__tag-container" >
-                <Tag color={tag.color} name={tag.name} onRemoveClick={this.onDeleteClick.bind(this, tag.id)} size='large' showDeleteButton />
-            </div>
-        )
-    }
-
-    openTagModal() {
-        ModalContainer.openModal(
-            <AdminPanelCustomTagsModal onTagCreated={this.retrieveCustomTags.bind(this)}/>
-        );
-    }
-
-    onDeleteClick(tagId, event) {
-        event.preventDefault();
-        AreYouSure.openModal(i18n('WILL_DELETE_CUSTOM_RESPONSE'), this.deleteCustomTag.bind(this, tagId));
-    }
-
-    deleteCustomTag(tagId) {
-        API.call({
-            path: '/ticket/delete-tag',
-            data: {
-                tagId,
-            }
-        }).then(() => {
-            this.retrieveCustomTags()
-        });
-    }
-
-    retrieveCustomTags() {
-        this.props.dispatch(ConfigActions.updateData());
-    }
-}
-
-export default connect((store) => {
-    return {
-        tags: store.config['tags']
-    };
-})(AdminPanelCustomTags);

client/src/app/admin/panel/tickets/admin-panel-custom-tags.scss

@@ -1,18 +0,0 @@
-.admin-panel-custom-tags {
-
-    &__content {
-        text-align: left;
-    }
-
-    &__add-button-icon{
-        margin-left: 5px;
-    }
-
-    &__tag-list{
-        margin-top: 15px;
-    }
-
-    &__tag-container{
-        margin-top:5px ;
-    }
-}

client/src/app/admin/panel/tickets/admin-panel-search-tickets.js

@@ -55,14 +55,14 @@ class AdminPanelSearchTickets extends React.Component {
     render() {
         const { listConfig } = this.props;
         return (
-            <div className="admin-panel-all-tickets">
+            <div className="admin-panel-search-tickets">
-                <div className="admin-panel-all-tickets__container">
+                <div className="admin-panel-search-tickets__container">
                     <Header
-                        className="admin-panel-all-tickets__container__header"
+                        className="admin-panel-search-tickets__container__header"
                         title={listConfig.title !== undefined ? listConfig.title : i18n('SEARCH_TICKETS')}
                         description={i18n('SEARCH_TICKETS_DESCRIPTION')} />
                     <Button
-                        className="admin-panel-all-tickets__container__show-filters-button"
+                        className="admin-panel-search-tickets__container__show-filters-button"
                         size="auto"
                         type="tertiary"
                         onClick={this.onChangeShowFilters.bind(this)}>

client/src/app/admin/panel/tickets/admin-panel-search-tickets.scss

@@ -1,5 +1,5 @@
 
-.admin-panel-all-tickets {
+.admin-panel-search-tickets {
 
     &__container {
         display: flex;

client/src/app/main/dashboard/dashboard-list-articles/dashboard-list-articles-page.js

@@ -142,7 +142,7 @@ export default connect((store) => {
     return {
         isLogged: store.session.logged,
         config: store.config,
-        topics: store.articles.topics,
+        topics: store.articles.topics.map((topic) => {return {...topic, private: topic.private === "1" ? true : false}}),
         loading: store.articles.loading
     };
 })(DashboardListArticlesPage);

client/src/core-components/autocomplete.js

@@ -106,7 +106,7 @@ class Autocomplete extends React.Component {
         if(items !== undefined) {
             const list = this.getUnselectedList(items, this.getSelectedItems());
 
-            dropdownList = list.filter(s => _.includes(s.name, this.state.inputValue));
+            dropdownList = list.filter(s => _.includes(s.name.toLowerCase(), this.state.inputValue.toLowerCase()));
         } else {
             dropdownList = this.getUnselectedList(this.state.itemsFromQuery, this.getSelectedItems());
         }

client/src/core-components/checkbox.js

@@ -10,7 +10,7 @@ class CheckBox extends React.Component {
 
     static propTypes = {
         alignment: React.PropTypes.string,
-        label: React.PropTypes.string,
+        label: React.PropTypes.node,
         value: React.PropTypes.bool,
         wrapInLabel: React.PropTypes.bool,
         onChange: React.PropTypes.func

client/src/core-components/form-field.js

@@ -148,43 +148,53 @@ class FormField extends React.Component {
 
     getFieldProps() {
         const {
+            fieldProps,
             error,
             name,
+            placeholder,
             onBlur,
             required,
-            placeholder,
             field,
-            fieldProps,
+            value,
-            value
+            decorator
         } = this.props;
+
         let props = _.extend({}, fieldProps, {
             disabled: this.isDisabled(),
             errored: !!error,
-            name: name,
+            name,
-            placeholder: placeholder,
+            placeholder,
             key: 'nativeField',
             onChange: this.onChange.bind(this),
-            onBlur: onBlur,
+            onBlur,
             ref: 'nativeField',
-            required: required
+            required
         });
 
         if(field === 'select') {
             props.selectedIndex = value;
         }
-        if(field == 'date-range') {
+
+        if(decorator === 'textarea') {
+            delete props.errored;
+        }
+
+        if(field === 'date-range') {
             props.value = {
                 startDate: value[0],
                 endDate: value[1],
                 valid: false,
             };
         }
-        if(field == 'tag-selector') {
+        
+        if(field === 'tag-selector') {
             props.values = value;
         }
-        if(field == 'autocomplete') {
+        
+        if(field === 'autocomplete') {
             props.values = value;
         }
+        
         props.value = value;
 
         return props;

client/src/core-components/input.js

@@ -59,6 +59,7 @@ class Input extends React.Component {
         delete props.inputType;
         delete props.errored;
         delete props.password;
+        delete props.onIconClick;
 
         return props;
     }