Init commit

Signed-off-by: Andrea Pavone <info@andreapavone.com>

resources/js/Components/DashboardHeader.tsx

@@ -0,0 +1,65 @@
+import {SecuritySummaryReportResultType} from "@/types/security-summary";
+import {Card, CardContent, CardHeader, CardTitle} from "@/Components/ui/card";
+import {Check, Copy, ShieldAlert} from "lucide-react";
+import {Button} from "@/Components/ui/button";
+import React from "react";
+import {useClipboard} from "use-clipboard-copy";
+
+export default function DashboardHeader({ reportData }: { reportData: SecuritySummaryReportResultType }) {
+
+    const [isCopied, setIsCopied] = React.useState(false);
+    const clipboard = useClipboard();
+
+
+    const handleCopy = () => {
+        clipboard.copy(reportData.idsummary)
+        setIsCopied(true)
+        setTimeout(() => setIsCopied(false), 2000)
+    }
+
+    return (
+        <Card className="mb-6">
+            <CardHeader>
+                <div className="flex justify-between items-center">
+                    <CardTitle className="text-2xl">Security report for: {reportData.domain_name}</CardTitle>
+                    <div className="flex items-center gap-2">
+                        <ShieldAlert
+                            className={`w-6 h-6 ${parseInt(reportData.risk_score) > 75 ? 'text-red-500' : 'text-yellow-500'}`}/>
+                        <span className="text-xl font-bold">Risk Score: {reportData.risk_score}/100</span>
+                    </div>
+                </div>
+                <div className="flex sm:flex-row flex-col sm:items-center gap-2 text-gray-500">
+                    <span className="flex flex-row gap-1">
+                        <span className="font-bold mr-2">Scan ID:</span>
+                        <pre className="px-2 bg-muted rounded-md">
+                            <code className="text-sm whitespace-nowrap">{reportData.idsummary}</code>
+                        </pre>
+                        <Button
+                            variant="outline"
+                            size="sm"
+                            className="h-8 w-8 p-0"
+                            onClick={handleCopy}
+                            aria-label={isCopied ? "Copied" : "Copy to clipboard"}
+                        >
+                            {isCopied ? (
+                                <Check className="w-4 h-4 text-green-500"/>
+                            ) : (
+                                <Copy className="w-4 h-4"/>
+                            )}
+                        </Button>
+                    </span>
+                </div>
+                <div className="flex sm:flex-row flex-col sm:items-center gap-2 text-gray-500">
+                    <span>
+                        <span className="font-bold mr-2">Scan Date:</span>
+                        <span>{reportData.creation_date}</span>
+                    </span>
+                    <span>
+                        <span className="font-bold mr-2">Last Edit:</span>
+                        <span>{reportData.last_edit}</span>
+                    </span>
+                </div>
+            </CardHeader>
+        </Card>
+    )
+}