Retrieve tickets individually for users

client/src/app-components/ticket-info.scss

@@ -3,6 +3,7 @@
 .ticket-info {
     width: 300px;
     font-weight: normal;
+    text-align: left;
 
     &__title {
         color: $primary-black;
@@ -86,4 +87,4 @@
             }
         }
     }
-}
+}

client/src/app/main/dashboard/dashboard-create-ticket/dashboard-create-ticket-page.js

@@ -34,7 +34,6 @@ class DashboardCreateTicketPage extends React.Component {
 
     onCreateTicketSuccess() {
         if((this.props.location.pathname !== '/create-ticket')) {
-            this.props.dispatch(SessionActions.getUserData());
             setTimeout(() => {history.push('/dashboard')}, 2000);
         } else {
             setTimeout(() => {history.push('/check-ticket/' + result.data.ticketNumber + '/' + email)}, 1000);

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

@@ -1,6 +1,8 @@
 import React from 'react';
 import {connect} from 'react-redux';
 
+import SessionActions from 'actions/session-actions';
+
 import i18n from 'lib-app/i18n';
 
 import Header from 'core-components/header';
@@ -15,6 +17,10 @@ class DashboardListTicketsPage extends React.Component {
         tickets: []
     };
 
+    componentDidMount() {
+        this.retrieveUserData();
+    }
+
     render() {
         return (
             <div className="dashboard-ticket-list">
@@ -23,6 +29,10 @@ class DashboardListTicketsPage extends React.Component {
             </div>
         );
     }
+
+    retrieveUserData() {
+        this.props.dispatch(SessionActions.getUserData());
+    }
 }
 
 

client/src/app/main/dashboard/dashboard-ticket/dashboard-ticket-page.js

@@ -1,59 +1,82 @@
 import React from 'react';
 import _ from 'lodash';
-import {connect} from 'react-redux';
+
+import store from 'app/store';
+import SessionActions from 'actions/session-actions';
 
 import i18n from 'lib-app/i18n';
 import API from 'lib-app/api-call';
 
-import SessionActions from 'actions/session-actions';
 import TicketViewer from 'app-components/ticket-viewer';
+import Loading from 'core-components/loading';
+import Message from 'core-components/message';
 
 class DashboardTicketPage extends React.Component {
 
-    static propTypes = {
+    state = {
-        tickets: React.PropTypes.array
+        error: null,
+        ticket: null,
     };
 
     componentDidMount() {
-        let ticket = this.getTicketData();
+        this.retrieveTicketData();
-
-        if(ticket.unread) {
-            API.call({
-                path: '/ticket/seen',
-                data: {
-                    ticketNumber: ticket.ticketNumber
-                }
-            }).then(() => {
-                this.retrieveUserData();
-            });
-        }
     }
 
     render() {
-        let ticketView = i18n('NO_PERMISSION');
+        const {ticket, error} = this.state;
-
-        if(!_.isEmpty(this.getTicketData())) {
-            ticketView = <TicketViewer ticket={this.getTicketData()} onChange={this.retrieveUserData.bind(this)}/>;
-        }
 
         return (
             <div className="dashboard-ticket-page">
-                {ticketView}
+                {(ticket || error) ? this.renderContent() : <Loading className="dashboard-ticket-page__loading" backgrounded/>}
             </div>
         );
     }
 
-    getTicketData() {
+    renderContent() {
-        return _.find(this.props.tickets, {ticketNumber: this.props.params.ticketNumber}) || {};
+        const {ticket, error} = this.state;
+
+        if(error) {
+            return (
+                <Message type="error">
+                    {i18n(error)}
+                </Message>
+            );
+        } else {
+            return (
+                <TicketViewer ticket={ticket} onChange={this.retrieveTicketData.bind(this)}/>
+            );
+        }
+
+    }
+
+    retrieveTicketData() {
+        API.call({
+            path: '/ticket/get',
+            data: {
+                ticketNumber: this.props.params.ticketNumber,
+            }
+        })
+        .then(result => {
+            const ticket = result.data
+            this.setState({ticket, error: null})
+
+            if(ticket.unread) {
+                API.call({
+                    path: '/ticket/seen',
+                    data: {
+                        ticketNumber: ticket.ticketNumber
+                    }
+                }).then(() => {
+                    this.retrieveUserData();
+                });
+            }
+        })
+        .catch(result => this.setState({error: result.message}));
     }
 
     retrieveUserData() {
-        this.props.dispatch(SessionActions.getUserData());
+        store.dispatch(SessionActions.getUserData());
     }
 }
 
-export default connect((store) => {
+export default DashboardTicketPage;
-    return {
-        tickets: store.session.userTickets
-    };
-})(DashboardTicketPage);

client/src/app/main/dashboard/dashboard-ticket/dashboard-ticket-page.scss

@@ -1,3 +1,7 @@
 .dashboard-ticket-page {
     padding: 0 10px;
-}
+
+    &__loading {
+        min-height: 300px;
+    }
+}

server/controllers/user/get.php

@@ -18,7 +18,7 @@ DataValidator::with('CustomValidations', true);
  * @apiUse INVALID_CREDENTIALS
  *
  * @apiSuccess {Object} data Information about an user
- * @apiSuccess {String} data.name Name of the user 
+ * @apiSuccess {String} data.name Name of the user
  * @apiSuccess {String} data.email Email of the user
  * @apiSuccess {Boolean} data.verified Indicates if the user is verified
  * @apiSuccess {Object} data Information about an user
@@ -48,7 +48,7 @@ class GetUserController extends Controller {
         $ticketList = $user->sharedTicketList;
 
         foreach($ticketList as $ticket) {
-            $parsedTicketList[] = $ticket->toArray();
+            $parsedTicketList[] = $ticket->toArray(true);
         }
 
         Response::respondSuccess([
@@ -58,4 +58,4 @@ class GetUserController extends Controller {
             'tickets' => $parsedTicketList
         ]);
     }
-}
+}

server/models/Ticket.php

@@ -106,11 +106,11 @@ class Ticket extends DataStore {
         return $ticketNumber;
     }
 
-    public function toArray() {
+    public function toArray($minimized = false) {
         return [
             'ticketNumber' => $this->ticketNumber,
             'title' => $this->title,
-            'content' => $this->content,
+            'content' => $minimized ? strip_tags($this->content) : $this->content,
             'department' => [
                 'id' => $this->department->id,
                 'name' => $this->department->name
@@ -124,7 +124,7 @@ class Ticket extends DataStore {
             'priority' => $this->priority,
             'author' => $this->authorToArray(),
             'owner' => $this->ownerToArray(),
-            'events' => $this->eventsToArray()
+            'events' => $minimized ? [] : $this->eventsToArray()
         ];
     }