Home Reference Source

application/components/assignment.js

import React from 'react';
import Immutable from 'immutable';
import {browserHistory, Link} from 'react-router';

import {connect} from 'react-redux';
import moment from 'moment';
import {Row, Col} from './flexbox';

import SlidingPaginator from './common/sliding-paginator';

import CurrentUser from './../current-user';

import {
    assignmentsFetch,
    assignmentsMaybeFetchCache
} from './../redux/actions/assignment-actions';
import {
    workflowsMaybeFetch,
    workflowsFilterAssignmentOnly
} from './../redux/actions/workflow-actions';
import {
    issuesFetch
} from './../redux/actions/issue-actions';
import {
    assignmentViewUpdate,
    assignmentViewReset
} from './../redux/actions/assignment-view-actions';

import AssignmentToolbar from './assignment/assignment-toolbar';
import AssignmentTable from './assignment/assignment-table';
import AssignmentIssues from './assignment/assignment-issues';
import AssignmentCalendar from './assignment/assignment-calendar';

import LoadingIndicator from './common/loading-indicator';
import Paginator from './common/paginator';

import AssignmentManager from '../managers/assignment-manager';


class Assignment extends React.Component {
    constructor(props) {
        super(props);
    }

    componentWillMount() {
        const page = (this.props.location && this.props.location.query.page)
            ? this.props.location.query.page
            : 1;

        const {dispatch} = this.props;
        dispatch(workflowsMaybeFetch())
            .then(() => dispatch(workflowsFilterAssignmentOnly()))

        let type = ''

        if (localStorage.getItem('assignmentCurrentView')) {
            this.props.dispatch(assignmentViewUpdate({
                'currentView': localStorage.getItem('assignmentCurrentView')
            }));
        }

        // AssignmentManager.fetchFromView();
    }

    handlePagination(page, force = false) {
        if (this.props.assignmentView && this.props.assignmentView.currentView == 'unassigned') {
            if (this.props.assignments.pagination.current == page && !force) {
                return;
            }

            const {dispatch} = this.props;
            dispatch(assignmentViewUpdate({page: page}))
                .then(() => AssignmentManager.fetchFromView());
        } else {
            if (this.props.issues.pagination.current == page && !force) {
                return;
            }

            const {dispatch} = this.props;
            dispatch(issuesFetch({page: page, per_page: 9}))
                .then(() => {
                    let issues = [];
                    this.props.issues.items.map((issue) => {
                        issues.push(issue.get('uuid'));
                    });

                    dispatch(assignmentViewUpdate({issues: issues}))
                        .then(() => AssignmentManager.fetchFromView());
                });


        }
    }

    handleClearFilters() {
        this.props.dispatch(assignmentViewReset())
            .then(() => AssignmentManager.fetchFromView());
    }

    render() {
        let view = '';
        if (this.props.assignmentView.currentView == 'unassigned') {
            view = (
                <AssignmentTable
                    />
            );
        } else if (this.props.assignmentView.currentView == 'by issue') {
            view = (
                <AssignmentIssues
                    />
            );
        } else if (this.props.assignmentView.currentView == 'calendar') {
            view = (
                <AssignmentCalendar
                    />
            );
        }

        return (
            <div className="assignment-root">
                <Row>
                    <Col xs={12}>
                        <AssignmentToolbar
                            onPaginate={this.handlePagination.bind(this)}
                            onReset={this.handleClearFilters.bind(this)}
                            />
                        {view}
                    </Col>
                </Row>
            </div>
        );

        // const token = (this.props.location && this.props.location.query.search)
        //     ? decodeURIComponent(this.props.location.query.search)
        //     : null;

        // const sorter = (this.props.location && this.props.location.query.sorter)
        //     ? decodeURIComponent(this.props.location.query.sorter)
        //     : 'due_at';

        // const workflow = (this.props.location && this.props.location.query.workflow)
        //     ? this.props.location.query.workflow
        //     : null;

        // const flip = (this.props.location && this.props.location.query.flip)
        //     ? this.props.location.query.flip == "true"
        //     : false == "true";

        // const hpd = (this.props.location && this.props.location.query.hpd)
        //     ? this.props.location.query.hpd == "true"
        //     : false == "true";

        // let cal = (this.props.location && this.props.location.query.cal)
        //     ? this.props.location.query.cal == "true"
        //     : false == "true";

        // // check if a view has already been saved into localStorage
        // let calStored = localStorage.getItem('assignmentPageView') == 'true';
        // if (calStored) { cal = true };

        // let calView = (this.props.location && this.props.location.query.calView)
        //     ? decodeURIComponent(this.props.location.query.calView)
        //     : "issue";

        // let calViewStored = localStorage.getItem("assignmentCalendarView");
        // if (calViewStored) { calView = calViewStored};

        // const assignee = (this.props.location && this.props.location.query.assignee)
        //     ? decodeURIComponent(this.props.location.query.assignee)
        //     : null;

        // const per_page = 3;
        // const page = (this.props.location && this.props.location.query.page)
        //     ? parseInt(this.props.location.query.page)
        //     : 1;
        // const offset = (parseInt(page)-1) * per_page;

        // const allIssues = this.props.issues.items
        //     .filter(item => parseInt(item.get('status')))
        //     .sort((a, b) => {
        //         const momentA = new Date(a.get('published_at')).getTime();
        //         const momentB = new Date(b.get('published_at')).getTime();

        //         if (momentA < momentB) {
        //             return 1;
        //         } else {
        //             return -1;
        //         }
        //     });

        // let filteredAssignments = this.props.assignments.items.filter((item) => {
        //     if (workflow) {
        //         if (item.get('workflow_id') && item.get('workflow_id') == workflow) {
        //             return true;
        //         }

        //         return false;
        //     }

        //     return true;
        // }).filter((item) => {
        //     if (token && token.length) {
        //         if (item.get('title') && item.get('title').toLowerCase().indexOf(token.toLowerCase()) !== -1) {
        //             return true;
        //         }

        //         return false;
        //     }

        //     return true;
        // }).filter((item) => {
        //     if (assignee && assignee != 'unassigned') {
        //         let tmpUsers = item.get('users');

        //         let check = tmpUsers.filter((user) => {
        //             if (user.get('name') == assignee) {
        //                 return true;
        //             }
        //         });

        //         if (check.size) {
        //             return true;
        //         }

        //         return false;
        //     } else if (assignee && assignee == 'unassigned') {
        //         let tmpUsers = item.get('users');

        //         if (!tmpUsers.size) {
        //             return true;
        //         }

        //         return false;
        //     }

        //     return true;
        // }).sort((a, b) => {
        //     if (sorter) {
        //         if (sorter == 'due_at') {
        //             let momentA = new Date(a.get(sorter)).getTime();
        //             let momentB = new Date(b.get(sorter)).getTime();

        //             if (momentA < momentB) {
        //                 return -1;
        //             } else {
        //                 return 1;
        //             }
        //         }
        //         if (sorter == 'modified_at' || sorter == 'created_at' || sorter == 'published_at') {
        //             const momentA = new Date(a.get(sorter)).getTime();
        //             const momentB = new Date(b.get(sorter)).getTime();

        //             if (momentA < momentB) {
        //                 return 1;
        //             } else {
        //                 return -1;
        //             }
        //         }
        //         if (sorter == 'slug' || sorter == 'title') {
        //             const A = a.get(sorter).toUpperCase();
        //             const B = b.get(sorter).toUpperCase();

        //             if (!A && !B) {
        //                 return 0;
        //             }
        //             if (!A) {
        //                 return 1;
        //             }
        //             if (!B) {
        //                 return -1;
        //             }
        //             if (A < B) {
        //                 return -1;
        //             }
        //             if (A > B) {
        //                 return 1;
        //             }

        //             return 0;
        //         }
        //     }
        // }).filter((item) => {
        //     if (hpd) {
        //         let now = new Date();
        //         let isAfter = moment(now).isAfter(item.get('due_at'));

        //         return !isAfter;
        //     } else {
        //         return true;
        //     }
        // });

        // if (flip) {
        //     filteredAssignments = filteredAssignments.reverse();
        // }

        // const paginated = allIssues.skip(offset).take(per_page);
        // let byIssue = [];
        // paginated.map((issue, i) => {
        //     byIssue.push({
        //         issue: issue,
        //         assignments: filteredAssignments.filter((item) => {
        //             return item.get('issue_id') == issue.get('id')
        //         })
        //     });
        // });

        // let unbound = filteredAssignments.filter((item) => {
        //     return !parseInt(item.get('issue_id'));
        // })
        // let multiPage = allIssues.size/per_page > 1;

        // //build events for the assignment-calendar
        // let assignmentDueDates = [];
        // let issueDueDates = [];
        // //add issues
        // this.props.issues.items.map((issue,i) => {
        //     let event = {};

        //     //event.allDay = true;
        //     event.title = issue.get('label') ? issue.get('label') : issue.get('slug');
        //     event.uuid = issue.get('uuid');
        //     event.type = 'issue';

        //     if (!CurrentUser.hasRole('Administrator')) {
        //         event.lock = true;
        //     } else {
        //         event.lock = false;
        //     }

        //     if (issue.get('published_at')) {
        //         event.start = moment.utc(issue.get('published_at')).local().toDate();
        //         event.end = moment.utc(issue.get('published_at')).local().toDate();
        //     } else {
        //         event.unscheduled = true;
        //     }

        //     issueDueDates.push(event);

        //     let issueId = issue.get('id');
        //     let issueAssignments = filteredAssignments.filter((assignment,i) => {
        //         if (assignment.get('issue_id') == issueId) {
        //             return true;
        //         }

        //         return false;
        //     })

        //     issueAssignments.map((assignment,i) => {
        //         let event = {};

        //         //event.allDay = true;
        //         event.title = assignment.get('title') ? assignment.get('title') : assignment.get('slug');
        //         event.type = assignment.get('type');
        //         event.slug = assignment.get('slug');
        //         event.uuid = assignment.get('uuid');
        //         event.srn = assignment.get('srn');

        //         // check if the assignment is locked
        //         if (assignment.get('lock') && assignment.get('lock').get('user_id') !== CurrentUser.getId()) {
        //             event.lock = assignment.get('lock').get('uuid');
        //             event.lockUser = assignment.get('lock').get('user_id');
        //         }

        //         event.start = moment.utc(issue.get('published_at')).local().toDate();
        //         event.end = moment.utc(issue.get('published_at')).local().toDate();

        //         issueDueDates.push(event);
        //     })

        // });

        // //add assignments to the calendar
        // filteredAssignments.map((item,i) => {
        //     let event = {};

        //     //event.allDay = true;
        //     event.title = item.get('title') ? item.get('title') : item.get('slug');
        //     event.type = item.get('type');
        //     event.slug = item.get('slug');
        //     event.uuid = item.get('uuid');
        //     event.srn = item.get('srn');
        //     event.issue = item.get('issue_id') ? item.get('issue_id') : null;
        //     //need a way of differentiating viewmodes in backgroundWrapper
        //     event.flag = true;

        //     // check if the assignment is locked
        //     if (item.get('lock') && item.get('lock').get('user_id') !== CurrentUser.getId()) {
        //         event.lock = item.get('lock').get('uuid');
        //         event.lockUser = item.get('lock').get('user_id');
        //     }

        //     // set the event unscheduled if it has no due_at
        //     if (item.get('due_at')) {
        //         event.start = moment.utc(item.get('due_at')).local().toDate();
        //         event.end = moment.utc(item.get('due_at')).local().toDate();
        //     } else {
        //         event.unscheduled = true;
        //     }

        //     assignmentDueDates.push(event);
        // });

        // return (
        //     <div className="assignment-root">
        //         <Row>
        //             <Col xs={12}>
        //                 <AssignmentToolbar
        //                     items={allIssues}
        //                     page={page}
        //                     perPage={per_page}
        //                     search={token}
        //                     workflow={workflow}
        //                     sorter={sorter}
        //                     assignee={assignee}
        //                     cal={cal}
        //                     />

        //                 {
        //                     cal
        //                     ? (
        //                         <AssignmentCalendar
        //                             assignmentDueDates={assignmentDueDates}
        //                             issueDueDates={issueDueDates}
        //                             unbound={unbound}
        //                             byIssue={byIssue}
        //                             page={page}
        //                             perPage={per_page}
        //                             calView={calView}
        //                             />
        //                     )
        //                     : (
        //                         <AssignmentTable
        //                             unbound={unbound}
        //                             byIssue={byIssue}
        //                             page={page}
        //                             perPage={per_page}
        //                             hpd={hpd}
        //                             />
        //                     )
        //                 }

        //                 <div
        //                     className='box toolbar right-align'
        //                     style={{backgroundColor:'#f1f1f1', marginTop:'10px', paddingRight:'10px'}}
        //                     >
        //                     {
        //                         multiPage && !cal
        //                         ? (
        //                             <SlidingPaginator
        //                                 totalItems={allIssues.size}
        //                                 currentPage={parseInt(page)}
        //                                 perPage={per_page}
        //                                 />
        //                         )
        //                         : ''
        //                     }
        //                 </div>
        //             </Col>
        //         </Row>
        //     </div>
        // );
    }
}

const mapStateToProps = (state) => {
    return {
        assignments: state.assignments,
        issues: state.issues,
        workflows: state.workflows,
        assignmentView: state.assignmentView
    };
}

export default connect(mapStateToProps)(Assignment);