import SubmissionItem from "./SubmissionItem";
import { SecondaryButton } from "../../../components/button/SecondaryButton";
import { useAppDispatch, useAppSelector } from "../../../redux/hooks";
import { FC, useEffect } from "react";
import { setMenuActivePage } from "../../../redux/slices/store";
import { useNavigate } from "react-router-dom";
import { fetchMissions } from "../../../redux/slices/missions";


export interface Mission {
    id: number;
    authorId: number;
    name: string;
    difficulty: "Easy" | "Medium" | "Hard";
    tags: string[];
    timeLimit: number;
    memoryLimit: number;
    createdAt: string;
    updatedAt: string;
}

interface MissionSubmissionsProps{
    missionId: number;
}

const MissionSubmissions: FC<MissionSubmissionsProps> = ({missionId}) => {
    const submissions = useAppSelector((state) => state.submin.submitsById[missionId]);

    useEffect(() => {

    }, []);


    const checkStatus = (status: string) => {
        if (status == "IncorrectAnswer")
            return "wronganswer";
        if (status == "TimeLimitError")
            return "timelimit";
        return undefined;
    }

    return (
        <div className="h-full w-full box-border overflow-y-scroll  overflow-x-hidden thin-scrollbar pr-[10px]">


                {submissions && submissions.map((v, i) => (
                    <SubmissionItem 
                    key={i}  
                    id={v.id}
                    language={v.solution.language}
                    time={v.solution.time}
                    verdict={v.solution.testerMessage?.includes("Compilation failed") ? "Compilation failed" : v.solution.testerMessage}
                    type={i % 2 ? "second" : "first"}
                    status={v.solution.testerMessage == "All tests passed" ? "success" : checkStatus(v.solution.testerErrorCode)}
                    />
                ))}
        </div>
    );
};

export default MissionSubmissions;