From bcae8ab0f878ddb586585bd0568cc2ca82a97184 Mon Sep 17 00:00:00 2001
From: mloweedgar <mloweedgar0@gmail.com>
Date: Tue, 18 Jan 2022 19:22:02 +0300
Subject: [PATCH] feat(earnings  main filter): displaay organisations in filter

---
 .../EarningsTableMainFilter.js                | 63 +++++++++++++++++--
 1 file changed, 58 insertions(+), 5 deletions(-)

diff --git a/src/components/EarningsTable/EarningsTableMainFilter/EarningsTableMainFilter.js b/src/components/EarningsTable/EarningsTableMainFilter/EarningsTableMainFilter.js
index 1520e7602..85f4c669d 100644
--- a/src/components/EarningsTable/EarningsTableMainFilter/EarningsTableMainFilter.js
+++ b/src/components/EarningsTable/EarningsTableMainFilter/EarningsTableMainFilter.js
@@ -1,4 +1,4 @@
-import React, { useState } from 'react';
+import React, { useEffect, useState } from 'react';
 import PropTypes from 'prop-types';
 import Grid from '@material-ui/core/Grid';
 import Drawer from '@material-ui/core/Drawer';
@@ -6,6 +6,7 @@ import TextField from '@material-ui/core/TextField';
 import Select from '@material-ui/core/Select';
 import InputLabel from '@material-ui/core/InputLabel';
 import MenuItem from '@material-ui/core/MenuItem';
+import api from '../../../api/treeTrackerApi';
 
 import Button from '@material-ui/core/Button';
 import Typography from '@material-ui/core/Typography';
@@ -30,6 +31,7 @@ const PAYMENT_STATUS = ['calculated', 'cancelled', 'paid', 'all'];
  */
 function EarningsTableMainFilter(props) {
   const [mainFilter, setMainFilter] = useState({});
+  const [organisations, setOrganisations] = useState([]);
   const { isMainFilterOpen, setIsMainFilterOpen, filter, setFilter } = props;
 
   const classes = useStyles();
@@ -67,6 +69,12 @@ function EarningsTableMainFilter(props) {
     setIsMainFilterOpen(false);
   };
 
+  useEffect(() => {
+    api.getOrganizations().then((res) => {
+      setOrganisations(res);
+    });
+  }, [mainFilter]);
+
   return (
     <Drawer
       anchor="right"
@@ -100,11 +108,9 @@ function EarningsTableMainFilter(props) {
             variant="outlined"
             className={classes.earningsFilterSelectFormControl}
           >
-            <InputLabel id="demo-simple-select-outlined-label">
-              Payment Status
-            </InputLabel>
+            <InputLabel id="earnings_status">Payment Status</InputLabel>
             <Select
-              labelId="demo-simple-select-outlined-label"
+              labelId="earnings_status"
               id="earnings_status"
               name="earnings_status"
               label="Payment Status"
@@ -120,6 +126,53 @@ function EarningsTableMainFilter(props) {
             </Select>
           </FormControl>
 
+          <FormControl
+            variant="outlined"
+            className={classes.earningsFilterSelectFormControl}
+          >
+            <InputLabel id="organisation_id">Organisation</InputLabel>
+            <Select
+              labelId="organisation_id"
+              id="organisation_id"
+              name="organisation_id"
+              label="Organisation"
+              onChange={handleOnFormControlChange}
+            >
+              {organisations.map((organisation, i) => (
+                <MenuItem
+                  key={`${organisation.id}_${i}`}
+                  value={organisation.id}
+                >
+                  <span style={{ textTransform: 'capitalize' }}>
+                    {organisation.name}
+                  </span>
+                </MenuItem>
+              ))}
+            </Select>
+          </FormControl>
+
+          <FormControl
+            variant="outlined"
+            className={classes.earningsFilterSelectFormControl}
+          >
+            <InputLabel id="contract_type_id">Contract Type</InputLabel>
+            <Select
+              labelId="contract_type_id"
+              id="contract_type_id"
+              name="contract_type_id"
+              label="Contract Type"
+              onChange={handleOnFormControlChange}
+            >
+              {PAYMENT_STATUS.map((paymentStatus, i) => (
+                <MenuItem key={`${paymentStatus}_${i}`} value={paymentStatus}>
+                  <span style={{ textTransform: 'capitalize' }}>
+                    {paymentStatus}
+                  </span>
+                </MenuItem>
+              ))}
+            </Select>
+          </FormControl>
+
           <FormControl
             variant="outlined"
             className={classes.earningsFilterSelectFormControl}