feat: add redemptions nav item

- add fetchSocietyInfoRequest request
andela · Apr 1, 2019 · 0a64523 · 0a64523
1 parent e95547d
commit 0a64523
Show file tree

Hide file tree

Showing 5 changed files with 38 additions and 16 deletions.
diff --git a/src/app/Redemptions/components/RedemptionsComponent.js b/src/app/Redemptions/components/RedemptionsComponent.js
@@ -7,7 +7,7 @@ import { TableComponent, TruncateDescriptionContainer, StatusIndicatorComponent
 
 const RedemptionsComponent = ({ activities }) => {
   let tableBodyHtml;
-  const columnNames = ['Cash', 'Date', 'Event', 'Points', 'Status'];
+  const columnNames = ['Cash', 'Date', 'Description', 'Points', 'Status'];
   if (!activities.length) {
     tableBodyHtml = (
       <tr className='myactivities__table__row'>

diff --git a/src/app/Redemptions/components/RedemptionsContainer.js b/src/app/Redemptions/components/RedemptionsContainer.js
@@ -14,34 +14,42 @@ export class RedemptionsContainer extends Component {
     society: {},
     societyName: '',
     fetchUserActivites: null,
+    fetchSocietyInfoRequest: null,
     fetchSocietyRedemptionsRequest: null,
   };
 
   static propTypes = {
     society: PropTypes.shape({}),
     societyName: PropTypes.string,
     fetchUserActivites: PropTypes.func,
+    fetchSocietyInfoRequest: PropTypes.func,
     fetchSocietyRedemptionsRequest: PropTypes.func,
   };
 
   componentDidMount() {
-    const { fetchSocietyRedemptionsRequest, societyName, fetchUserActivites } = this.props;
+    const {
+      fetchSocietyRedemptionsRequest, fetchSocietyInfoRequest, societyName, fetchUserActivites,
+    } = this.props;
     const token = getToken();
     const userInfo = getUserInfo(token);
     fetchUserActivites(userInfo.id);
+    fetchSocietyInfoRequest(societyName.toLowerCase());
     fetchSocietyRedemptionsRequest(societyName.toLowerCase());
   }
 
   componentDidUpdate(prevProps) {
-    const { fetchSocietyRedemptionsRequest, societyName } = this.props;
-    if (prevProps.societyName !== societyName) {
+    const {
+      fetchSocietyRedemptionsRequest, fetchSocietyInfoRequest, societyName,
+    } = this.props;
+    if (prevProps.societyName !== societyName && !prevProps.society[societyName.toLowerCase()].redemptions.length) {
+      fetchSocietyInfoRequest(societyName.toLowerCase());
       fetchSocietyRedemptionsRequest(societyName.toLowerCase());
     }
   }
 
   render() {
     const { society, societyName } = this.props;
-    let verifyActivitiesHtml = (<LoaderComponent className='loader' />);
+    let verifyActivitiesHtml = <LoaderComponent className='loader' />;
     if (societyName) {
       const {
         usedPoints, pointsEarned, remainingPoints, activitiesLogged, redemptions,
@@ -92,8 +100,9 @@ const mapStateToProps = ({ society, dashboard }) => ({
 });
 
 const mapDispatchToProps = {
-  fetchSocietyRedemptionsRequest: societyActions.fetchSocietyRedemptionsRequest,
   fetchUserActivites: dashboardActions.fetchUserActivitiesRequest,
+  fetchSocietyInfoRequest: societyActions.fetchSocietyInfoRequest,
+  fetchSocietyRedemptionsRequest: societyActions.fetchSocietyRedemptionsRequest,
 };
 
 export default connect(

diff --git a/src/app/Redemptions/components/tests/RedemptionsComponent.test.js b/src/app/Redemptions/components/tests/RedemptionsComponent.test.js
@@ -38,7 +38,7 @@ describe('<RedemptionsComponent />', () => {
     expect(shallowWrapper.find('TableComponent').props().tableHeadings).toEqual([
       'Cash',
       'Date',
-      'Event',
+      'Description',
       'Points',
       'Status',
     ]);

diff --git a/src/app/Redemptions/components/tests/RedemptionsContainer.test.js b/src/app/Redemptions/components/tests/RedemptionsContainer.test.js
@@ -25,6 +25,7 @@ describe('<RedemptionsContainer />', () => {
       },
     },
     fetchUserActivites: jest.fn(),
+    fetchSocietyInfoRequest: jest.fn(),
     fetchSocietyRedemptionsRequest: jest.fn(),
   };
   const shallowWrapper = shallow(<RedemptionsContainer {...props} />);

diff --git a/src/app/Sidebar/components/SidebarContainer.js b/src/app/Sidebar/components/SidebarContainer.js
@@ -34,14 +34,26 @@ export class SidebarContainer extends Component {
 
   render() {
     const { className, toggleSidebarState, userRole } = this.props;
-    const verifyNavItemHtml = userRole && Object.keys(userRole).includes('society secretary') && (
-      <NavItemComponent
-        route='verify-activities'
-        iconClassName='sidebar_nav-icon outlinedCheckmark'
-        labelClassName='sidebar_nav-label'
-        navItemClassName='sidebar_nav-item'
-      />
-    );
+    let navItemHtml;
+    if (userRole && Object.keys(userRole).includes('society secretary')) {
+      navItemHtml = (
+        <NavItemComponent
+          route='verify-activities'
+          iconClassName='sidebar_nav-icon outlinedCheckmark'
+          labelClassName='sidebar_nav-label'
+          navItemClassName='sidebar_nav-item'
+        />
+      );
+    } else if (userRole && Object.keys(userRole).includes('society president')) {
+      navItemHtml = (
+        <NavItemComponent
+          route='redemptions'
+          iconClassName='sidebar_nav-icon outlinedCheckmark'
+          labelClassName='sidebar_nav-label'
+          navItemClassName='sidebar_nav-item'
+        />
+      );
+    }
     return (
       <nav className={`${className}`}>
         <LogoComponent styles='sidebar__header' logoClassType='logo__image--white' />
@@ -78,7 +90,7 @@ export class SidebarContainer extends Component {
             navItemClassName='sidebar_nav-item'
           />
           <hr className='sidebar__separator--top' />
-          {verifyNavItemHtml}
+          {navItemHtml}
         </nav>
         <footer className='sidebar__footer'>
           <div className='sidebar_nav-item'>