diff --git a/ui/apps/platform/src/Containers/VulnMgmt/RiskAcceptance/ApprovedDeferrals/ApprovedDeferralsTable.tsx b/ui/apps/platform/src/Containers/VulnMgmt/RiskAcceptance/ApprovedDeferrals/ApprovedDeferralsTable.tsx index 2ea9310eb015a..9ff1882dc8fe1 100644 --- a/ui/apps/platform/src/Containers/VulnMgmt/RiskAcceptance/ApprovedDeferrals/ApprovedDeferralsTable.tsx +++ b/ui/apps/platform/src/Containers/VulnMgmt/RiskAcceptance/ApprovedDeferrals/ApprovedDeferralsTable.tsx @@ -24,7 +24,7 @@ import VulnerabilityRequestScope from '../PendingApprovals/VulnerabilityRequestS import UndoVulnRequestModal from '../UndoVulnRequestModal'; import UpdateDeferralModal from './UpdateDeferralModal'; import ApprovedDeferralActionsColumn from './ApprovedDeferralActionsColumn'; -import ImpactedEntities from '../ImpactedEntities'; +import ImpactedEntities from '../ImpactedEntities/ImpactedEntities'; import VulnRequestedAction from '../VulnRequestedAction'; import DeferralExpirationDate from '../DeferralExpirationDate'; import ApprovedDeferralsSearchFilter from './ApprovedDeferralsSearchFilter'; @@ -228,7 +228,9 @@ function ApprovedDeferralsTable({ diff --git a/ui/apps/platform/src/Containers/VulnMgmt/RiskAcceptance/ApprovedFalsePositives/ApprovedFalsePositivesTable.tsx b/ui/apps/platform/src/Containers/VulnMgmt/RiskAcceptance/ApprovedFalsePositives/ApprovedFalsePositivesTable.tsx index a98abc59b259a..9b07e24ba20f5 100644 --- a/ui/apps/platform/src/Containers/VulnMgmt/RiskAcceptance/ApprovedFalsePositives/ApprovedFalsePositivesTable.tsx +++ b/ui/apps/platform/src/Containers/VulnMgmt/RiskAcceptance/ApprovedFalsePositives/ApprovedFalsePositivesTable.tsx @@ -23,7 +23,7 @@ import useRiskAcceptance from '../useRiskAcceptance'; import VulnerabilityRequestScope from '../PendingApprovals/VulnerabilityRequestScope'; import UndoVulnRequestModal from '../UndoVulnRequestModal'; import ApprovedFalsePositiveActionsColumn from './ApprovedFalsePositiveActionsColumn'; -import ImpactedEntities from '../ImpactedEntities'; +import ImpactedEntities from '../ImpactedEntities/ImpactedEntities'; import VulnRequestedAction from '../VulnRequestedAction'; import ApprovedFalsePositivesSearchFilter from './ApprovedFalsePositivesSearchFilter'; import SearchFilterResults from '../SearchFilterResults'; @@ -198,7 +198,9 @@ function ApprovedFalsePositivesTable({ diff --git a/ui/apps/platform/src/Containers/VulnMgmt/RiskAcceptance/ImpactedEntities.tsx b/ui/apps/platform/src/Containers/VulnMgmt/RiskAcceptance/ImpactedEntities.tsx deleted file mode 100644 index cf079166bcd48..0000000000000 --- a/ui/apps/platform/src/Containers/VulnMgmt/RiskAcceptance/ImpactedEntities.tsx +++ /dev/null @@ -1,30 +0,0 @@ -import { Flex, FlexItem, Label } from '@patternfly/react-core'; -import pluralize from 'pluralize'; -import React, { ReactElement } from 'react'; - -export type DeferralExpirationDateProps = { - deploymentCount: number; - imageCount: number; -}; - -function ImpactedEntities({ - deploymentCount, - imageCount, -}: DeferralExpirationDateProps): ReactElement { - return ( - - - - - - - - - ); -} - -export default ImpactedEntities; diff --git a/ui/apps/platform/src/Containers/VulnMgmt/RiskAcceptance/ImpactedEntities/ImpactedEntities.tsx b/ui/apps/platform/src/Containers/VulnMgmt/RiskAcceptance/ImpactedEntities/ImpactedEntities.tsx new file mode 100644 index 0000000000000..8dcd9911c5d9d --- /dev/null +++ b/ui/apps/platform/src/Containers/VulnMgmt/RiskAcceptance/ImpactedEntities/ImpactedEntities.tsx @@ -0,0 +1,76 @@ +import React, { useState, ReactElement } from 'react'; +import pluralize from 'pluralize'; +import { Button, ButtonVariant, Flex, FlexItem, Label } from '@patternfly/react-core'; + +import entityTypes from 'constants/entityTypes'; +import ImpactedEntitiesModal from './ImpactedEntitiesModal'; + +export type ImpactedEntitiesProps = { + deployments: any; + deploymentCount: number; + images: any; + imageCount: number; +}; + +function ImpactedEntities({ + deployments, + deploymentCount, + images, + imageCount, +}: ImpactedEntitiesProps): ReactElement { + const [modalTypeOpen, setModalTypeOpen] = useState(''); + + function openModal(entityType) { + setModalTypeOpen(entityType); + } + + function closeModal() { + setModalTypeOpen(''); + } + return ( + <> + + + + + + + + + + + + ); +} + +export default ImpactedEntities; diff --git a/ui/apps/platform/src/Containers/VulnMgmt/RiskAcceptance/ImpactedEntities/ImpactedEntitiesModal.tsx b/ui/apps/platform/src/Containers/VulnMgmt/RiskAcceptance/ImpactedEntities/ImpactedEntitiesModal.tsx new file mode 100644 index 0000000000000..33c7e3370fcc8 --- /dev/null +++ b/ui/apps/platform/src/Containers/VulnMgmt/RiskAcceptance/ImpactedEntities/ImpactedEntitiesModal.tsx @@ -0,0 +1,72 @@ +import React, { ReactElement } from 'react'; +import { Link } from 'react-router-dom'; +import { Flex, FlexItem, Modal, ModalVariant, Title } from '@patternfly/react-core'; +import { TableComposable, Thead, Tr, Th, Tbody, Td } from '@patternfly/react-table'; +import pluralize from 'pluralize'; + +import entityTypes from 'constants/entityTypes'; +import { resourceLabels } from 'messages/common'; +import { vulnManagementPath } from 'routePaths'; + +function EntityName({ entity, entityType }) { + return entityType === entityTypes.IMAGE ? ( + + {entity?.name?.fullName} + + ) : ( + + + + {entity.name} + + + + {`in "${entity.clusterName as string}/${entity.namespace as string}"`} + + + ); +} +export type ImpactedEntitiesModalProps = { + isOpen: boolean; + entityType: string; + entities: Record[]; + onClose: () => void; +}; + +function ImpactedEntitiesModal({ + isOpen, + entityType, + entities, + onClose, +}: ImpactedEntitiesModalProps): ReactElement { + const entityTypeName = pluralize(resourceLabels[entityType] ?? '', entities?.length); + const header = ( + + <span style={{ textTransform: 'capitalize' }}>{entityTypeName}</span> impacted by this + request + + ); + + return ( + + + + + Name + + + + {entities.map((entity) => ( + + + + + + ))} + + + + ); +} + +export default ImpactedEntitiesModal; diff --git a/ui/apps/platform/src/Containers/VulnMgmt/RiskAcceptance/PendingApprovals/PendingApprovalsTable.tsx b/ui/apps/platform/src/Containers/VulnMgmt/RiskAcceptance/PendingApprovals/PendingApprovalsTable.tsx index e76f2accac1df..123576b17bfda 100644 --- a/ui/apps/platform/src/Containers/VulnMgmt/RiskAcceptance/PendingApprovals/PendingApprovalsTable.tsx +++ b/ui/apps/platform/src/Containers/VulnMgmt/RiskAcceptance/PendingApprovals/PendingApprovalsTable.tsx @@ -30,7 +30,7 @@ import DenyDeferralModal from './DenyDeferralModal'; import DenyFalsePositiveModal from './DenyFalsePositiveModal'; import CancelVulnRequestModal from './CancelVulnRequestModal'; import DeferralExpirationDate from '../DeferralExpirationDate'; -import ImpactedEntities from '../ImpactedEntities'; +import ImpactedEntities from '../ImpactedEntities/ImpactedEntities'; import PendingApprovalsSearchFilter from './PendingApprovalsSearchFilter'; import SearchFilterResults from '../SearchFilterResults'; @@ -296,7 +296,9 @@ function PendingApprovalsTable({ diff --git a/ui/apps/platform/src/Containers/VulnMgmt/RiskAcceptance/vulnerabilityRequests.graphql.ts b/ui/apps/platform/src/Containers/VulnMgmt/RiskAcceptance/vulnerabilityRequests.graphql.ts index 57d538ce77e73..bfcb17ab57713 100644 --- a/ui/apps/platform/src/Containers/VulnMgmt/RiskAcceptance/vulnerabilityRequests.graphql.ts +++ b/ui/apps/platform/src/Containers/VulnMgmt/RiskAcceptance/vulnerabilityRequests.graphql.ts @@ -16,7 +16,19 @@ export type VulnerabilityRequest = { cves: { ids: string[]; }; + deployments: { + id: string; + name: string; + namespace: string; + clusterName: string; + }; deploymentCount: number; + images: { + id: string; + name: { + fullName: string; + }; + }; imageCount: number; }; @@ -84,7 +96,19 @@ export const GET_VULNERABILITY_REQUESTS = gql` cves { ids } + deployments(query: $query) { + id + name + namespace + clusterName + } deploymentCount(query: $query) + images(query: $query) { + id + name { + fullName + } + } imageCount(query: $query) } vulnerabilityRequestsCount(query: $query)