import React from 'react' ; import { Box , List , ListItem } from '@material-ui/core' ; import Alert from '@material-ui/lab/Alert' ; import { InfoCard , Progress , StructuredMetadataTable , MissingAnnotationEmptyState } from '@backstage/core-components' ; import { Entity } from '@backstage/catalog-model' ; import { useProtectedBranches , useRepoLicence , } from '../../../hooks/useComplianceHooks' ; import { useProjectEntity } from '../../../hooks/useProjectEntity' ; import { isGithubInsightsAvailable , GITHUB_INSIGHTS_ANNOTATION } from '../../utils/isGithubInsightsAvailable' ; import WarningIcon from '@material-ui/icons/ErrorOutline' ; import { styles as useStyles } from '../../utils/styles' ; import { useEntity } from "@backstage/plugin-catalog-react" ; type Props = { deprecated entity ? : Entity ; } ; const ComplianceCard = ( _props ) => { const { entity } = useEntity ( ) ; const { branches , loading , error } = useProtectedBranches ( entity ) ; const { license , loading : licenseLoading , error : licenseError , } = useRepoLicence ( entity ) ; const classes = useStyles ( ) ; const { owner , repo } = useProjectEntity ( entity ) ; const projectAlert = isGithubInsightsAvailable ( entity ) ; if ( ! projectAlert ) { return < MissingAnnotationEmptyState annotation = { GITHUB_INSIGHTS_ANNOTATION } />; } if ( loading || licenseLoading ) { return < Progress />; } else if ( error || licenseError ) { return ( < Alert severity = "error" > Error occured while fetching data for the compliance card : { ' ' } { error ?. message } < /Alert>); } return ( < InfoCard title = "Compliance report" > < StructuredMetadataTable metadata = { { 'Protected branches' : branches ?. length && owner && repo ? ( < List className = { classes . listStyle } > { branches . map ( ( branch ) => ( < ListItem key = { branch . name } > { branch . name } < /ListItem>))} < /List>) : (<Box display="flex" alignItems="center"> < WarningIcon style = { { color : 'orange' , marginRight : '5px' , flexShrink : 0 , } } / > < span > None < /span> < /Box>), License : license === 'No license file found' ? ( < Box display = "flex" alignItems = "center" > < WarningIcon style = { { color : 'orange' , marginRight : '5px' , flexShrink : 0 , } } /> < span > None < /span> < /Box>) : (license), } } /> < /InfoCard>); } ; export default ComplianceCard ;