ih-portal/src/tabs/AcademicTabProvider.jsx

A project for connecting interaction hub services with catalyst-ui components

import React, { Component, PropTypes } from 'react';
import { connect } from 'react-redux';

import { mapStateToProps, mapDispatchToProps } from '../propMaps.js';

import { Card, CardTitle } from 'material-ui';
import catalystLogo from '../content/catalystlogo.png';

import NavigationDrawerCollectionProv from '../pagelets/NavigationDrawerCollectionProv.jsx';
import AcademicProfileProv from '../pagelets/AcademicProfileProv.jsx';
import CourseHistoryProv from '../../src/pagelets/CourseHistoryProv.jsx';
import NewsFeedProv from '../pagelets/NewsFeedProv.jsx';
class AcademicTabProvider extends Component {
  constructor(props) {
    super(props);
  }

  render() {
    const {
      academicProfile,
      courseHistory,
      degreeAuditLinksData,
      navigationCollection,
      newsFeed,
    } = this.props.storeStates;

    const {
      fetchAcademicProfile,
      invalidateAcademicProfile,
      fetchCourseHistory,
      invalidateCourseHistory,
      fetchNavigationCollection,
      invalidateNavigationCollection,
      fetchDegreeAuditLinks,
      fetchNews,
      invalidateNews,
    } = this.props.storeDispatchers;

    return (
      <div key="TabProvider">
        <div className="">
          <div className="small-12 medium-4 large-3 columns ">
            <NavigationDrawerCollectionProv
              navigationCollection={navigationCollection}
              pageletName="ADMN_CALENDARS_AND_DEA1026062"
              pageletTitle="Calendars and Deadlines"
              fetch={fetchNavigationCollection}
              invalidate={invalidateNavigationCollection}
            />
            <br/>
            <NavigationDrawerCollectionProv
              navigationCollection={navigationCollection}
              pageletName="ADMN_COURSES_SCHEDULE_1067293"
              pageletTitle="Courses, Schedule and Grades"
              fetch={fetchNavigationCollection}
              invalidate={invalidateNavigationCollection}
            />
            <br/>
            <NavigationDrawerCollectionProv
              navigationCollection={navigationCollection}
              pageletName="ADMN_DEGREE_AUDIT_TRAN1057362"
              pageletTitle="Audit, Grades and Transcripts"
              fetch={fetchNavigationCollection}
              invalidate={invalidateNavigationCollection}
            />
            <br/>
            <NavigationDrawerCollectionProv
                navigationCollection={navigationCollection}
                pageletName="ADMN_GRADUATION_COMMEN1048650"
                pageletTitle="Graduation and Commencement"
                fetch={fetchNavigationCollection}
                invalidate={invalidateNavigationCollection}
              />
              <br/>
          </div>
          <div className="small-12 medium-8 large-5 columns">
            <NewsFeedProv
              newsFeed={newsFeed}
              fetch={fetchNews}
              invalidate={invalidateNews}
              pageletName="UCI_STUDENT_ACADEMIC_NEWS"
              />
              <br/>
          </div>
          <div className="small-12 medium-8 large-4 columns">
            <AcademicProfileProv
              data={academicProfile}
              fetch={fetchAcademicProfile}
              invalidate={invalidateAcademicProfile}
              fetchNavCol={fetchDegreeAuditLinks}
              degreeAuditNavCol={degreeAuditLinksData}
            />
            <br/>
            <Card>
              <CardTitle
                title={<span style={{color: '#e00122'}}>Need Help?</span>}
                style={{
                  borderBottomWidth: 1,
                  borderBottomStyle: 'solid',
                  borderBottomColor: '#E0E0E0',
                }}
              />
                <div style={{margin: 20 }}>
                <ul>
                  <li><a target="_new" href="http://www.uc.edu/catalyst/tips-tricks.html">Catalyst tips and tricks</a> provide how-to videos and step-by-step instructions to help you navigate Catalyst.</li>
                  <li><strong>Catalyst tutorials</strong> (<em>see Quick Links on on My Dashboard</em>) contain helpful videos.</li>
                </ul>
                </div>
            </Card>
          </div>
        </div>
      </div>
    );
  }
}

AcademicTabProvider.propTypes = {
  storeStates: PropTypes.object,
  storeDispatchers: PropTypes.object,
};

export default connect(mapStateToProps, mapDispatchToProps)(AcademicTabProvider);
export { AcademicTabProvider as AcademicTabProviderDumb };