From 3997faae5373f05238b4c2911c5508d83e0b99da Mon Sep 17 00:00:00 2001 From: ivan Date: Thu, 20 Oct 2016 16:43:01 -0300 Subject: [PATCH 1/8] Max - Add My Tickets title and description [skip ci] --- client/src/app-components/ticket-list.js | 2 -- .../src/app/admin/panel/tickets/admin-panel-my-tickets.js | 8 +++++--- client/src/data/fixtures/user-fixtures.js | 2 +- client/src/data/languages/en.js | 1 + 4 files changed, 7 insertions(+), 6 deletions(-) diff --git a/client/src/app-components/ticket-list.js b/client/src/app-components/ticket-list.js index 14b8a99f..b788083a 100644 --- a/client/src/app-components/ticket-list.js +++ b/client/src/app-components/ticket-list.js @@ -137,8 +137,6 @@ class TicketList extends React.Component { } compareFunction(row1, row2) { - let ans = 0; - if (row1.closed == row2.closed) { if (row1.unread == row2.unread) { let s1 = row1.date; diff --git a/client/src/app/admin/panel/tickets/admin-panel-my-tickets.js b/client/src/app/admin/panel/tickets/admin-panel-my-tickets.js index 03a0ffa2..f717dcc9 100644 --- a/client/src/app/admin/panel/tickets/admin-panel-my-tickets.js +++ b/client/src/app/admin/panel/tickets/admin-panel-my-tickets.js @@ -1,12 +1,14 @@ import React from 'react'; +import i18n from 'lib-app/i18n'; + +import Header from 'core-components/header'; + class AdminPanelMyTickets extends React.Component { render() { return ( -
- /admin/panel/tickets/my-tickets -
+
); } } diff --git a/client/src/data/fixtures/user-fixtures.js b/client/src/data/fixtures/user-fixtures.js index dcb09daf..45277f80 100644 --- a/client/src/data/fixtures/user-fixtures.js +++ b/client/src/data/fixtures/user-fixtures.js @@ -43,7 +43,7 @@ module.exports = [ return { status: 'success', data: { - sessionActive: false + sessionActive: true } }; } diff --git a/client/src/data/languages/en.js b/client/src/data/languages/en.js index 733b36e7..f922dca0 100644 --- a/client/src/data/languages/en.js +++ b/client/src/data/languages/en.js @@ -69,6 +69,7 @@ export default { 'ACCOUNT_DESCRIPTION': 'All your tickets are stored in your accounts\'s profile. Keep track off all your tickets you send to our staff team.', 'SUPPORT_CENTER_DESCRIPTION': 'Welcome to our support center. You can contact us through a tickets system. Your tickets will be answered by our staff.', 'CUSTOM_RESPONSES_DESCRIPTION': 'Custom responses are automated responses for common problems', + 'MY_TICKETS_DESCRIPTION': 'Here you can view the tickets you are responsible for.', //ERRORS 'EMAIL_OR_PASSWORD': 'Email or password invalid', From 82cb246eeb523e75273211072b7a806386992b0b Mon Sep 17 00:00:00 2001 From: ivan Date: Thu, 20 Oct 2016 18:47:35 -0300 Subject: [PATCH 2/8] Max - Add My Tickets List [skip ci] --- client/src/actions/admin-data-actions.js | 10 + client/src/app-components/ticket-list.js | 3 +- .../panel/tickets/admin-panel-my-tickets.js | 36 +- client/src/data/fixtures/staff-fixtures.js | 365 +++++++++++++++++- client/src/reducers/admin-data-reducer.js | 19 +- 5 files changed, 427 insertions(+), 6 deletions(-) diff --git a/client/src/actions/admin-data-actions.js b/client/src/actions/admin-data-actions.js index 624f0b82..d332e0ae 100644 --- a/client/src/actions/admin-data-actions.js +++ b/client/src/actions/admin-data-actions.js @@ -10,5 +10,15 @@ export default { data: {} }) }; + }, + + retrieveMyTickets() { + return { + type: 'MY_TICKETS', + payload: API.call({ + path: '/staff/get-tickets', + data: {} + }) + }; } }; \ No newline at end of file diff --git a/client/src/app-components/ticket-list.js b/client/src/app-components/ticket-list.js index b788083a..7fe0f5d0 100644 --- a/client/src/app-components/ticket-list.js +++ b/client/src/app-components/ticket-list.js @@ -11,6 +11,7 @@ import DateTransformer from 'lib-core/date-transformer'; class TicketList extends React.Component { static propTypes = { + loading: React.PropTypes.bool, tickets: React.PropTypes.arrayOf(React.PropTypes.object), type: React.PropTypes.oneOf([ 'primary', @@ -26,7 +27,7 @@ class TicketList extends React.Component { render() { return (
- +
); } diff --git a/client/src/app/admin/panel/tickets/admin-panel-my-tickets.js b/client/src/app/admin/panel/tickets/admin-panel-my-tickets.js index f717dcc9..02f5fc80 100644 --- a/client/src/app/admin/panel/tickets/admin-panel-my-tickets.js +++ b/client/src/app/admin/panel/tickets/admin-panel-my-tickets.js @@ -1,16 +1,46 @@ import React from 'react'; +import {connect} from 'react-redux'; import i18n from 'lib-app/i18n'; +import AdminDataAction from 'actions/admin-data-actions'; import Header from 'core-components/header'; +import DropDown from 'core-components/drop-down'; +import TicketList from 'app-components/ticket-list'; class AdminPanelMyTickets extends React.Component { - + + componentDidMount() { + this.props.dispatch(AdminDataAction.retrieveMyTickets()); + } + render() { return ( -
+
+
+ + +
); } + + getProps() { + console.log(this.props.tickets); + + return { + items: this.props.departments.map(function (obj) { + return { + content: obj.name + }; + }), + size: 'medium' + }; + } } -export default AdminPanelMyTickets; \ No newline at end of file +export default connect((store) => { + return { + departments: store.session.userDepartments, + tickets: store.adminData.myTickets + }; +})(AdminPanelMyTickets); diff --git a/client/src/data/fixtures/staff-fixtures.js b/client/src/data/fixtures/staff-fixtures.js index ea6afbcd..69272f39 100644 --- a/client/src/data/fixtures/staff-fixtures.js +++ b/client/src/data/fixtures/staff-fixtures.js @@ -14,10 +14,373 @@ module.exports = [ departments: [ {id: 1, name: 'Sales Support'}, {id: 2, name: 'Technical Issues'}, - {id: 3, name: 'System and Administration'} + {id: 3, name: 'System and Administration'}, + {id: 4, name: 'Guillermo\'s department'} ] } }; } + }, + { + path: '/staff/get-tickets', + time: 2000, + response: function () { + return { + status: 'success', + data: [ + { + ticketNumber: '445441', + title: 'Problem with installation', + content: 'I had a problem with the installation of the php server', + department: { + id: 2, + name: 'Environment Setup' + }, + date: '20160416', + file: 'http://www.opensupports.com/some_file.zip', + language: 'en', + unread: true, + closed: false, + priority: 'low', + author: { + id: 12, + name: 'Haskell Curry', + email: 'haskell@lambda.com' + }, + owner: { + id: 15, + name: 'Steve Jobs', + email: 'steve@jobs.com' + }, + actions: [ + { + type: 'ASSIGN', + date: '20150409', + author: { + name: 'Emilia Clarke', + email: 'jobs@steve.com', + profilePic: 'http://i65.tinypic.com/9bep95.jpg', + staff: true + } + }, + { + type: 'COMMENT', + date: '20150409', + content: 'Do you have apache installed? It generally happens if you dont have apache.', + author: { + name: 'Emilia Clarke', + email: 'jobs@steve.com', + profilePic: 'http://i65.tinypic.com/9bep95.jpg', + staff: true + } + }, + { + type: 'UN_ASSIGN', + date: '20150410', + author: { + name: 'Emilia Clarke', + email: 'jobs@steve.com', + profilePic: 'http://i65.tinypic.com/9bep95.jpg', + staff: true + } + }, + { + type: 'DEPARTMENT_CHANGED', + date: '20150411', + content: 'System support', + author: { + name: 'Emilia Clarke', + email: 'jobs@steve.com', + profilePic: 'http://i65.tinypic.com/9bep95.jpg', + staff: true + } + }, + { + type: 'COMMENT', + date: '20150412', + content: 'I have already installed apache, but the problem persists', + author: { + name: 'Haskell Curry', + steve: 'haskell@lambda.com', + staff: false + } + }, + { + type: 'PRIORITY_CHANGED', + date: '20150413', + content: 'MEDIUM', + author: { + name: 'Emilia Clarke', + email: 'jobs@steve.com', + profilePic: 'http://i65.tinypic.com/9bep95.jpg', + staff: true + } + }, + { + type: 'COMMENT', + date: '20150511', + content: 'Thanks!, I solved it by myself', + author: { + name: 'Haskell Curry', + steve: 'haskell@lambda.com', + staff: false + } + }, + { + type: 'CLOSE', + date: '20150513', + author: { + name: 'Emilia Clarke', + email: 'jobs@steve.com', + profilePic: 'http://i65.tinypic.com/9bep95.jpg', + staff: true + } + }, + { + type: 'RE_OPEN', + date: '20151018', + author: { + name: 'Haskell Curry', + email: 'haskell@lambda.com', + staff: false + } + } + ] + }, + { + ticketNumber: '878552', + title: 'Lorem ipsum door', + content: 'I had a problem with the installation of the php server', + department: { + id: 2, + name: 'Environment Setup' + }, + date: '20160415', + file: 'http://www.opensupports.com/some_file.zip', + language: 'en', + unread: false, + closed: false, + priority: 'medium', + author: { + name: 'Haskell Curry', + email: 'haskell@lambda.com' + }, + owner: { + name: 'Steve Jobs' + }, + actions: [ + { + type: 'ASSIGN', + date: '20150409', + author: { + name: 'Emilia Clarke', + email: 'jobs@steve.com', + profilePic: 'http://i65.tinypic.com/9bep95.jpg', + staff: true + } + }, + { + type: 'COMMENT', + date: '20150409', + content: 'Do you have apache installed? It generally happens if you dont have apache.', + author: { + name: 'Emilia Clarke', + email: 'jobs@steve.com', + profilePic: 'http://i65.tinypic.com/9bep95.jpg', + staff: true + } + }, + { + type: 'UN_ASSIGN', + date: '20150410', + author: { + name: 'Emilia Clarke', + email: 'jobs@steve.com', + profilePic: 'http://i65.tinypic.com/9bep95.jpg', + staff: true + } + }, + { + type: 'DEPARTMENT_CHANGED', + date: '20150411', + content: 'System support', + author: { + name: 'Emilia Clarke', + email: 'jobs@steve.com', + profilePic: 'http://i65.tinypic.com/9bep95.jpg', + staff: true + } + }, + { + type: 'COMMENT', + date: '20150412', + content: 'I have already installed apache, but the problem persists', + author: { + name: 'Haskell Curry', + steve: 'haskell@lambda.com', + staff: false + } + }, + { + type: 'PRIORITY_CHANGED', + date: '20150413', + content: 'MEDIUM', + author: { + name: 'Emilia Clarke', + email: 'jobs@steve.com', + profilePic: 'http://i65.tinypic.com/9bep95.jpg', + staff: true + } + }, + { + type: 'COMMENT', + date: '20150511', + content: 'Thanks!, I soved it by myself', + author: { + name: 'Haskell Curry', + steve: 'haskell@lambda.com', + staff: false + } + }, + { + type: 'CLOSE', + date: '20150513', + author: { + name: 'Emilia Clarke', + email: 'jobs@steve.com', + profilePic: 'http://i65.tinypic.com/9bep95.jpg', + staff: true + } + }, + { + type: 'RE_OPEN', + date: '20151018', + author: { + name: 'Haskell Curry', + email: 'haskell@lambda.com', + staff: false + } + } + ] + }, + { + ticketNumber: '118551', + title: 'Lorem ipsum door', + content: 'I had a problem with the installation of the php server', + department: { + id: 2, + name: 'Environment Setup' + }, + date: '20150409', + file: 'http://www.opensupports.com/some_file.zip', + language: 'en', + unread: false, + closed: false, + priority: 'high', + author: { + name: 'Haskell Curry', + email: 'haskell@lambda.com' + }, + owner: { + name: 'Steve Jobs' + }, + actions: [ + { + type: 'ASSIGN', + date: '20150409', + author: { + name: 'Emilia Clarke', + email: 'jobs@steve.com', + profilePic: 'http://i65.tinypic.com/9bep95.jpg', + staff: true + } + }, + { + type: 'COMMENT', + date: '20150409', + content: 'Do you have apache installed? It generally happens if you dont have apache.', + author: { + name: 'Emilia Clarke', + email: 'jobs@steve.com', + profilePic: 'http://i65.tinypic.com/9bep95.jpg', + staff: true + } + }, + { + type: 'UN_ASSIGN', + date: '20150410', + author: { + name: 'Emilia Clarke', + email: 'jobs@steve.com', + profilePic: 'http://i65.tinypic.com/9bep95.jpg', + staff: true + } + }, + { + type: 'DEPARTMENT_CHANGED', + date: '20150411', + content: 'System support', + author: { + name: 'Emilia Clarke', + email: 'jobs@steve.com', + profilePic: 'http://i65.tinypic.com/9bep95.jpg', + staff: true + } + }, + { + type: 'COMMENT', + date: '20150412', + content: 'I have already installed apache, but the problem persists', + author: { + name: 'Haskell Curry', + steve: 'haskell@lambda.com', + staff: false + } + }, + { + type: 'PRIORITY_CHANGED', + date: '20150413', + content: 'MEDIUM', + author: { + name: 'Emilia Clarke', + email: 'jobs@steve.com', + profilePic: 'http://i65.tinypic.com/9bep95.jpg', + staff: true + } + }, + { + type: 'COMMENT', + date: '20150511', + content: 'Thanks!, I soved it by myself', + author: { + name: 'Haskell Curry', + steve: 'haskell@lambda.com', + staff: false + } + }, + { + type: 'CLOSE', + date: '20150513', + author: { + name: 'Emilia Clarke', + email: 'jobs@steve.com', + profilePic: 'http://i65.tinypic.com/9bep95.jpg', + staff: true + } + }, + { + type: 'RE_OPEN', + date: '20151018', + author: { + name: 'Haskell Curry', + email: 'haskell@lambda.com', + staff: false + } + } + ] + } + ] + } + } } ]; \ No newline at end of file diff --git a/client/src/reducers/admin-data-reducer.js b/client/src/reducers/admin-data-reducer.js index 60c59d20..ba6418e4 100644 --- a/client/src/reducers/admin-data-reducer.js +++ b/client/src/reducers/admin-data-reducer.js @@ -6,6 +6,8 @@ class AdminDataReducer extends Reducer { getInitialState() { return { + myTickets: [], + myTicketsLoaded: false, customResponses: [], customResponsesLoaded: false }; @@ -13,7 +15,9 @@ class AdminDataReducer extends Reducer { getTypeHandlers() { return { - 'CUSTOM_RESPONSES_FULFILLED': this.onCustomResponses + 'CUSTOM_RESPONSES_FULFILLED': this.onCustomResponses, + 'MY_TICKETS_FULFILLED': this.onMyTicketsRetrieved, + 'MY_TICKETS_PENDING': this.onMyTicketsPending }; } @@ -23,6 +27,19 @@ class AdminDataReducer extends Reducer { customResponsesLoaded: true }); } + + onMyTicketsRetrieved(state, payload) { + return _.extend({}, state, { + myTickets: payload.data, + customResponsesLoaded: true + }) + } + + onMyTicketsPending(state) { + return _.extennd({}, state, { + myTicketsLoaded: true + }) + } } export default AdminDataReducer.getInstance(); \ No newline at end of file From 3179b29158b51d28cb1915f6e5dc101a90503dd3 Mon Sep 17 00:00:00 2001 From: ivan Date: Fri, 28 Oct 2016 03:28:11 -0300 Subject: [PATCH 3/8] Ivan - Add my tickets department dropdown, fix loading, add filter, merge master[skip ci] --- client/src/app-components/ticket-list.js | 4 +- .../panel/tickets/admin-panel-my-tickets.js | 69 ++++++++++++++++--- .../panel/tickets/admin-panel-my-tickets.scss | 6 ++ client/src/app/demo/components-demo-page.js | 2 +- client/src/core-components/table.scss | 2 + client/src/core-components/tooltip.scss | 1 + client/src/data/fixtures/staff-fixtures.js | 44 +++++++++--- client/src/data/languages/en.js | 1 + client/src/reducers/admin-data-reducer.js | 8 +-- 9 files changed, 110 insertions(+), 27 deletions(-) create mode 100644 client/src/app/admin/panel/tickets/admin-panel-my-tickets.scss diff --git a/client/src/app-components/ticket-list.js b/client/src/app-components/ticket-list.js index 7fe0f5d0..e9c140fd 100644 --- a/client/src/app-components/ticket-list.js +++ b/client/src/app-components/ticket-list.js @@ -12,6 +12,7 @@ import DateTransformer from 'lib-core/date-transformer'; class TicketList extends React.Component { static propTypes = { loading: React.PropTypes.bool, + ticketPath: React.PropTypes.string, tickets: React.PropTypes.arrayOf(React.PropTypes.object), type: React.PropTypes.oneOf([ 'primary', @@ -21,6 +22,7 @@ class TicketList extends React.Component { static defaultProps = { tickets: [], + ticketPath: '/dashboard/ticket/', type: 'primary' }; @@ -106,7 +108,7 @@ class TicketList extends React.Component { ), title: ( - ), diff --git a/client/src/app/admin/panel/tickets/admin-panel-my-tickets.js b/client/src/app/admin/panel/tickets/admin-panel-my-tickets.js index 02f5fc80..95e3214f 100644 --- a/client/src/app/admin/panel/tickets/admin-panel-my-tickets.js +++ b/client/src/app/admin/panel/tickets/admin-panel-my-tickets.js @@ -1,4 +1,5 @@ import React from 'react'; +import _ from 'lodash'; import {connect} from 'react-redux'; import i18n from 'lib-app/i18n'; @@ -9,6 +10,15 @@ import DropDown from 'core-components/drop-down'; import TicketList from 'app-components/ticket-list'; class AdminPanelMyTickets extends React.Component { + + static defaultProps = { + departments: [], + tickets: [] + }; + + state = { + selectedDepartment: 0 + }; componentDidMount() { this.props.dispatch(AdminDataAction.retrieveMyTickets()); @@ -16,31 +26,68 @@ class AdminPanelMyTickets extends React.Component { render() { return ( -
+
- - +
+ +
+
); } getProps() { - console.log(this.props.tickets); - return { - items: this.props.departments.map(function (obj) { - return { - content: obj.name - }; - }), + tickets: this.getTickets(), + type: 'secondary', + loading: this.props.loading, + ticketPath: '/admin/panel/tickets/view-ticket/' + }; + } + + getDropdownProps() { + return { + items: this.getDepartments(), + onChange: this.changeSelectedDepartment.bind(this), size: 'medium' }; } + + getTickets() { + return (this.state.selectedDepartment) ? _.filter(this.props.tickets, (ticket) => { + return ticket.department.id == this.state.selectedDepartment + }) : this.props.tickets; + } + + getDepartments() { + let departments = this.props.departments.map((department) => { + return {content: department.name}; + }); + + departments.unshift({ + content: i18n('ALL_DEPARTMENTS') + }); + + return departments; + } + + changeSelectedDepartment(event) { + if(event.index === 0) { + this.setState({ + selectedDepartment: 0 + }); + } else { + this.setState({ + selectedDepartment: this.props.departments[event.index - 1].id + }); + } + } } export default connect((store) => { return { departments: store.session.userDepartments, - tickets: store.adminData.myTickets + tickets: store.adminData.myTickets, + loading: !store.adminData.myTicketsLoaded }; })(AdminPanelMyTickets); diff --git a/client/src/app/admin/panel/tickets/admin-panel-my-tickets.scss b/client/src/app/admin/panel/tickets/admin-panel-my-tickets.scss new file mode 100644 index 00000000..1a79e191 --- /dev/null +++ b/client/src/app/admin/panel/tickets/admin-panel-my-tickets.scss @@ -0,0 +1,6 @@ +.admin-panel-my-tickets { + + &__department-select { + margin-bottom: 25px; + } +} \ No newline at end of file diff --git a/client/src/app/demo/components-demo-page.js b/client/src/app/demo/components-demo-page.js index 1d5da38f..a2dd7b7f 100644 --- a/client/src/app/demo/components-demo-page.js +++ b/client/src/app/demo/components-demo-page.js @@ -166,7 +166,7 @@ let DemoPage = React.createClass({ else if(a.title1 > b.title1) ans = 1; return ans; - }}/> + }} loading/> ) } ], diff --git a/client/src/core-components/table.scss b/client/src/core-components/table.scss index 62dd409c..54a73615 100644 --- a/client/src/core-components/table.scss +++ b/client/src/core-components/table.scss @@ -51,6 +51,8 @@ &__loading-wrapper { min-height: 200px; + position: relative; + background-color: $grey; } &__loading { diff --git a/client/src/core-components/tooltip.scss b/client/src/core-components/tooltip.scss index 50bd126d..bbe42bdb 100644 --- a/client/src/core-components/tooltip.scss +++ b/client/src/core-components/tooltip.scss @@ -17,6 +17,7 @@ background-color: #F7F7F7; color: black; padding: 10px; + z-index: 1000; } &__pointer { diff --git a/client/src/data/fixtures/staff-fixtures.js b/client/src/data/fixtures/staff-fixtures.js index 69272f39..5b94d0b1 100644 --- a/client/src/data/fixtures/staff-fixtures.js +++ b/client/src/data/fixtures/staff-fixtures.js @@ -13,9 +13,7 @@ module.exports = [ staff: true, departments: [ {id: 1, name: 'Sales Support'}, - {id: 2, name: 'Technical Issues'}, - {id: 3, name: 'System and Administration'}, - {id: 4, name: 'Guillermo\'s department'} + {id: 2, name: 'Technical Issues'} ] } }; @@ -23,7 +21,7 @@ module.exports = [ }, { path: '/staff/get-tickets', - time: 2000, + time: 300, response: function () { return { status: 'success', @@ -34,7 +32,7 @@ module.exports = [ content: 'I had a problem with the installation of the php server', department: { id: 2, - name: 'Environment Setup' + name: 'Technical Issues' }, date: '20160416', file: 'http://www.opensupports.com/some_file.zip', @@ -52,7 +50,7 @@ module.exports = [ name: 'Steve Jobs', email: 'steve@jobs.com' }, - actions: [ + events: [ { type: 'ASSIGN', date: '20150409', @@ -153,7 +151,7 @@ module.exports = [ content: 'I had a problem with the installation of the php server', department: { id: 2, - name: 'Environment Setup' + name: 'Technical Issues' }, date: '20160415', file: 'http://www.opensupports.com/some_file.zip', @@ -168,7 +166,7 @@ module.exports = [ owner: { name: 'Steve Jobs' }, - actions: [ + events: [ { type: 'ASSIGN', date: '20150409', @@ -269,7 +267,7 @@ module.exports = [ content: 'I had a problem with the installation of the php server', department: { id: 2, - name: 'Environment Setup' + name: 'Technical Issues' }, date: '20150409', file: 'http://www.opensupports.com/some_file.zip', @@ -284,7 +282,7 @@ module.exports = [ owner: { name: 'Steve Jobs' }, - actions: [ + events: [ { type: 'ASSIGN', date: '20150409', @@ -378,6 +376,32 @@ module.exports = [ } } ] + }, + { + ticketNumber: '445441', + title: 'Inscription ACM ICPC', + content: 'I had a problem with the installation of the php server', + department: { + id: 1, + name: 'Sales Support' + }, + date: '20160416', + file: 'http://www.opensupports.com/some_file.zip', + language: 'en', + unread: false, + closed: false, + priority: 'low', + author: { + id: 12, + name: 'Haskell Curry', + email: 'haskell@lambda.com' + }, + owner: { + id: 15, + name: 'Steve Jobs', + email: 'steve@jobs.com' + }, + events: [] } ] } diff --git a/client/src/data/languages/en.js b/client/src/data/languages/en.js index 338452aa..93501689 100644 --- a/client/src/data/languages/en.js +++ b/client/src/data/languages/en.js @@ -72,6 +72,7 @@ export default { 'UN_ASSIGN': 'Unassign', 'VIEW_TICKET': 'View Ticket', 'SELECT_CUSTOM_RESPONSE': 'Select a custom response...', + 'ALL_DEPARTMENTS': 'All Departments', //VIEW DESCRIPTIONS 'CREATE_TICKET_DESCRIPTION': 'This is a form for creating tickets. Fill the form and send us your issues/doubts/suggestions. Our support system will answer it as soon as possible.', diff --git a/client/src/reducers/admin-data-reducer.js b/client/src/reducers/admin-data-reducer.js index d0695811..32e2fe24 100644 --- a/client/src/reducers/admin-data-reducer.js +++ b/client/src/reducers/admin-data-reducer.js @@ -17,7 +17,7 @@ class AdminDataReducer extends Reducer { getTypeHandlers() { return { 'CUSTOM_RESPONSES_FULFILLED': this.onCustomResponses, - 'SESSION_CHECKED': this.onSessionChecked + 'SESSION_CHECKED': this.onSessionChecked, 'MY_TICKETS_FULFILLED': this.onMyTicketsRetrieved, 'MY_TICKETS_PENDING': this.onMyTicketsPending }; @@ -44,13 +44,13 @@ class AdminDataReducer extends Reducer { onMyTicketsRetrieved(state, payload) { return _.extend({}, state, { myTickets: payload.data, - customResponsesLoaded: true + myTicketsLoaded: true }) } onMyTicketsPending(state) { - return _.extennd({}, state, { - myTicketsLoaded: true + return _.extend({}, state, { + myTicketsLoaded: false }) } } From 343b455905c7fbfe407d4bb8822050e3f5a7ae5f Mon Sep 17 00:00:00 2001 From: ivan Date: Fri, 28 Oct 2016 03:30:04 -0300 Subject: [PATCH 4/8] Ivan - Minor tweak demo[skip ci] --- client/src/app/demo/components-demo-page.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/client/src/app/demo/components-demo-page.js b/client/src/app/demo/components-demo-page.js index a2dd7b7f..1d5da38f 100644 --- a/client/src/app/demo/components-demo-page.js +++ b/client/src/app/demo/components-demo-page.js @@ -166,7 +166,7 @@ let DemoPage = React.createClass({ else if(a.title1 > b.title1) ans = 1; return ans; - }} loading/> + }}/> ) } ], From 1966697a218f66e1005829a1c19a11321dbcd34d Mon Sep 17 00:00:00 2001 From: ivan Date: Fri, 28 Oct 2016 04:01:03 -0300 Subject: [PATCH 5/8] Ivan - Add all tickets and new tickets[skip ci] --- client/src/actions/admin-data-actions.js | 20 ++ client/src/app-components/ticket-list.js | 54 +++++- client/src/app-components/ticket-list.scss | 5 + .../panel/tickets/admin-panel-all-tickets.js | 39 +++- .../panel/tickets/admin-panel-my-tickets.js | 50 +---- .../panel/tickets/admin-panel-my-tickets.scss | 6 - .../panel/tickets/admin-panel-new-tickets.js | 39 +++- client/src/data/fixtures/staff-fixtures.js | 178 ++++++++++++++++++ client/src/data/languages/en.js | 2 + client/src/reducers/admin-data-reducer.js | 40 +++- 10 files changed, 366 insertions(+), 67 deletions(-) create mode 100644 client/src/app-components/ticket-list.scss delete mode 100644 client/src/app/admin/panel/tickets/admin-panel-my-tickets.scss diff --git a/client/src/actions/admin-data-actions.js b/client/src/actions/admin-data-actions.js index d332e0ae..f9ac73f7 100644 --- a/client/src/actions/admin-data-actions.js +++ b/client/src/actions/admin-data-actions.js @@ -20,5 +20,25 @@ export default { data: {} }) }; + }, + + retrieveNewTickets() { + return { + type: 'NEW_TICKETS', + payload: API.call({ + path: '/staff/get-new-tickets', + data: {} + }) + }; + }, + + retrieveAllTickets() { + return { + type: 'ALL_TICKETS', + payload: API.call({ + path: '/staff/get-all-tickets', + data: {} + }) + }; } }; \ No newline at end of file diff --git a/client/src/app-components/ticket-list.js b/client/src/app-components/ticket-list.js index e9c140fd..4d75493a 100644 --- a/client/src/app-components/ticket-list.js +++ b/client/src/app-components/ticket-list.js @@ -1,16 +1,19 @@ import React from 'react'; +import _ from 'lodash'; import i18n from 'lib-app/i18n'; +import DateTransformer from 'lib-core/date-transformer'; + +import TicketInfo from 'app-components/ticket-info'; import Table from 'core-components/table'; import Button from 'core-components/button'; import Tooltip from 'core-components/tooltip'; -import TicketInfo from 'app-components/ticket-info'; - -import DateTransformer from 'lib-core/date-transformer'; +import DropDown from 'core-components/drop-down'; class TicketList extends React.Component { static propTypes = { + departments: React.PropTypes.array, loading: React.PropTypes.bool, ticketPath: React.PropTypes.string, tickets: React.PropTypes.arrayOf(React.PropTypes.object), @@ -26,14 +29,51 @@ class TicketList extends React.Component { type: 'primary' }; + state = { + selectedDepartment: 0 + }; + render() { return (
+ {(this.props.type === 'secondary') ? this.renderDepartmentsDropDown() : null}
); } + renderDepartmentsDropDown() { + return ( +
+ +
+ ); + } + + getDepartmentDropdownProps() { + return { + items: this.getDepartments(), + onChange: (event) => { + this.setState({ + selectedDepartment: event.index && this.props.departments[event.index - 1].id + }); + }, + size: 'medium' + }; + } + + getDepartments() { + let departments = this.props.departments.map((department) => { + return {content: department.name}; + }); + + departments.unshift({ + content: i18n('ALL_DEPARTMENTS') + }); + + return departments; + } + getTableHeaders() { if (this.props.type == 'primary' ) { return [ @@ -95,7 +135,13 @@ class TicketList extends React.Component { } getTableRows() { - return this.props.tickets.map(this.gerTicketTableObject.bind(this)); + return this.getTickets().map(this.gerTicketTableObject.bind(this)); + } + + getTickets() { + return (this.state.selectedDepartment) ? _.filter(this.props.tickets, (ticket) => { + return ticket.department.id == this.state.selectedDepartment + }) : this.props.tickets; } gerTicketTableObject(ticket) { diff --git a/client/src/app-components/ticket-list.scss b/client/src/app-components/ticket-list.scss new file mode 100644 index 00000000..f6f8d91c --- /dev/null +++ b/client/src/app-components/ticket-list.scss @@ -0,0 +1,5 @@ +.ticket-list { + &__department-selector { + margin-bottom: 25px; + } +} \ No newline at end of file diff --git a/client/src/app/admin/panel/tickets/admin-panel-all-tickets.js b/client/src/app/admin/panel/tickets/admin-panel-all-tickets.js index 93a4f327..58816efe 100644 --- a/client/src/app/admin/panel/tickets/admin-panel-all-tickets.js +++ b/client/src/app/admin/panel/tickets/admin-panel-all-tickets.js @@ -1,14 +1,47 @@ import React from 'react'; +import {connect} from 'react-redux'; + +import i18n from 'lib-app/i18n'; + +import AdminDataAction from 'actions/admin-data-actions'; +import Header from 'core-components/header'; +import TicketList from 'app-components/ticket-list'; class AdminPanelAllTickets extends React.Component { + static defaultProps = { + departments: [], + tickets: [] + }; + + componentDidMount() { + this.props.dispatch(AdminDataAction.retrieveAllTickets()); + } + render() { return ( -
- /admin/panel/tickets/all-tickets +
+
+
); } + + getProps() { + return { + departments: this.props.departments, + tickets: this.props.tickets, + type: 'secondary', + loading: this.props.loading, + ticketPath: '/admin/panel/tickets/view-ticket/' + }; + } } -export default AdminPanelAllTickets; \ No newline at end of file +export default connect((store) => { + return { + departments: store.session.userDepartments, + tickets: store.adminData.newTickets, + loading: !store.adminData.newTicketsLoaded + }; +})(AdminPanelAllTickets); diff --git a/client/src/app/admin/panel/tickets/admin-panel-my-tickets.js b/client/src/app/admin/panel/tickets/admin-panel-my-tickets.js index 95e3214f..512454b1 100644 --- a/client/src/app/admin/panel/tickets/admin-panel-my-tickets.js +++ b/client/src/app/admin/panel/tickets/admin-panel-my-tickets.js @@ -1,12 +1,10 @@ import React from 'react'; -import _ from 'lodash'; import {connect} from 'react-redux'; import i18n from 'lib-app/i18n'; import AdminDataAction from 'actions/admin-data-actions'; import Header from 'core-components/header'; -import DropDown from 'core-components/drop-down'; import TicketList from 'app-components/ticket-list'; class AdminPanelMyTickets extends React.Component { @@ -16,10 +14,6 @@ class AdminPanelMyTickets extends React.Component { tickets: [] }; - state = { - selectedDepartment: 0 - }; - componentDidMount() { this.props.dispatch(AdminDataAction.retrieveMyTickets()); } @@ -28,9 +22,6 @@ class AdminPanelMyTickets extends React.Component { return (
-
- -
); @@ -38,50 +29,13 @@ class AdminPanelMyTickets extends React.Component { getProps() { return { - tickets: this.getTickets(), + departments: this.props.departments, + tickets: this.props.tickets, type: 'secondary', loading: this.props.loading, ticketPath: '/admin/panel/tickets/view-ticket/' }; } - - getDropdownProps() { - return { - items: this.getDepartments(), - onChange: this.changeSelectedDepartment.bind(this), - size: 'medium' - }; - } - - getTickets() { - return (this.state.selectedDepartment) ? _.filter(this.props.tickets, (ticket) => { - return ticket.department.id == this.state.selectedDepartment - }) : this.props.tickets; - } - - getDepartments() { - let departments = this.props.departments.map((department) => { - return {content: department.name}; - }); - - departments.unshift({ - content: i18n('ALL_DEPARTMENTS') - }); - - return departments; - } - - changeSelectedDepartment(event) { - if(event.index === 0) { - this.setState({ - selectedDepartment: 0 - }); - } else { - this.setState({ - selectedDepartment: this.props.departments[event.index - 1].id - }); - } - } } export default connect((store) => { diff --git a/client/src/app/admin/panel/tickets/admin-panel-my-tickets.scss b/client/src/app/admin/panel/tickets/admin-panel-my-tickets.scss deleted file mode 100644 index 1a79e191..00000000 --- a/client/src/app/admin/panel/tickets/admin-panel-my-tickets.scss +++ /dev/null @@ -1,6 +0,0 @@ -.admin-panel-my-tickets { - - &__department-select { - margin-bottom: 25px; - } -} \ No newline at end of file diff --git a/client/src/app/admin/panel/tickets/admin-panel-new-tickets.js b/client/src/app/admin/panel/tickets/admin-panel-new-tickets.js index 42d250a8..819e9b56 100644 --- a/client/src/app/admin/panel/tickets/admin-panel-new-tickets.js +++ b/client/src/app/admin/panel/tickets/admin-panel-new-tickets.js @@ -1,14 +1,47 @@ import React from 'react'; +import {connect} from 'react-redux'; + +import i18n from 'lib-app/i18n'; + +import AdminDataAction from 'actions/admin-data-actions'; +import Header from 'core-components/header'; +import TicketList from 'app-components/ticket-list'; class AdminPanelNewTickets extends React.Component { + static defaultProps = { + departments: [], + tickets: [] + }; + + componentDidMount() { + this.props.dispatch(AdminDataAction.retrieveNewTickets()); + } + render() { return ( -
- /admin/panel/tickets/new-tickets +
+
+
); } + + getProps() { + return { + departments: this.props.departments, + tickets: this.props.tickets, + type: 'secondary', + loading: this.props.loading, + ticketPath: '/admin/panel/tickets/view-ticket/' + }; + } } -export default AdminPanelNewTickets; \ No newline at end of file +export default connect((store) => { + return { + departments: store.session.userDepartments, + tickets: store.adminData.newTickets, + loading: !store.adminData.newTicketsLoaded + }; +})(AdminPanelNewTickets); diff --git a/client/src/data/fixtures/staff-fixtures.js b/client/src/data/fixtures/staff-fixtures.js index 5b94d0b1..4d1686cd 100644 --- a/client/src/data/fixtures/staff-fixtures.js +++ b/client/src/data/fixtures/staff-fixtures.js @@ -406,5 +406,183 @@ module.exports = [ ] } } + }, + { + path: '/staff/get-new-tickets', + time: 300, + response: function () { + return { + status: 'success', + data: [ + { + ticketNumber: '445441', + title: 'Inscription ACM ICPC', + content: 'I had a problem with the installation of the php server', + department: { + id: 1, + name: 'Sales Support' + }, + date: '20160416', + file: 'http://www.opensupports.com/some_file.zip', + language: 'en', + unread: true, + closed: false, + priority: 'low', + author: { + id: 12, + name: 'Haskell Curry', + email: 'haskell@lambda.com' + }, + owner: { + id: 15, + name: 'Steve Jobs', + email: 'steve@jobs.com' + }, + events: [] + }, + { + ticketNumber: '445441', + title: 'Inscription ACM ICPC', + content: 'I had a problem with the installation of the php server', + department: { + id: 1, + name: 'Sales Support' + }, + date: '20160416', + file: 'http://www.opensupports.com/some_file.zip', + language: 'en', + unread: true, + closed: false, + priority: 'low', + author: { + id: 12, + name: 'Haskell Curry', + email: 'haskell@lambda.com' + }, + owner: { + id: 15, + name: 'Steve Jobs', + email: 'steve@jobs.com' + }, + events: [] + }, + { + ticketNumber: '445441', + title: 'Code jam is awesome', + content: 'I had a problem with the installation of the php server', + department: { + id: 2, + name: 'Technical Issues' + }, + date: '20160416', + file: 'http://www.opensupports.com/some_file.zip', + language: 'en', + unread: true, + closed: false, + priority: 'low', + author: { + id: 12, + name: 'Haskell Curry', + email: 'haskell@lambda.com' + }, + owner: { + id: 15, + name: 'Steve Jobs', + email: 'steve@jobs.com' + }, + events: [] + } + ] + } + } + }, + { + path: '/staff/get-all-tickets', + time: 300, + response: function () { + return { + status: 'success', + data: [ + { + ticketNumber: '445441', + title: 'Inscription ACM ICPC', + content: 'I had a problem with the installation of the php server', + department: { + id: 1, + name: 'Sales Support' + }, + date: '20160416', + file: 'http://www.opensupports.com/some_file.zip', + language: 'en', + unread: true, + closed: false, + priority: 'low', + author: { + id: 12, + name: 'Haskell Curry', + email: 'haskell@lambda.com' + }, + owner: { + id: 15, + name: 'Steve Jobs', + email: 'steve@jobs.com' + }, + events: [] + }, + { + ticketNumber: '445441', + title: 'Inscription ACM ICPC', + content: 'I had a problem with the installation of the php server', + department: { + id: 1, + name: 'Sales Support' + }, + date: '20160416', + file: 'http://www.opensupports.com/some_file.zip', + language: 'en', + unread: true, + closed: false, + priority: 'low', + author: { + id: 12, + name: 'Haskell Curry', + email: 'haskell@lambda.com' + }, + owner: { + id: 15, + name: 'Steve Jobs', + email: 'steve@jobs.com' + }, + events: [] + }, + { + ticketNumber: '445441', + title: 'Code jam is awesome', + content: 'I had a problem with the installation of the php server', + department: { + id: 2, + name: 'Technical Issues' + }, + date: '20160416', + file: 'http://www.opensupports.com/some_file.zip', + language: 'en', + unread: true, + closed: false, + priority: 'low', + author: { + id: 12, + name: 'Haskell Curry', + email: 'haskell@lambda.com' + }, + owner: { + id: 15, + name: 'Steve Jobs', + email: 'steve@jobs.com' + }, + events: [] + } + ] + } + } } ]; \ No newline at end of file diff --git a/client/src/data/languages/en.js b/client/src/data/languages/en.js index 93501689..3721809b 100644 --- a/client/src/data/languages/en.js +++ b/client/src/data/languages/en.js @@ -83,6 +83,8 @@ export default { 'SUPPORT_CENTER_DESCRIPTION': 'Welcome to our support center. You can contact us through a tickets system. Your tickets will be answered by our staff.', 'CUSTOM_RESPONSES_DESCRIPTION': 'Custom responses are automated responses for common problems', 'MY_TICKETS_DESCRIPTION': 'Here you can view the tickets you are responsible for.', + 'NEW_TICKETS_DESCRIPTION': 'Here you can view all the new tickets that are not assigned by anyone.', + 'ALL_TICKETS_DESCRIPTION': 'Here you can view the tickets of the departments you are assigned.', 'TICKET_VIEW_DESCRIPTION': 'This ticket has been sent by a customer. Here you can respond or assign the ticket', //ERRORS diff --git a/client/src/reducers/admin-data-reducer.js b/client/src/reducers/admin-data-reducer.js index 32e2fe24..6ed135ee 100644 --- a/client/src/reducers/admin-data-reducer.js +++ b/client/src/reducers/admin-data-reducer.js @@ -7,10 +7,14 @@ class AdminDataReducer extends Reducer { getInitialState() { return { + customResponses: [], + customResponsesLoaded: false, myTickets: [], myTicketsLoaded: false, - customResponses: [], - customResponsesLoaded: false + newTickets: [], + newTicketsLoaded: false, + allTickets: [], + allTicketsLoaded: false }; } @@ -19,7 +23,11 @@ class AdminDataReducer extends Reducer { 'CUSTOM_RESPONSES_FULFILLED': this.onCustomResponses, 'SESSION_CHECKED': this.onSessionChecked, 'MY_TICKETS_FULFILLED': this.onMyTicketsRetrieved, - 'MY_TICKETS_PENDING': this.onMyTicketsPending + 'MY_TICKETS_PENDING': this.onMyTicketsPending, + 'NEW_TICKETS_FULFILLED': this.onNewTicketsRetrieved, + 'NEW_TICKETS_PENDING': this.onNewTicketsPending, + 'ALL_TICKETS_FULFILLED': this.onAllTicketsRetrieved, + 'ALL_TICKETS_PENDING': this.onAllTicketsPending }; } @@ -53,6 +61,32 @@ class AdminDataReducer extends Reducer { myTicketsLoaded: false }) } + + onNewTicketsRetrieved(state, payload) { + return _.extend({}, state, { + newTickets: payload.data, + newTicketsLoaded: true + }) + } + + onNewTicketsPending(state) { + return _.extend({}, state, { + newTicketsLoaded: false + }) + } + + onAllTicketsRetrieved(state, payload) { + return _.extend({}, state, { + allTickets: payload.data, + allTicketsLoaded: true + }) + } + + onAllTicketsPending(state) { + return _.extend({}, state, { + allTicketsLoaded: false + }) + } } export default AdminDataReducer.getInstance(); \ No newline at end of file From b712cd645ba9898f96420acd3944750140e24957 Mon Sep 17 00:00:00 2001 From: ivan Date: Fri, 28 Oct 2016 04:04:15 -0300 Subject: [PATCH 6/8] Ivan - Fix styling [skip ci] --- client/src/app-components/ticket-list.scss | 46 +++++++++++++++++++++ client/src/app-components/tiket-list.scss | 47 ---------------------- 2 files changed, 46 insertions(+), 47 deletions(-) delete mode 100644 client/src/app-components/tiket-list.scss diff --git a/client/src/app-components/ticket-list.scss b/client/src/app-components/ticket-list.scss index f6f8d91c..416d55c5 100644 --- a/client/src/app-components/ticket-list.scss +++ b/client/src/app-components/ticket-list.scss @@ -1,5 +1,51 @@ +@import "../scss/vars"; + .ticket-list { + &__department-selector { margin-bottom: 25px; } + + &__number { + text-align: left; + } + + &__title { + text-align: left; + } + + &__department { + text-align: right; + } + + &__date { + text-align: right; + } + + &__title-link:hover, + &__title-link:focus { + outline: none; + text-decoration: underline; + } + + &__priority-low, + &__priority-medium, + &__priority-high { + display: inline-block; + border-radius: 10px; + width: 70px; + color: white; + } + + &__priority-low { + background-color: $primary-green; + } + + &__priority-medium { + background-color: $secondary-blue; + } + + &__priority-high { + background-color: $primary-red; + } } \ No newline at end of file diff --git a/client/src/app-components/tiket-list.scss b/client/src/app-components/tiket-list.scss deleted file mode 100644 index 2355c6e4..00000000 --- a/client/src/app-components/tiket-list.scss +++ /dev/null @@ -1,47 +0,0 @@ -@import "../scss/vars"; - -.ticket-list { - - &__number { - text-align: left; - } - - &__title { - text-align: left; - } - - &__department { - text-align: right; - } - - &__date { - text-align: right; - } - - &__title-link:hover, - &__title-link:focus { - outline: none; - text-decoration: underline; - } - - &__priority-low, - &__priority-medium, - &__priority-high { - display: inline-block; - border-radius: 10px; - width: 70px; - color: white; - } - - &__priority-low { - background-color: $primary-green; - } - - &__priority-medium { - background-color: $secondary-blue; - } - - &__priority-high { - background-color: $primary-red; - } -} \ No newline at end of file From 5112aac650532fbd4a9db58b747ea9bf39f8112d Mon Sep 17 00:00:00 2001 From: ivan Date: Fri, 28 Oct 2016 13:21:16 -0300 Subject: [PATCH 7/8] Maxi - Minor fixes [skip ci] --- client/src/app-components/ticket-list.js | 2 +- client/src/app/admin/panel/tickets/admin-panel-all-tickets.js | 4 ++-- 2 files changed, 3 insertions(+), 3 deletions(-) diff --git a/client/src/app-components/ticket-list.js b/client/src/app-components/ticket-list.js index 4d75493a..e80d0c6b 100644 --- a/client/src/app-components/ticket-list.js +++ b/client/src/app-components/ticket-list.js @@ -5,7 +5,6 @@ import i18n from 'lib-app/i18n'; import DateTransformer from 'lib-core/date-transformer'; import TicketInfo from 'app-components/ticket-info'; - import Table from 'core-components/table'; import Button from 'core-components/button'; import Tooltip from 'core-components/tooltip'; @@ -24,6 +23,7 @@ class TicketList extends React.Component { }; static defaultProps = { + loading: false, tickets: [], ticketPath: '/dashboard/ticket/', type: 'primary' diff --git a/client/src/app/admin/panel/tickets/admin-panel-all-tickets.js b/client/src/app/admin/panel/tickets/admin-panel-all-tickets.js index 58816efe..490a15cf 100644 --- a/client/src/app/admin/panel/tickets/admin-panel-all-tickets.js +++ b/client/src/app/admin/panel/tickets/admin-panel-all-tickets.js @@ -41,7 +41,7 @@ class AdminPanelAllTickets extends React.Component { export default connect((store) => { return { departments: store.session.userDepartments, - tickets: store.adminData.newTickets, - loading: !store.adminData.newTicketsLoaded + tickets: store.adminData.allTickets, + loading: !store.adminData.allTicketsLoaded }; })(AdminPanelAllTickets); From 32b4775a49dc9f699fc9c211834f2238ce18a142 Mon Sep 17 00:00:00 2001 From: ivan Date: Fri, 28 Oct 2016 22:57:58 -0300 Subject: [PATCH 8/8] Ivan - Add test to ticket list[skip ci] --- .../__tests__/ticket-list-test.js | 188 ++++++++++++++++++ client/src/app-components/ticket-list.js | 1 + 2 files changed, 189 insertions(+) create mode 100644 client/src/app-components/__tests__/ticket-list-test.js diff --git a/client/src/app-components/__tests__/ticket-list-test.js b/client/src/app-components/__tests__/ticket-list-test.js new file mode 100644 index 00000000..8e591a48 --- /dev/null +++ b/client/src/app-components/__tests__/ticket-list-test.js @@ -0,0 +1,188 @@ +const _ = require('lodash'); +const TicketInfo = ReactMock(); +const Table = ReactMock(); +const Button = ReactMock(); +const Tooltip = ReactMock(); +const Dropdown = ReactMock(); +const i18n = stub().returnsArg(0); + +const TicketList = requireUnit('app-components/ticket-list', { + 'app-components/ticket-info': TicketInfo, + 'core-components/table': Table, + 'core-components/button': Button, + 'core-components/tooltip': Tooltip, + 'core-components/drop-down': Dropdown, + 'lib-app/i18n': i18n +}); + +describe('TicketList component', function () { + let ticketList, table, dropdown; + let tickets = (function() { + let ticket = { + unread: false, + closed: false, + title: 'This is not working', + ticketNumber: 123124, + date: '20160215', + department: { + id: 1, + name: 'Sales Support' + }, + priority: 'low', + author: { + id: 3, + name: 'Francisco Villegas' + } + }; + let list = _.range(5).map(() => ticket); + + list = list.concat(_.range(5).map(() => { + return _.extend({}, ticket, { + department: { + id: 2, + name: 'Tech Help' + } + }) + })); + + return list; + })(); + + function renderTicketList(props = {}) { + ticketList = TestUtils.renderIntoDocument( + + ); + + table = TestUtils.scryRenderedComponentsWithType(ticketList, Table); + dropdown = TestUtils.scryRenderedComponentsWithType(ticketList, Dropdown); + } + + it('should pass correct props to Table', function () { + renderTicketList(); + expect(table[0].props.loading).to.equal(false); + expect(table[0].props.pageSize).to.equal(10); + expect(table[0].props.headers).to.deep.equal([ + { + key: 'number', + value: i18n('NUMBER'), + className: 'ticket-list__number col-md-1' + }, + { + key: 'title', + value: i18n('TITLE'), + className: 'ticket-list__title col-md-6' + }, + { + key: 'department', + value: i18n('DEPARTMENT'), + className: 'ticket-list__department col-md-3' + }, + { + key: 'date', + value: i18n('DATE'), + className: 'ticket-list__date col-md-2' + } + ]); + }); + + it('should pass loading to Table', function () { + renderTicketList({loading: true}); + expect(table[0].props.loading).to.equal(true); + }); + + it('should pass correct compare function to Table', function () { + let minCompare = table[0].props.comp; + + let row1 = { + closed: false, + unread: false, + date: '20160405' + }; + let row2 = { + closed: false, + unread: false, + date: '20160406' + }; + expect(minCompare(row1, row2)).to.equal(1); + + row1.unread = true; + expect(minCompare(row1, row2)).to.equal(-1); + + row2.unread = true; + expect(minCompare(row1, row2)).to.equal(1); + + row2.date = '20160401'; + expect(minCompare(row1, row2)).to.equal(-1); + }); + + describe('when using secondary type', function () { + beforeEach(function () { + renderTicketList({ + type: 'secondary', + departments: [ + {id: 1, name: 'Sales Support'}, + {id: 2, name: 'Tech Help'} + ] + }); + }); + + it('should pass correct props to Table', function () { + expect(table[0].props.headers).to.deep.equal([ + { + key: 'number', + value: i18n('NUMBER'), + className: 'ticket-list__number col-md-1' + }, + { + key: 'title', + value: i18n('TITLE'), + className: 'ticket-list__title col-md-4' + }, + { + key: 'priority', + value: i18n('PRIORITY'), + className: 'ticket-list__priority col-md-1' + }, + { + key: 'department', + value: i18n('DEPARTMENT'), + className: 'ticket-list__department col-md-2' + }, + { + key: 'author', + value: i18n('AUTHOR'), + className: 'ticket-list__author col-md-2' + }, + { + key: 'date', + value: i18n('DATE'), + className: 'ticket-list__date col-md-2' + } + ]); + }); + + it('should pass correct props to dropdown', function () { + expect(dropdown[0].props.items).to.deep.equal([ + {content: i18n('ALL_DEPARTMENTS')}, + {content: 'Sales Support'}, + {content: 'Tech Help'} + ]); + expect(dropdown[0].props.size).to.equal('medium'); + }); + + it('should filter tickets by department when DropDown changes', function () { + dropdown[0].props.onChange({index: 1}); + _.forEach(table[0].props.rows, function (row) { + expect(row.department).to.equal('Sales Support'); + }); + + dropdown[0].props.onChange({index: 2}); + _.forEach(table[0].props.rows, function (row) { + expect(row.department).to.equal('Tech Help'); + }); + + dropdown[0].props.onChange({index: 0}); + expect(table[0].props.rows.length).to.equal(10); + }); + }); +}); \ No newline at end of file diff --git a/client/src/app-components/ticket-list.js b/client/src/app-components/ticket-list.js index e80d0c6b..3f9b2e61 100644 --- a/client/src/app-components/ticket-list.js +++ b/client/src/app-components/ticket-list.js @@ -25,6 +25,7 @@ class TicketList extends React.Component { static defaultProps = { loading: false, tickets: [], + departments: [], ticketPath: '/dashboard/ticket/', type: 'primary' };