get allPOs to show up in uuid component

Author: summer-cook

pages/requests/[uuid].js

@@ -1,4 +1,4 @@
-import React from 'react'
+import React, { useState, useEffect } from 'react'
 import { useRouter } from 'next/router'
 import { useSession } from 'next-auth/react'
 import {
@@ -37,14 +37,30 @@ const Request = () => {
   const { uuid } = router.query
   const { request, isLoadingRequest, isRequestError } = useOneRequest(uuid, session?.accessToken)
   const { allSOWs, isLoadingSOWs, isSOWError } = useAllSOWs(uuid, request?.identifier, session?.accessToken)
-  const { allPOs, isLoadingPOs, isPOError } = useAllPOs(request?.quotedWareID, uuid, request?.identifier, session?.accessToken)
-  //console.log(allPOs, 'uuid.js all POS')
   const { messages, isLoadingMessages, isMessagesError, mutateMessages, messagesData } = useMessages(uuid, session?.accessToken)
   const { files, isLoadingFiles, isFilesError, mutateFiles, filesData } = useFiles(uuid, session?.accessToken)
-  const documents = (allSOWs) ? [...allSOWs] : []
 
-  const isLoading = isLoadingRequest || isLoadingSOWs || isLoadingFiles || isLoadingMessages
+  const [allPOs, setAllPOs] = useState(false)
+  const [isPOError, setIsPOError] = useState(false)
+  const [isPOLoading, setIsPOLoading] = useState(false)
+  useEffect(() => {
+    const getPOsAsync = async () => {
+      const response = await useAllPOs(request?.quotedWareID, uuid, request?.identifier, session?.accessToken)
+      if (response.allPOs) {
+        setAllPOs(response.allPOs)
+      } else if (response.isPOError) {
+        setIsPOError(response.isPOError)
+      } else {
+        setIsPOLoading(true)
+      }
+    }
+    getPOsAsync()
+  }, [allPOs]);
+  
+  console.log(allPOs)
+  const isLoading = isLoadingRequest || isLoadingSOWs || isLoadingFiles || isLoadingMessages || isPOLoading
   const isError = isRequestError || isSOWError || isFilesError|| isMessagesError
+  const documents = (allSOWs) ? [...allSOWs] : []
 
   if (isLoading) return <Loading wrapperClass='item-page mt-5' />
 

utils/api/configurations.js

@@ -186,8 +186,6 @@ export const  configureFiles = (data) => {
 }
 
 export const configureDocuments = (documents, requestIdentifier) => {
-  //lineitems, shipto, shipfrom, and terms are only in SOWs
-  // POs will need a SOW identifier to match up and get data from the correct SOW
   return documents?.map(document => ({
     identifier: document.identifier,
     date: normalizeDate(document.created_at),
@@ -210,12 +208,14 @@ export const configureDocuments = (documents, requestIdentifier) => {
       organizationName: document.ship_from?.organization_name,
       text: document.ship_from?.text,
     },
+    // the following properties only need to exist on POs
+    turnaroundTime: document.turn_around_time.human || '',
+    poNumber: document.po_number || '',
+    relatedSOWIdentifier: document.proposal_ref?.identifier || '',
+    adPO: document.scientist_identifier,
   }))
 }
 
-// export const configurePOs = (POs, requestIdentifier, relatedSOWIdentifier) => {
-
-// }
 
 const configureLineItems = (lineItems) => (lineItems.map(lineItem => ({
   id: lineItem.id,

utils/api/requests.js

@@ -55,24 +55,24 @@ export const useAllSOWs = (id, requestIdentifier, accessToken) => {
   }
 }
 
-export const useAllPOs = (quotedWareId, uuid, requestIdentifier, accessToken) => {
-  const { data: allPOData, error: allPOErrors } = useSWR(quotedWareId ? [`quote_groups/${uuid}/quoted_wares/${quotedWareId}/purchase_orders.json`, accessToken] : null)
+// TODO(summer-cook): eventually we can use the useSWRList hook here instead of mapping & calling the fetcher. This hook is actively being contributed to the swr repo, but the semantics of the work are still being debated. see https://github.com/vercel/swr/discussions/1988 for the RFC and https://github.com/vercel/swr/pull/2047 for the PR.
+export const useAllPOs = async (quotedWareId, uuid, requestIdentifier, accessToken) => {
   let allPOs
-  let arrayOfPOIds = []
   let enhancedPOArray = []
-  allPOData && allPOData.map((po) => {arrayOfPOIds.push(po.id)})
-  arrayOfPOIds && arrayOfPOIds.map( async (poId) => {
-    let onePOData = await fetcher(`quote_groups/${uuid}/quoted_wares/${quotedWareId}/purchase_orders/${poId}.json`, accessToken)
-    enhancedPOArray.push(onePOData)
-  })
-  // need to still configure POs to make sure they are returning all the right stuff, also need to figure out how best to use loading and error in this call
-  if (enhancedPOArray.length) {
-    allPOs = configurePOs(enhancedPOArray, requestIdentifier)
-  }
-  return {
-    allPOs,
-    //isLoadingPOs: !error && !data,
-    //isPOError: error,
+  let arrayOfPOIds = []
+  try {
+    const allPOData = await fetcher(`quote_groups/${uuid}/quoted_wares/${quotedWareId}/purchase_orders.json`, accessToken)
+    allPOData && allPOData.map((po) => {arrayOfPOIds.push(po.id)})
+    arrayOfPOIds && await Promise.all(arrayOfPOIds.map(async (poId) => {
+      const onePOData = await fetcher(`quote_groups/${uuid}/quoted_wares/${quotedWareId}/purchase_orders/${poId}.json`, accessToken)
+      return enhancedPOArray.push(onePOData)
+    }))
+    allPOs = configureDocuments(enhancedPOArray, requestIdentifier)
+    return { allPOs }
+  } catch (error) {
+    return {
+      isPOError: error
+    }
   }
 }