Move components inside folders
Signed-off-by: Andrea Pavone <info@andreapavone.com>
This commit is contained in:
@ -4,36 +4,43 @@ import {
|
||||
Card,
|
||||
CardContent,
|
||||
CardHeader,
|
||||
CardTitle,
|
||||
CardDescription
|
||||
CardTitle
|
||||
} from '@/Components/ui/card';
|
||||
import { Tabs, TabsContent, TabsList, TabsTrigger } from '@/Components/ui/tabs';
|
||||
import { Button } from "@/Components/ui/button";
|
||||
import { Progress } from '@/Components/ui/progress';
|
||||
import { Alert, AlertDescription, AlertTitle } from '@/Components/ui/alert';
|
||||
import { ShieldAlert, Globe, Database, ChevronLeft, ChevronRight, Check, Copy } from 'lucide-react';
|
||||
import { Alert, AlertDescription } from '@/Components/ui/alert';
|
||||
import { ShieldAlert, ChevronLeft, ChevronRight } from 'lucide-react';
|
||||
import Markdown from 'react-markdown';
|
||||
import {
|
||||
SecuritySummaryReportResultType, SecuritySummaryResponseType,
|
||||
} from '@/types/security-summary';
|
||||
import NumberOfVulnerabilitiesPieChart from "@/Components/NumberOfVulnerabilitiesPieChart";
|
||||
import VulnerabilitiesActiveCard from "@/Components/Dashboard/Vulnerabilities/VulnerabilitiesActiveCard";
|
||||
import VulnerabilitiesPassiveCard from "@/Components/Dashboard/Vulnerabilities/VulnerabilitiesPassiveCard";
|
||||
import SecurityScoresOverviewBarChart from "@/Components/SecurityScoresOverviewBarChart";
|
||||
import PortExposureAnalysis from "@/Components/PortExposureAnalysis";
|
||||
import { useClipboard } from "use-clipboard-copy"
|
||||
import DashboardHeader from "@/Components/DashboardHeader";
|
||||
import ServicesPortExposureCard from "@/Components/Dashboard/Services/ServicesPortExposureCard";
|
||||
import DashboardHeader from "@/Components/Dashboard/DashboardHeader";
|
||||
import OverviewNetworkAssetsCard from "@/Components/Dashboard/Overview/OverviewNetworkAssetsCard";
|
||||
import OverviewSimilarDomainsCard from "@/Components/Dashboard/Overview/OverviewSimilarDomainsCard";
|
||||
import OverviewEmailSecurityCard from "@/Components/Dashboard/Overview/OverviewEmailSecurityCard";
|
||||
import OverviewCertificatesCard from "@/Components/Dashboard/Overview/OverviewCertificatesCard";
|
||||
import OverviewDataLeaksCard from "@/Components/Dashboard/Overview/OverviewDataLeaksCard";
|
||||
import ServicesWafCard from "@/Components/Dashboard/Services/ServicesWafCard";
|
||||
import ServicesCdnCard from "@/Components/Dashboard/Services/ServicesCdnCard";
|
||||
import LeaksEnumerationCard from "@/Components/Dashboard/Leaks/LeaksEnumerationCard";
|
||||
import LeaksResolvedCard from "@/Components/Dashboard/Leaks/LeaksResolvedCard";
|
||||
import LeaksUnresolvedCard from "@/Components/Dashboard/Leaks/LeaksUnresolvedCard";
|
||||
import OverviewVulnerabilityScoreCard from "@/Components/Dashboard/Overview/OverviewVulnerabilityScoreCard";
|
||||
|
||||
|
||||
export default function Dashboard() {
|
||||
export default function Dashboard({ page }: { page:number }) {
|
||||
const [securitySummaryResponse, setSecuritySummaryResponse] = useState<SecuritySummaryResponseType | null>(null);
|
||||
const [reportData, setReportData] = useState<SecuritySummaryReportResultType | null>(null);
|
||||
const [currentPage, setCurrentPage] = useState<number>(0);
|
||||
const [currentPage, setCurrentPage] = useState<number>(page);
|
||||
|
||||
|
||||
useEffect(() => {
|
||||
axios.get<SecuritySummaryResponseType>('/api/v1/security/summary')
|
||||
.then(response => {
|
||||
setSecuritySummaryResponse(response.data);
|
||||
// Set initial report data
|
||||
setReportData(response.data.results[0] ?? null);
|
||||
})
|
||||
.catch(error => {
|
||||
@ -41,7 +48,6 @@ export default function Dashboard() {
|
||||
});
|
||||
}, []);
|
||||
|
||||
// Handle page changes
|
||||
useEffect(() => {
|
||||
if (securitySummaryResponse) {
|
||||
setReportData(securitySummaryResponse.results[currentPage] ?? null);
|
||||
@ -62,9 +68,9 @@ export default function Dashboard() {
|
||||
|
||||
return (
|
||||
<div className="container mx-auto p-4">
|
||||
<DashboardHeader reportData={reportData} />
|
||||
<DashboardHeader reportData={reportData}/>
|
||||
|
||||
<Tabs defaultValue="overview" className="space-y-4">
|
||||
<Tabs defaultValue="overview">
|
||||
<TabsList>
|
||||
<TabsTrigger value="overview">Overview</TabsTrigger>
|
||||
<TabsTrigger value="vulnerabilities">Vulnerabilities</TabsTrigger>
|
||||
@ -72,74 +78,17 @@ export default function Dashboard() {
|
||||
<TabsTrigger value="leaks">Data Leaks</TabsTrigger>
|
||||
</TabsList>
|
||||
|
||||
<TabsContent value="overview">
|
||||
<div className="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-4">
|
||||
<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>
|
||||
|
||||
<Card>
|
||||
<CardHeader>
|
||||
<CardTitle className="flex items-center gap-2">
|
||||
<Globe className="w-5 h-5"/>
|
||||
Network Assets
|
||||
</CardTitle>
|
||||
<CardDescription>Total assets and IP addresses</CardDescription>
|
||||
</CardHeader>
|
||||
<CardContent>
|
||||
<div className="text-3xl font-bold">{reportData.n_asset}</div>
|
||||
<div className="flex justify-between text-xs text-muted-foreground mt-1">
|
||||
<span>IPv4: {reportData.unique_ipv4}</span>
|
||||
<span>IPv6: {reportData.unique_ipv6}</span>
|
||||
</div>
|
||||
</CardContent>
|
||||
</Card>
|
||||
|
||||
<Card>
|
||||
<CardHeader>
|
||||
<CardTitle className="flex items-center gap-2">
|
||||
<Database className="w-5 h-5"/>
|
||||
Data Leaks
|
||||
</CardTitle>
|
||||
<CardDescription>Unresolved data leak incidents</CardDescription>
|
||||
</CardHeader>
|
||||
<CardContent>
|
||||
<div
|
||||
className="text-3xl font-bold">{reportData.n_dataleak.unresolved.potential_stealer}</div>
|
||||
<div className="text-xs text-muted-foreground mt-1">
|
||||
Including {reportData.n_dataleak.unresolved.domain_stealer} domain stealer
|
||||
and {reportData.n_dataleak.unresolved.other_stealer} other leaks
|
||||
</div>
|
||||
</CardContent>
|
||||
</Card>
|
||||
<TabsContent value="overview" className="space-y-6">
|
||||
<div>
|
||||
<h3 className="text-xl">Overview</h3>
|
||||
</div>
|
||||
|
||||
<div className="grid grid-cols-1 md:grid-cols-2 gap-4 mt-6">
|
||||
<PortExposureAnalysis reportData={reportData}/>
|
||||
|
||||
<NumberOfVulnerabilitiesPieChart reportData={reportData}/>
|
||||
<div className="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-4">
|
||||
<OverviewNetworkAssetsCard reportData={reportData}/>
|
||||
<OverviewVulnerabilityScoreCard reportData={reportData}/>
|
||||
<OverviewSimilarDomainsCard reportData={reportData} />
|
||||
<OverviewEmailSecurityCard reportData={reportData}/>
|
||||
<OverviewCertificatesCard reportData={reportData}/>
|
||||
<OverviewDataLeaksCard reportData={reportData}/>
|
||||
</div>
|
||||
|
||||
<div className="grid grid-cols-1 gap-4 mt-6">
|
||||
@ -172,33 +121,66 @@ export default function Dashboard() {
|
||||
</CardContent>
|
||||
</Tabs>
|
||||
</Card>
|
||||
<div className="flex items-center justify-center gap-4 mt-6">
|
||||
<Button
|
||||
onClick={handlePrevPage}
|
||||
disabled={currentPage === 0}
|
||||
variant="outline"
|
||||
className="flex items-center gap-2"
|
||||
>
|
||||
<ChevronLeft className="w-4 h-4"/>
|
||||
Previous
|
||||
</Button>
|
||||
</TabsContent>
|
||||
|
||||
<div className="text-sm text-muted-foreground">
|
||||
Page {currentPage + 1} of {securitySummaryResponse?.results.length}
|
||||
</div>
|
||||
<TabsContent value="services">
|
||||
<div>
|
||||
<h3 className="text-xl">Data Leaks Details</h3>
|
||||
</div>
|
||||
<div className="grid grid-cols-1 md:grid-cols-2 gap-4 mt-6">
|
||||
<ServicesPortExposureCard reportData={reportData}/>
|
||||
<ServicesWafCard reportData={reportData} />
|
||||
<ServicesCdnCard reportData={reportData} />
|
||||
</div>
|
||||
</TabsContent>
|
||||
|
||||
<Button
|
||||
onClick={handleNextPage}
|
||||
disabled={!securitySummaryResponse || currentPage === securitySummaryResponse.results.length - 1}
|
||||
variant="outline"
|
||||
className="flex items-center gap-2"
|
||||
>
|
||||
Next
|
||||
<ChevronRight className="w-4 h-4"/>
|
||||
</Button>
|
||||
|
||||
<TabsContent value="vulnerabilities">
|
||||
<div>
|
||||
<h3 className="text-xl">Data Leaks Details</h3>
|
||||
</div>
|
||||
<div className="grid grid-cols-1 md:grid-cols-2 gap-4 mt-6">
|
||||
<VulnerabilitiesActiveCard reportData={reportData}/>
|
||||
<VulnerabilitiesPassiveCard reportData={reportData}/>
|
||||
</div>
|
||||
</TabsContent>
|
||||
|
||||
<TabsContent value="leaks" className="space-y-6">
|
||||
<div>
|
||||
<h3 className="text-xl">Data Leaks Details</h3>
|
||||
</div>
|
||||
<div className="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-4">
|
||||
<LeaksEnumerationCard reportData={reportData} />
|
||||
<LeaksResolvedCard reportData={reportData} />
|
||||
<LeaksUnresolvedCard reportData={reportData} />
|
||||
</div>
|
||||
</TabsContent>
|
||||
</Tabs>
|
||||
<div className="flex items-center justify-center gap-4 mt-6">
|
||||
<Button
|
||||
onClick={handlePrevPage}
|
||||
disabled={currentPage === 0}
|
||||
variant="outline"
|
||||
className="flex items-center gap-2"
|
||||
>
|
||||
<ChevronLeft className="w-4 h-4"/>
|
||||
Previous
|
||||
</Button>
|
||||
|
||||
<div className="text-sm text-muted-foreground">
|
||||
Page {currentPage + 1} of {securitySummaryResponse?.results.length}
|
||||
</div>
|
||||
|
||||
<Button
|
||||
onClick={handleNextPage}
|
||||
disabled={!securitySummaryResponse || currentPage === securitySummaryResponse.results.length - 1}
|
||||
variant="outline"
|
||||
className="flex items-center gap-2"
|
||||
>
|
||||
Next
|
||||
<ChevronRight className="w-4 h-4"/>
|
||||
</Button>
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
};
|
||||
|
||||
Reference in New Issue
Block a user