import React, { useEffect, useState } from 'react';
import axios from 'axios';
import {
    SecuritySummaryResponseType,
} from '@/types/security-summary';
import { TextSearchIcon } from 'lucide-react';
import {
    Table,
    TableBody,
    TableCell,
    TableHead,
    TableHeader,
    TableRow,
} from "@/Components/ui/table"
import FileUpload from "@/Components/FileUpload";
import {Card, CardContent, CardDescription, CardFooter, CardHeader, CardTitle} from "@/Components/ui/card";

type ParsedFile = {
    url: string,
    username: string,
    password: string,
    application: string,
}

export default function Home() {
    const [securitySummaryResponse, setSecuritySummaryResponse] = useState<SecuritySummaryResponseType | null>(null);

    const [parsedFile, setParsedFile] = useState<null| ParsedFile[]>(null);

    useEffect(() => {
        axios.get<SecuritySummaryResponseType>('/api/v1/security/summary')
            .then(response => {
                setSecuritySummaryResponse(response.data);
            })
            .catch(error => {
                console.error("Error fetching the report data", error);
            });
    }, []);

    const handleFileUpload = async (file: File) => {
        // Gestisci il file qui
        // Esempio: invia il file al server
        const formData = new FormData();
        formData.append('file', file);

        try {
            const response = await axios.post('/api/v1/parse/stealer', formData, {
                headers: {
                    'Content-Type': 'multipart/form-data'
                }
            });
            if(response.data.status === 'success'){
                setParsedFile(response.data.data);
                console.log('data', response.data.data);
            }

        } catch (error) {
            console.error('Upload failed:', error);
        }
    };



    return (
        <div className="container mx-auto p-4 space-y-6">
            <Card>
                <CardHeader>
                    <CardTitle className="text-3xl">Scan Reports</CardTitle>
                    <CardDescription>Pick a scan to see the dashboard, you can also navigate trough dashboard using prev and next arrow at the end of each report overview</CardDescription>
                </CardHeader>
                <CardContent>
                    <Table>
                        <TableHeader>
                            <TableRow>
                                <TableHead>Domain</TableHead>
                                <TableHead>UUID</TableHead>
                                <TableHead>Method</TableHead>
                                <TableHead>Score</TableHead>
                                <TableHead></TableHead>
                            </TableRow>
                        </TableHeader>
                        <TableBody>
                            {securitySummaryResponse?.results.map((data, index) => (
                                <TableRow key={index}>
                                    <TableCell className="font-medium">
                                        <a href={`/report/${index}/dashboard`}>{data.domain_name}</a>
                                    </TableCell>
                                    <TableCell>{data.idsummary}</TableCell>
                                    <TableCell>{data.creation_date}</TableCell>
                                    <TableCell>{data.risk_score}</TableCell>
                                    <TableCell>
                                        <a href={`/report/${index}/dashboard`}>
                                            <TextSearchIcon className="w-5 h-5"/>
                                        </a>
                                    </TableCell>
                                </TableRow>

                            ))}
                        </TableBody>
                    </Table>
                </CardContent>
            </Card>

            <Card>
                <CardHeader>
                    <CardTitle className="text-3xl">Upload Password Leak</CardTitle>
                    <CardDescription></CardDescription>
                </CardHeader>
                <CardContent>
                    <FileUpload

                        onFileUpload={handleFileUpload}
                    />

                    <h3 className="text-2xl mt-6">Parse Output</h3>

                    <Table>
                        <TableHeader>
                            <TableRow>
                                <TableHead>Application</TableHead>
                                <TableHead>URL</TableHead>
                                <TableHead>Username</TableHead>
                                <TableHead>Password</TableHead>
                            </TableRow>
                        </TableHeader>
                        <TableBody>
                            {parsedFile?.map((value, index) => (
                                <TableRow key={index}>
                                    <TableCell>{value.application}</TableCell>
                                    <TableCell>{value.url}</TableCell>
                                    <TableCell>{value.username}</TableCell>
                                    <TableCell>{value.password}</TableCell>
                                </TableRow>

                            ))}
                        </TableBody>
                    </Table>
                </CardContent>
            </Card>
        </div>
    );
};