Merge pull request #676 from setlife-network/hotfix/1.4.3

Hotfix/1.4.3
setlife-network · Aug 15, 2022 · 5fe6407 · 5fe6407
2 parents b1f80f2 + 4cad711
commit 5fe6407
Show file tree

Hide file tree

Showing 3 changed files with 27 additions and 3 deletions.
diff --git a/src/components/PaymentTile.js b/src/components/PaymentTile.js
@@ -38,7 +38,8 @@ const PaymentTile = (props) => {
     const {
         client,
         payment,
-        project
+        project,
+        active
     } = props
 
     const formattedDatePaid = moment.utc(parseInt(payment.date_paid, 10)).format('MM/DD/YYYY')
@@ -67,6 +68,7 @@ const PaymentTile = (props) => {
     const [openAllocationOverview, setOpenAllocationOverview] = useState(false)
     const [openDeletePayment, setOpenDeletePayment] = useState(false)
     const [selectedAllocation, setSelectedAllocation] = useState(null)
+    const [activeAccordion, setActiveAccordion] = useState(active)
 
     const addAllocation = (props) => {
         setOpenAddAllocationDialog(true)
@@ -85,6 +87,12 @@ const PaymentTile = (props) => {
     const handleEditPayment = () => {
         history.push(`/clients/${client.id}/payments/${payment.id}/update`)
     }
+    const handleRedirect = () => {
+        history.push(`/clients/${client.id}?paymentId=${payment.id}`)
+    }
+    const handleAccordion = () => {
+        setActiveAccordion(activeAccordion ? false : true)
+    }
     const currencyInformation = selectCurrencyInformation({
         currency: client.currency
     })
@@ -224,7 +232,10 @@ const PaymentTile = (props) => {
                 mx={1}
                 className='PaymentTile'
             >
-                <Accordion>
+                <Accordion 
+                    expanded={activeAccordion}
+                    onChange={() => handleAccordion()}
+                >
                     <AccordionSummary
                         expandIcon={
                             <Grid item xs={0.5}>
@@ -282,7 +293,12 @@ const PaymentTile = (props) => {
                                         }
                                     </Typography>
                                     {project && (calculateAllocationsOtherProjects() > 0 ) &&
-                                    <Typography variant='subtitle2' color='secondary'>
+                                    <Typography 
+                                        variant='subtitle2' 
+                                        color='secondary'
+                                        className='link'
+                                        onClick={() => handleRedirect()}
+                                    >
                                         {`${totalAllocatedOtherProjects} to other projects`}
                                     </Typography>
                                     }

diff --git a/src/components/PaymentsList.js b/src/components/PaymentsList.js
@@ -13,6 +13,10 @@ const PaymentsList = (props) => {
         project
     } = props
 
+    const activePayment = window.location.search
+        ? window.location.search.replace('?paymentId=', '')
+        : ''
+
     const renderPaymentTiles = (payments) => {
         return payments.map(p => {
             return (
@@ -22,6 +26,7 @@ const PaymentsList = (props) => {
                             payment={p}
                             client={p.client}
                             project={project}
+                            active={Number(activePayment) == p.id ? true : false}
                         />
                     </Box>
                 </Grid>

diff --git a/src/styles/PaymentTile.scss b/src/styles/PaymentTile.scss
@@ -23,6 +23,9 @@
     .project-name{
         text-transform: capitalize;
     }
+    .link:hover {
+        text-decoration: underline;
+    }
 }
 
 @media screen and (min-width: $sm) {