36 lines
1.6 KiB
TypeScript
36 lines
1.6 KiB
TypeScript
import {SecuritySummaryReportResultType} from "@/types/security-summary";
|
|
import {Card, CardContent, CardDescription, CardHeader, CardTitle} from "@/Components/ui/card";
|
|
import {ShieldAlert} from "lucide-react";
|
|
import {Progress} from "@/Components/ui/progress";
|
|
import React from "react";
|
|
|
|
export default function OverviewVulnerabilityScoreCard({ reportData }: { reportData: SecuritySummaryReportResultType }) {
|
|
return (
|
|
<Card>
|
|
<CardHeader>
|
|
<CardTitle className="flex items-center gap-2">
|
|
<ShieldAlert className="w-5 h-5"/>
|
|
Vulnerability Score
|
|
</CardTitle>
|
|
<CardDescription>Active and passive vulnerability scores</CardDescription>
|
|
</CardHeader>
|
|
<CardContent>
|
|
<div className="space-y-2">
|
|
<div>
|
|
<div className="text-xs text-muted-foreground">Active Score</div>
|
|
<Progress value={reportData.vulnerability_score_active} className="mt-1"/>
|
|
<div className="text-sm font-medium">{reportData.vulnerability_score_active}%
|
|
</div>
|
|
</div>
|
|
<div>
|
|
<div className="text-xs text-muted-foreground">Passive Score</div>
|
|
<Progress value={reportData.vulnerability_score_passive} className="mt-1"/>
|
|
<div className="text-sm font-medium">{reportData.vulnerability_score_passive}%
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</CardContent>
|
|
</Card>
|
|
)
|
|
}
|