Skip to content

Commit

Permalink
Merge branch 'dev' of https://github.com/onc-healthit/site-ui-4 into …
Browse files Browse the repository at this point in the history 
…matt-dev-add-new-ga4-events
  • Loading branch information
@mattystank
mattystank committed Oct 18, 2024
2 parents 414e18a + 18db119 commit 5139a06
Show file tree
Hide file tree
Showing 3 changed files with 145 additions and 99 deletions.
19 changes: 10 additions & 9 deletions src/components/direct/hisp/TestCard.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -313,7 +313,7 @@ const TestCard = ({
}

const renderCriteriaMetIcon = () => {
if (criteriaMet === 'TRUE') {
if (criteriaMet === 'TRUE' || criteriaMet === 'PASSED') {
return <CheckCircleIcon style={{ color: 'green' }} />
} else if (criteriaMet === 'FALSE') {
return <CancelIcon style={{ color: 'red' }} />
Expand Down Expand Up @@ -556,15 +556,16 @@ const TestCard = ({
<Button variant="contained" color="inherit" onClick={() => handleToggleLogs('Open Logs')}>
LOGS
</Button>
{test.criteria &&
{((test.criteria &&
criteriaMet &&
Array.from(clearButtonVisibleOnCriteriaSet).some((status) => criteriaMet.includes(status)) && (
<Box sx={{ display: 'flex', gap: 1 }}>
<Button variant="contained" color="inherit" onClick={handleClearTest}>
Clear
</Button>
</Box>
)}
Array.from(clearButtonVisibleOnCriteriaSet).some((status) => criteriaMet.includes(status))) ||
isFinished) && (
<Box sx={{ display: 'flex', gap: 1 }}>
<Button variant="contained" color="inherit" onClick={handleClearTest}>
Clear
</Button>
</Box>
)}
{test.criteria && manualValidationCriteria.includes(test.criteria) && !apiError && isFinished && (
<Typography sx={{ ml: 2, color: 'error.main' }}>Waiting Validation</Typography>
)}
Expand Down
217 changes: 131 additions & 86 deletions src/components/direct/hisp/XDRTestCard.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -9,11 +9,10 @@ import {
Tooltip,
Typography,
FormControl,
Popover,
} from '@mui/material'
import ContentPasteGoIcon from '@mui/icons-material/ContentPasteGo'
import _ from 'lodash'
import React, { useState, useEffect, useRef } from 'react'
import React, { useState, useRef } from 'react'
import DynamicTable from './DynamicTable'
import { handleXDRAPICall, GetStatus } from '../test-by-criteria/ServerActions'
import CheckCircleIcon from '@mui/icons-material/CheckCircle'
Expand Down Expand Up @@ -85,6 +84,7 @@ interface StepTextProps {
inputs: InputFields[]
role?: string
endpointsGenerated: boolean
criteriaMet: string
}

interface ValidationResults {
Expand All @@ -104,30 +104,6 @@ interface CCDAValidationResult {
const senderText = 'Hit Run to generate your endpoint.'
const receiverText = 'Hit Run to send a XDR message.'

const StepText = ({ inputs, role, endpointsGenerated }: StepTextProps) => {
if (endpointsGenerated) {
return (
<Typography variant="body2">
<strong>Step 2:</strong> Send XDR message to endpoint and refresh to check status.
</Typography>
)
}

return (
<>
<Typography variant="body2">
<strong>Step 1:</strong> Provide your{' '}
{inputs.map((input, i) => (
<span key={i}>
{input.name}
{inputs.length - 1 === i ? '. ' : ', '}
</span>
))}
{role === 'sender' ? senderText : receiverText}
</Typography>
</>
)
}
export type FieldValue = boolean | string | number
export type ExtraFields = {
label: string
Expand Down Expand Up @@ -190,7 +166,7 @@ const TestCard = ({ test }: TestCardProps) => {
const [alertSeverity, setAlertSeverity] = useState<'success' | 'error' | 'warning' | 'info'>('info')

const [logType, setLogType] = useState<'request' | 'response' | 'ccdaValidation'>('request')
const manualValidationCriteria = ["['b1-3']", "['b1-3','su1-3']"]
const manualValidationIDs = ['4a', '4b', '20amu2', '20bmu2']
const { data: session } = useSession()
const subHeader = 'Description'
const subDesc = test['Purpose/Description']
Expand All @@ -213,7 +189,6 @@ const TestCard = ({ test }: TestCardProps) => {
const handleAlertClose = () => {
setAlertOpen(false)
}

const toggleLogType = (type: 'request' | 'response' | 'ccdaValidation') => {
setLogType(type)
}
Expand All @@ -234,7 +209,45 @@ const TestCard = ({ test }: TestCardProps) => {
'44mu2',
]
const ccdaRequiredTestIds = ['1', '2', '3add']
const sendEdgeTestsCriteria = ['b1-1']
const isCCDADocumentRequired = ccdaRequiredTestIds.includes(test.id.toString())
const StepText = ({ inputs, role, endpointsGenerated, criteriaMet }: StepTextProps) => {
if (manualValidationIDs.includes(test.id.toString()) && isFinished) {
if (test.id == '20amu2' || test.id == '20bmu2') {
console.log('abc')
testRequest == 'Check your SUT logs and accept or reject'
testResponse == 'Check your SUT logs and accept or reject'
}
return (
<Typography variant="body2">
<strong>Step 3:</strong> Check the logs to accept/reject the response
</Typography>
)
}

if (endpointsGenerated) {
return (
<Typography variant="body2">
<strong>Step 2:</strong> Send XDR message to endpoint and refresh to check status.
</Typography>
)
}

return (
<>
<Typography variant="body2">
<strong>Step 1:</strong> Provide your{' '}
{inputs.map((input, i) => (
<span key={i}>
{input.name}
{inputs.length - 1 === i ? '. ' : ', '}
</span>
))}
{role === 'sender' ? senderText : receiverText}
</Typography>
</>
)
}
const [formData] = useState<{ [key: string]: FieldValue }>(() => {
const initialData: { [key: string]: FieldValue } = {}
test.moreInfo?.fields?.forEach((field) => {
Expand All @@ -250,6 +263,14 @@ const TestCard = ({ test }: TestCardProps) => {
}))
}
}

const fixEndpoint = (url: string): string => {
if (url && !url.startsWith('http://') && !url.startsWith('https://')) {
return 'https://' + url
}
return url
}

//Event trigger twice
const handleRunTest = async () => {
eventTrack(` Run test for ${test.name}`, 'Test By Criteria - XDR Test', `${test.criteria}`)
Expand Down Expand Up @@ -287,6 +308,7 @@ const TestCard = ({ test }: TestCardProps) => {
setIsFinished(true)
if (status.results) {
setValidationResults(status.results)
setEndpointsGenerated(false)
}
} else {
const response = await handleXDRAPICall({
Expand All @@ -309,20 +331,34 @@ const TestCard = ({ test }: TestCardProps) => {
})
setTimeout(() => {
setIsFinished(true)
if (test.criteria && !manualValidationCriteria.includes(test.criteria)) {
if (test.criteria && !manualValidationIDs.includes(test.id.toString())) {
setCriteriaMet(response.criteriaMet)
}
if (
!endpointTestIds.includes(test.id.toString()) &&
(response.endpoint.length > 10 || response.endpointTLS.length > 10)
) {
setEndpointsGenerated(true)
setEndpoint(response.endpoint || defaultEndpoint)
setEndpointTLS(response.endpointTLS || defaultEndpointTLS)
if (!endpointTestIds.includes(test.id.toString())) {
let endpointSet = false
if (response.endpoint && response.endpoint.length > 10) {
setEndpoint(fixEndpoint(response.endpoint))
endpointSet = true
}
if (response.endpointTLS && response.endpointTLS.length > 10) {
setEndpointTLS(fixEndpoint(response.endpointTLS))
endpointSet = true
}
if (endpointSet) {
console.log('setting endpoints generated')
setEndpointsGenerated(true)
}
}
setTestRequestRequest(response.testRequest)
setTestRequestResponse(response.testResponse)
if (!testRequest && !testResponse && test.criteria && !manualValidationCriteria.includes(test.criteria)) {
if (
!testRequest &&
!testResponse &&
test.criteria &&
!manualValidationIDs.includes(test.id.toString()) &&
criteriaMet
) {
console.log('Response null, setting criteria met false')
setCriteriaMet('FALSE')
}
console.log('Criteria met: ', response.criteriaMet)
Expand All @@ -332,12 +368,12 @@ const TestCard = ({ test }: TestCardProps) => {
} catch (error) {
console.error('Failed to run test:', error)
setApiError(true)
if (test.criteria && !manualValidationCriteria.includes(test.criteria)) {
if (test.criteria && !manualValidationIDs.includes(test.id.toString())) {
setCriteriaMet('FALSE')
}
} finally {
setIsLoading(false)
if (test.criteria && !manualValidationCriteria.includes(test.criteria)) {
if (test.criteria && !manualValidationIDs.includes(test.id.toString())) {
setTimeout(() => {
setIsFinished(false)
}, 100)
Expand Down Expand Up @@ -370,10 +406,9 @@ const TestCard = ({ test }: TestCardProps) => {
}

const renderCriteriaMetIcon = () => {
if (endpointsGenerated && criteriaMet != 'PASSED') {
if (endpointsGenerated) {
return <Typography style={{ color: 'red' }}>Pending</Typography>
}
if (criteriaMet === 'TRUE' || criteriaMet === 'PASSED') {
} else if (criteriaMet === 'TRUE' || criteriaMet === 'PASSED' || criteriaMet === 'SUCCESS') {
return <CheckCircleIcon style={{ color: 'green' }} />
} else if (criteriaMet === 'FALSE' || criteriaMet === 'ERROR') {
return <CancelIcon style={{ color: 'red' }} />
Expand Down Expand Up @@ -429,7 +464,12 @@ const TestCard = ({ test }: TestCardProps) => {
return <Typography>No C-CDA Validation results available.</Typography>
}
} else {
const content = logType === 'request' ? testRequest : testResponse
let content = logType === 'request' ? testRequest : testResponse

if ((test.id === '20amu2' || test.id === '20bmu2') && isFinished && (!testRequest || !testResponse)) {
content = 'Check your SUT logs and accept or reject'
}

return <XMLDisplay xmlContent={content || 'No logs to display.'} />
}
}
Expand Down Expand Up @@ -529,19 +569,16 @@ const TestCard = ({ test }: TestCardProps) => {
{renderLogs()}
<Divider sx={{ mb: 2, mt: 2 }} />
<Box sx={{ display: 'flex', justifyContent: 'space-between', alignItems: 'center', mt: 2 }}>
{test.criteria &&
manualValidationCriteria.includes(test.criteria) &&
testRequest &&
testRequest.length > 0 && (
<Box sx={{ display: 'flex', gap: 1 }}>
<Button variant="contained" color="primary" onClick={handleAcceptTest}>
Accept
</Button>
<Button variant="outlined" color="primary" onClick={handleRejectTest}>
Reject
</Button>
</Box>
)}
{test.criteria && manualValidationIDs.includes(test.id.toString()) && isFinished && (
<Box sx={{ display: 'flex', gap: 1 }}>
<Button variant="contained" color="primary" onClick={handleAcceptTest}>
Accept
</Button>
<Button variant="outlined" color="primary" onClick={handleRejectTest}>
Reject
</Button>
</Box>
)}
<Button variant="contained" onClick={handleToggleLogs}>
Close Logs
</Button>
Expand All @@ -554,14 +591,25 @@ const TestCard = ({ test }: TestCardProps) => {
{test.desc}
</Typography>
{_.isEqual(test.sutRole, 'receiver') && _.has(test, 'inputs') && test.inputs !== undefined && (
<StepText inputs={test.inputs} role={test.sutRole} endpointsGenerated={endpointsGenerated} />
<StepText
inputs={test.inputs}
role={test.sutRole}
endpointsGenerated={endpointsGenerated}
criteriaMet={criteriaMet}
/>
)}
{_.isEqual(test.sutRole, 'sender') && _.has(test, 'inputs') && test.inputs !== undefined && (
<StepText inputs={test.inputs} role={test.sutRole} endpointsGenerated={endpointsGenerated} />
<StepText
inputs={test.inputs}
role={test.sutRole}
endpointsGenerated={endpointsGenerated}
criteriaMet={criteriaMet}
/>
)}
{_.has(test, 'inputs') &&
test.inputs &&
!endpointsGenerated &&
!isFinished &&
test.inputs.filter(shouldDisplayInput).map((input) => (
<Box sx={{ pt: 2 }} key={input.key || 'default-key'}>
<FormControl fullWidth>
Expand Down Expand Up @@ -601,16 +649,22 @@ const TestCard = ({ test }: TestCardProps) => {
Endpoint
</Button>
</Tooltip>
<Tooltip placement="bottom" title={endpointsGenerated ? endpointTLS : `${defaultEndpointTLS}`} arrow>
<Button
sx={{ ml: 2 }}
color="secondary"
endIcon={<ContentPasteGoIcon />}
onClick={(e) => handleClick(e, endpointsGenerated ? endpointTLS : `${defaultEndpointTLS}`)}
{test.id != 7 && (
<Tooltip
placement="bottom"
title={endpointsGenerated ? endpointTLS : `${defaultEndpointTLS}`}
arrow
>
Endpoint TLS
</Button>
</Tooltip>
<Button
sx={{ ml: 2 }}
color="secondary"
endIcon={<ContentPasteGoIcon />}
onClick={(e) => handleClick(e, endpointsGenerated ? endpointTLS : `${defaultEndpointTLS}`)}
>
Endpoint TLS
</Button>
</Tooltip>
)}
</Box>
)}
{requiresCCDADocument() && !endpointsGenerated && (
Expand Down Expand Up @@ -658,25 +712,16 @@ const TestCard = ({ test }: TestCardProps) => {
<Button variant="contained" color="inherit" onClick={handleToggleLogs}>
LOGS
</Button>
{test.criteria &&
criteriaMet &&
(criteriaMet.includes('TRUE') ||
criteriaMet.includes('FALSE') ||
criteriaMet.includes('ERROR') ||
criteriaMet.includes('PASSED') ||
criteriaMet.includes('PENDING') ||
criteriaMet.includes('SUCCESS')) && (
<Box sx={{ display: 'flex', gap: 1 }}>
<Button variant="contained" color="inherit" onClick={handleClearTest}>
Clear
</Button>
</Box>
)}
{test.criteria &&
manualValidationCriteria.includes(test.criteria) &&
(testRequest || testResponse) &&
isFinished &&
!apiError && <Typography sx={{ ml: 2, color: 'error.main' }}>Waiting Validation</Typography>}
{((test.criteria && criteriaMet) || isFinished) && (
<Box sx={{ display: 'flex', gap: 1 }}>
<Button variant="contained" color="inherit" onClick={handleClearTest}>
Clear
</Button>
</Box>
)}
{test.criteria && manualValidationIDs.includes(test.id.toString()) && isFinished && !apiError && (
<Typography sx={{ ml: 2, color: 'error.main' }}>Waiting Validation</Typography>
)}
</Box>
</Box>
</>
Expand Down
8 changes: 4 additions & 4 deletions src/components/direct/test-by-criteria/ServerActions.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -205,10 +205,10 @@ export async function handleXDRAPICall(data: XDRAPICallData): Promise<XDRAPIResp
let endpointTLS = ''

if (content && content.content && content.content.value) {
testRequest = content.content.value.request || content.message
testResponse = content.content.value.response || content.message
endpoint = content.content.value.endpoint || content.message
endpointTLS = content.content.value.endpointTLS || content.message
testRequest = content.content.value.request
testResponse = content.content.value.response
endpoint = content.content.value.endpoint
endpointTLS = content.content.value.endpointTLS
} else {
console.error('Invalid response structure:', content)
testRequest = content.message
Expand Down

0 comments on commit 5139a06

Please sign in to comment.