Merge branch 'KelvinTegelaar:dev' into dev

BNWEIN · Sep 13, 2023 · 3f761c8 · 3f761c8
2 parents 6690583 + 0a097d5
commit 3f761c8
Show file tree

Hide file tree

Showing 35 changed files with 1,377 additions and 267 deletions.
diff --git a/package-lock.json b/package-lock.json
diff --git a/package.json b/package.json
@@ -41,6 +41,7 @@
     "@monaco-editor/react": "^4.5.2",
     "@popperjs/core": "^2.10.2",
     "@reduxjs/toolkit": "^1.7.0",
+    "@rjsf/bootstrap-4": "^5.12.1",
     "@rjsf/core": "^5.12.1",
     "@rjsf/utils": "^5.12.1",
     "@rjsf/validator-ajv8": "^5.12.1",
@@ -60,6 +61,7 @@
     "prop-types": "^15.7.2",
     "react": "^17.0.2",
     "react-app-polyfill": "^2.0.0",
+    "react-bootstrap": "^1.6.5",
     "react-copy-to-clipboard": "^5.0.4",
     "react-data-table-component": "^7.4.5",
     "react-datepicker": "^4.10.0",

diff --git a/public/version_latest.txt b/public/version_latest.txt
@@ -1 +1 @@
-4.1.0
+4.2.1
diff --git a/src/_nav.js b/src/_nav.js
@@ -173,8 +173,8 @@ const _nav = [
       },
       {
         component: CNavItem,
-        name: 'BPA Field Builder',
-        to: '/tenant/tools/bpa-field-builder',
+        name: 'BPA Report Builder',
+        to: '/tenant/tools/bpa-report-builder',
       },
     ],
   },

diff --git a/src/components/tables/CippTable.js b/src/components/tables/CippTable.js
@@ -14,6 +14,7 @@ import {
   CModalBody,
   CModalTitle,
   CCallout,
+  CFormSelect,
 } from '@coreui/react'
 import DataTable, { createTheme } from 'react-data-table-component'
 import PropTypes from 'prop-types'
@@ -24,6 +25,7 @@ import { cellGenericFormatter } from './CellGenericFormat'
 import { ModalService } from '../utilities'
 import { useLazyGenericGetRequestQuery, useLazyGenericPostRequestQuery } from 'src/store/api/app'
 import { ConfirmModal } from '../utilities/SharedModal'
+import { useState } from 'react'
 
 const FilterComponent = ({
   filterText,
@@ -156,6 +158,40 @@ export default function CippTable({
   const [selectedRows, setSelectedRows] = React.useState(false)
   const [genericGetRequest, getResults] = useLazyGenericGetRequestQuery()
   const [genericPostRequest, postResults] = useLazyGenericPostRequestQuery()
+  const [getDrowndownInfo, dropDownInfo] = useLazyGenericGetRequestQuery()
+  const [modalContent, setModalContent] = useState(null)
+  useEffect(() => {
+    if (dropDownInfo.isFetching) {
+      handleModal(
+        <CSpinner />,
+        modalContent.item.modalUrl,
+        modalContent.item.modalType,
+        modalContent.item.modalBody,
+        modalContent.item.modalInput,
+        modalContent.item.modalDropdown,
+      )
+    }
+    if (dropDownInfo.isSuccess) {
+      console.log(modalContent)
+      handleModal(
+        modalContent.item.modalMessage,
+        modalContent.item.modalUrl,
+        modalContent.item.modalType,
+        modalContent.item.modalBody,
+        modalContent.item.modalInput,
+        modalContent.item.modalDropdown,
+      )
+    } else if (dropDownInfo.isError) {
+      handleModal(
+        'Error connecting to the API.',
+        modalContent.item.modalUrl,
+        modalContent.item.modalType,
+        modalContent.item.modalBody,
+        modalContent.item.modalInput,
+        modalContent.item.modalDropdown,
+      )
+    }
+  }, [dropDownInfo])
   const handleSelectedChange = ({ selectedRows }) => {
     setSelectedRows(selectedRows)
     if (selectedRows.length < 1) {
@@ -229,84 +265,118 @@ export default function CippTable({
       },
     },
   }
-  const subHeaderComponentMemo = React.useMemo(() => {
-    const handleClear = () => {
-      if (filterText) {
-        setResetPaginationToggle(!resetPaginationToggle)
-        setFilterText('')
-      }
-    }
-    const handleModal = (modalMessage, modalUrl, modalType = 'GET', modalBody, modalInput) => {
-      if (modalType === 'GET') {
-        ModalService.confirm({
-          body: (
-            <div style={{ overflow: 'visible' }}>
-              <div>{modalMessage}</div>
-            </div>
-          ),
-          title: 'Confirm',
-          onConfirm: async () => {
-            const resultsarr = []
-            for (const row of selectedRows) {
-              setLoopRunning(true)
-              const urlParams = new URLSearchParams(modalUrl.split('?')[1])
-              for (let [paramName, paramValue] of urlParams.entries()) {
-                if (paramValue.startsWith('!')) {
-                  urlParams.set(paramName, row[paramValue.replace('!', '')])
-                }
+  const handleModal = (
+    modalMessage,
+    modalUrl,
+    modalType = 'GET',
+    modalBody,
+    modalInput,
+    modalDropdown,
+  ) => {
+    if (modalType === 'GET') {
+      ModalService.confirm({
+        body: (
+          <div style={{ overflow: 'visible' }}>
+            <div>{modalMessage}</div>
+          </div>
+        ),
+        title: 'Confirm',
+        onConfirm: async () => {
+          const resultsarr = []
+          for (const row of selectedRows) {
+            setLoopRunning(true)
+            const urlParams = new URLSearchParams(modalUrl.split('?')[1])
+            for (let [paramName, paramValue] of urlParams.entries()) {
+              if (paramValue.startsWith('!')) {
+                urlParams.set(paramName, row[paramValue.replace('!', '')])
               }
-              const NewModalUrl = `${modalUrl.split('?')[0]}?${urlParams.toString()}`
-              const results = await genericGetRequest({ path: NewModalUrl, refreshParam: row.id })
-              resultsarr.push(results)
-              setMassResults(resultsarr)
             }
-            setLoopRunning(false)
-          },
-        })
-      } else {
-        ModalService.confirm({
-          body: (
-            <div style={{ overflow: 'visible' }}>
-              {modalInput && (
-                <div>
-                  <CFormInput ref={inputRef} type="text" />
-                </div>
-              )}
-              <div>{modalMessage}</div>
-            </div>
-          ),
-          title: 'Confirm',
-          onConfirm: async () => {
-            const resultsarr = []
-            for (const row of selectedRows) {
-              setLoopRunning(true)
-              const urlParams = new URLSearchParams(modalUrl.split('?')[1])
-              for (let [paramName, paramValue] of urlParams.entries()) {
-                if (paramValue.toString().startsWith('!')) {
-                  urlParams.set(paramName, row[paramValue.replace('!', '')])
-                }
+            const NewModalUrl = `${modalUrl.split('?')[0]}?${urlParams.toString()}`
+            const results = await genericGetRequest({ path: NewModalUrl, refreshParam: row.id })
+            resultsarr.push(results)
+            setMassResults(resultsarr)
+          }
+          setLoopRunning(false)
+        },
+      })
+    } else {
+      ModalService.confirm({
+        body: (
+          <div style={{ overflow: 'visible' }}>
+            {modalInput && (
+              <div>
+                <CFormInput ref={inputRef} type="text" />
+              </div>
+            )}
+            {modalDropdown && (
+              <div>
+                {dropDownInfo.isSuccess && (
+                  <CFormSelect
+                    ref={inputRef}
+                    options={dropDownInfo.data.map((data) => ({
+                      value: data[modalDropdown.valueField],
+                      label: data[modalDropdown.labelField],
+                    }))}
+                  />
+                )}
+              </div>
+            )}
+            <div>{modalMessage}</div>
+          </div>
+        ),
+        title: 'Confirm',
+        onConfirm: async () => {
+          const resultsarr = []
+          for (const row of selectedRows) {
+            setLoopRunning(true)
+            const urlParams = new URLSearchParams(modalUrl.split('?')[1])
+            for (let [paramName, paramValue] of urlParams.entries()) {
+              if (paramValue.toString().startsWith('!')) {
+                urlParams.set(paramName, row[paramValue.replace('!', '')])
               }
-              const newModalBody = {}
-              for (let [objName, objValue] of Object.entries(modalBody)) {
-                if (objValue.toString().startsWith('!')) {
-                  newModalBody[objName] = row[objValue.replace('!', '')]
-                }
+            }
+            const newModalBody = {}
+            for (let [objName, objValue] of Object.entries(modalBody)) {
+              if (objValue.toString().startsWith('!')) {
+                newModalBody[objName] = row[objValue.replace('!', '')]
               }
-              const NewModalUrl = `${modalUrl.split('?')[0]}?${urlParams.toString()}`
-              const results = await genericPostRequest({
-                path: NewModalUrl,
-                values: { ...modalBody, ...newModalBody, ...{ input: inputRef.current.value } },
-              })
-              resultsarr.push(results)
-              setMassResults(resultsarr)
             }
-            setLoopRunning(false)
-          },
-        })
+            const NewModalUrl = `${modalUrl.split('?')[0]}?${urlParams.toString()}`
+            const results = await genericPostRequest({
+              path: NewModalUrl,
+              values: { ...modalBody, ...newModalBody, ...{ input: inputRef.current.value } },
+            })
+            resultsarr.push(results)
+            setMassResults(resultsarr)
+          }
+          setLoopRunning(false)
+        },
+      })
+    }
+  }
+  const subHeaderComponentMemo = React.useMemo(() => {
+    const handleClear = () => {
+      if (filterText) {
+        setResetPaginationToggle(!resetPaginationToggle)
+        setFilterText('')
       }
     }
+
     const executeselectedAction = (item) => {
-      handleModal(item.modalMessage, item.modalUrl, item.modalType, item.modalBody, item.modalInput)
+      setModalContent({
+        item,
+      })
+      if (item.modalDropdown) {
+        getDrowndownInfo({ path: item.modalDropdown.url })
+      }
+      handleModal(
+        item.modalMessage,
+        item.modalUrl,
+        item.modalType,
+        item.modalBody,
+        item.modalInput,
+        item.modalDropdown,
+      )
     }
     const defaultActions = []
     const dataKeys = () => {