ppr purchased and receipts submitted

backend/emails/emails.js

@@ -217,6 +217,25 @@ const sendEmailUPRApprovedToCoordinator = async (upr) => {
     })
 }
 
+const sendEmailPPRPurchasedAndReceiptsSubmittedToCoordinator = async (ppr) => {
+    const Subject = `[Purchased And Receipts Submitted] ${ppr.codename}`
+    const HTMLPart =
+        getMainMessageHTML(
+            `Item ${ppr.codename} has been purchased and receipts have been submitted! Please review the expense claim form and reimburse the reporter out of WATonomous' cash account.`
+        ) +
+        (await getUPRTicketInfoHTML(ppr)) +
+        getTicketLinkHTML(ppr.path)
+    const To = await getEmailToSection(ppr.reporter_id, [
+        EMAIL_RECIPIENTS.finance,
+        EMAIL_RECIPIENTS.coordinator,
+    ])
+    await sendEmail({
+        Subject,
+        HTMLPart,
+        To,
+    })
+}
+
 const PurchaseRequestInvalidated = (purchaseRequestDetails) => {
     const { issue, reporter } = purchaseRequestDetails
 
@@ -544,6 +563,7 @@ module.exports = {
     sendEmailUPRPurchasedToCoordinator,
     sendEmailPPRApprovedToReporter,
     sendEmailPPRCreatedToApprovers,
+    sendEmailPPRPurchasedAndReceiptsSubmittedToCoordinator,
     PurchaseRequestInvalidated,
     PersonalPurchaseApproved,
     UWFinancePurchaseApproved,

backend/service/personalpurchases.service.js

@@ -7,6 +7,7 @@ const {
 const {
     sendEmailPPRCreatedToApprovers,
     sendEmailPPRApprovedToReporter,
+    sendEmailPPRPurchasedAndReceiptsSubmittedToCoordinator,
 } = require('../emails/emails')
 
 const getAllPersonalPurchases = () => {
@@ -30,10 +31,16 @@ const createPersonalPurchase = async (body) => {
     return annotatedPPR
 }
 
-const updatePersonalPurchase = (id, body) => {
-    return PersonalPurchase.findByIdAndUpdate(id, body, {
+const updatePersonalPurchase = async (id, body) => {
+    // READY_TO_BUY -> PURCHASED_AND_RECEIPTS_SUBMITTED
+    const newPurchaseTicket = PersonalPurchase.findByIdAndUpdate(id, body, {
         new: true,
     })
+    if (body?.status === 'PURCHASED_AND_RECEIPTS_SUBMITTED') {
+        const annotatedPPR = await getPersonalPurchase(id)
+        sendEmailPPRPurchasedAndReceiptsSubmittedToCoordinator(annotatedPPR)
+    }
+    return newPurchaseTicket
 }
 
 const updateFILinkPersonalPurchase = async (id, new_fi_link) => {

frontend/src/components/TicketContent/PPRReporterTable.js

@@ -0,0 +1,52 @@
+import { Button, Center, Heading, Tooltip, VStack } from '@chakra-ui/react'
+import React from 'react'
+import { useSetRecoilState } from 'recoil'
+import { allTicketsState } from '../../state/atoms'
+import { axiosPreset } from '../../axiosConfig'
+import { TICKET_ENDPOINTS } from '../../constants'
+import { getAllTickets } from '../../utils/globalSetters'
+
+const PPRReporterTable = ({ currentTicket, supportingDocuments }) => {
+    const setAllTickets = useSetRecoilState(allTicketsState)
+
+    const transitionToPurchasedAndReceiptsSubmitted = async () => {
+        const payload = {
+            status: 'PURCHASED_AND_RECEIPTS_SUBMITTED',
+        }
+        await axiosPreset.patch(
+            `${TICKET_ENDPOINTS.PPR}/${currentTicket._id}`,
+            payload
+        )
+        await getAllTickets(setAllTickets)
+    }
+
+    return (
+        <VStack
+            border="1px solid black"
+            borderRadius="8px"
+            padding="8px"
+            mb="30px"
+        >
+            <Heading size="md">Reporter View</Heading>
+            <Center pb="7px">
+                <Tooltip
+                    hasArrow
+                    label="Please upload at least one supporting document before requesting reimbursement."
+                    isDisabled={supportingDocuments.length !== 0}
+                >
+                    <Button
+                        colorScheme="blue"
+                        size="sm"
+                        mr="20px"
+                        onClick={transitionToPurchasedAndReceiptsSubmitted}
+                        disabled={supportingDocuments.length === 0}
+                    >
+                        Confirm Item(s) Purchased and Request Reimbursement
+                    </Button>
+                </Tooltip>
+            </Center>
+        </VStack>
+    )
+}
+
+export default PPRReporterTable

frontend/src/pages/Dashboard.js

@@ -44,6 +44,8 @@ import PPRAdminContentTable from '../components/TicketContent/PPRAdminContentTab
 import FIAdminContentTable from '../components/TicketContent/FIAdminContentTable'
 import { getAllTickets } from '../utils/globalSetters'
 import FileViewer from '../components/FileViewer'
+import PPRReporterTable from '../components/TicketContent/PPRReporterTable'
+
 const Dashboard = () => {
     const navigate = useNavigate()
     const location = useLocation()
@@ -103,6 +105,10 @@ const Dashboard = () => {
         fetchData()
     }, [setAllTickets])
 
+    const isReporter = () => {
+        return auth.currentUser.uid === currentTicket.reporter_id
+    }
+
     const getUploadedFiles = useCallback(async () => {
         if (!currentTicket?.code) {
             return
@@ -178,6 +184,13 @@ const Dashboard = () => {
                 return (
                     <>
                         {auth.isAdmin && <PPRAdminContentTable />}
+                        {isReporter() &&
+                            currentTicket.status === 'READY_TO_BUY' && (
+                                <PPRReporterTable
+                                    supportingDocuments={supportingDocuments}
+                                    currentTicket={currentTicket}
+                                />
+                            )}
                         <PPRContentTable />
                     </>
                 )