import React, {ReactNode, useContext, useEffect, useState} from "react";
import useSetBreadcrumbs from "../../../context/useSetBreadcrumbs";
import {useParams} from "react-router-dom";
import {RescomContract} from "../../../models/Rescom/RescomContracts";
import {getSingleContractAmendments} from "../../../API/rescom";
import PageTitle from "../../UI/Typography/PageTitle";
import CustomFormSection from "../../UI/Forms/CustomFormSection/CustomFormSection";
import CustomLabel from "../../UI/Forms/CustomLabel/CustomLabel";
import CustomTextField from "../../UI/Forms/CustomTextField/CustomTextField";
import CustomTextArea from "../../UI/Forms/CustomTextArea/CustomTextArea";
import FormButtonSave from "../../UI/Forms/FormButton/FormButtonSave";
import InputFake from "../../UI/Typography/InputFake";

import Garbage from "../../SVG/Garbage";
import HeaderControlsContext from "../../../context/headerControls-context";
import "./amendments.scss";
type SimvasiAmendmentsProps = {
    children?: ReactNode
}
type Comment = {
    id: string;
    name: string;
    date: string;
};
const SimvasiAmendments = ({children}: SimvasiAmendmentsProps) => {
    // const {id} = useParams();
    // const {showSensitive} = useContext(HeaderControlsContext)
    // const [simvasi, setSimvasi] = useState<RescomContract>();
    // const contract = {
    //     applicationNumber: "00/2025-1458",
    //     projectCode: "12593",
    //     acronym: "ICOS",
    //     amount: 5212,
    //     article_39: "NAI",
    //     vatIncluded: "NAI",
    //     hourlyRate: 15.25,
    //     duration: "6 μήνες",
    //     totalHours: 152,
    //     contract_type: 'Εργασίας',
    //     titleA1: "12593 (ICOS-212321)",
    //     staffCategory: "Senior researcher (post - doc)",
    //     wp: "ML of the potential energy surface of polymer systems at the CG level, Generation of realistic high Mw polymer configurations",
    //     subject: "Development and Application of Ion Beam Techniques for Materials Irradiation and Characterization relevant to Fusion Technology",
    //     notes: [
    //         {
    //             id: 1,
    //             author: "ΜΑΡΙΑΝΑ ΜΑΡΚΟΥΛΗ",
    //             text: "Έγινε αλλαγή στον επιστ. υπεύθυνο",
    //             date: null,
    //         },
    //         {
    //             id: 2,
    //             author: "ΜΑΡΙΑΝΑ ΜΑΡΚΟΥΛΗ",
    //             text: "Έγινε αλλαγή στον επιστ. υπεύθυνο",
    //             date: "09-02-2025",
    //         },
    //         {
    //             id: 3,
    //             author: "ΜΑΡΙΑΝΑ ΜΑΡΚΟΥΛΗ",
    //             text: "Έγινε αλλαγή στον επιστ. υπεύθυνο",
    //             date: "09-02-2025",
    //         },
    //     ],
    //     lastname: 'doe',
    //     firstname: 'john'
    // };
    //
    // const sxc = {
    //     sxolia: [
    //         {
    //             id: "CMT-001",
    //             date: "2025-09-02",
    //             name: "John Doe",
    //         },
    //         {
    //             id: "CMT-002",
    //             date: "2025-08-30",
    //             name: "Jane Smith",
    //         },
    //         {
    //             id: "CMT-003",
    //             date: "2025-08-28",
    //             name: "Alex Johnson",
    //         },
    //     ] as unknown as Comment[],
    // };
    //
    //
    // const fetchSimvasiAmendments = async () => {
    //     if (!id) return
    //     // const res = await getSingleContractAmendments(id);
    //     // setSimvasi(res.data);
    //     return
    // }
    //
    // useEffect(() => {
    //     fetchSimvasiAmendments()
    //     // eslint-disable-next-line react-hooks/exhaustive-deps
    // }, [id])
    // useSetBreadcrumbs(3, "Τροποποιήσεις Σύμβασης");
    return (
        <>
            {/*<PageTitle>Τροποποιήσεις Σύμβασης | {contract.firstname} {contract.lastname}</PageTitle>*/}
            {/*<div className="mt-5 pt-3 row amendments">*/}

            {/*    /!* Left Column (Details) *!/*/}
            {/*    <div className="amendments-left col-12 col-lg-4">*/}
            {/*        <div className={'initial'}> ΑΡΧΙΚΗ ΣΥΜΒΑΣΗ</div>*/}
            {/*        <CustomFormSection>*/}
            {/*            <div className="row">*/}
            {/*                <div className="col-4">*/}
            {/*                    <CustomLabel>*/}
            {/*                        ΑΡ. ΠΡΩΤ. ΑΙΤΗΣΗΣ ΣΥΜΒΑΣΗΣ*/}
            {/*                    </CustomLabel>*/}
            {/*                    <CustomTextField*/}
            {/*                        id={'applicationNumber'}*/}
            {/*                        readOnly={true}*/}
            {/*                        value={contract.applicationNumber ?? ''}*/}

            {/*                        onChange={(e) => {*/}
            {/*                            */}
            {/*                        }}*/}
            {/*                    />*/}
            {/*                </div>*/}
            {/*                <div className="col-4">*/}
            {/*                    <CustomLabel>*/}
            {/*                        ΚΩΔ. ΕΡΓΟΥ*/}
            {/*                    </CustomLabel>*/}
            {/*                    <CustomTextField*/}
            {/*                        id={'projectCode'}*/}
            {/*                        readOnly={true}*/}
            {/*                        value={contract.projectCode ?? ''}*/}

            {/*                        onChange={(e) => {*/}
            {/*                            */}
            {/*                        }}*/}
            {/*                    />*/}
            {/*                </div>*/}
            {/*                <div className="col-4">*/}
            {/*                    <CustomLabel>*/}
            {/*                       ΤΥΠΟΣ ΣΥΜΒΑΣΗΣ*/}
            {/*                    </CustomLabel>*/}
            {/*                    <CustomTextField*/}
            {/*                        id={'contract_type'}*/}
            {/*                        readOnly={true}*/}
            {/*                        value={contract.contract_type ?? ''}*/}

            {/*                        onChange={(e) => {*/}
            {/*                            */}
            {/*                        }}/>*/}
            {/*                    /!*<CustomLabel>*!/*/}
            {/*                    /!*    ΑΚΡΩΝΥΜΙΟ*!/*/}
            {/*                    /!*</CustomLabel>*!/*/}
            {/*                    /!*<CustomTextField*!/*/}
            {/*                    /!*    id={'acronym'}*!/*/}
            {/*                    /!*    readOnly={true}*!/*/}
            {/*                    /!*    value={contract.acronym ?? ''}*!/*/}

            {/*                    /!*    onChange={(e) => {*!/*/}
            {/*                    /!*        *!/*/}
            {/*                    /!*    }}/>*!/*/}
            {/*                </div>*/}
            {/*            </div>*/}
            {/*        </CustomFormSection>*/}
            {/*        <CustomFormSection>*/}
            {/*            <div className="row">*/}
            {/*                <div className="col-4">*/}
            {/*                    <CustomLabel>*/}
            {/*                        ΠΟΣΟ (€)*/}
            {/*                    </CustomLabel>*/}
            {/*                    <CustomTextField*/}
            {/*                        id={'amount'}*/}
            {/*                        readOnly={true}*/}
            {/*                        value={showSensitive ? (contract.amount.toString() ?? '') : '****'}*/}

            {/*                        onChange={(e) => {*/}
            {/*                            */}
            {/*                        }}*/}
            {/*                    />*/}
            {/*                </div>*/}
            {/*                <div className="col-4">*/}
            {/*                    <CustomLabel>*/}
            {/*                        ARTICLE 39*/}
            {/*                    </CustomLabel>*/}
            {/*                    <CustomTextField*/}
            {/*                        id={'article_39'}*/}
            {/*                        readOnly={true}*/}
            {/*                        value={contract.article_39 ?? ''}*/}

            {/*                        onChange={(e) => {*/}
            {/*                            */}
            {/*                        }}*/}
            {/*                    />*/}
            {/*                </div>*/}
            {/*                <div className="col-4">*/}
            {/*                    <CustomLabel>*/}
            {/*                        ΥΠΑΓΩΓΗ ΦΠΑ*/}
            {/*                    </CustomLabel>*/}
            {/*                    <CustomTextField*/}
            {/*                        id={'vatIncluded'}*/}
            {/*                        readOnly={true}*/}
            {/*                        value={contract.vatIncluded ?? ''}*/}

            {/*                        onChange={(e) => {*/}
            {/*                            */}
            {/*                        }}/>*/}
            {/*                </div>*/}
            {/*            </div>*/}
            {/*        </CustomFormSection>*/}
            {/*        <CustomFormSection>*/}
            {/*            <div className="row">*/}
            {/*                <div className="col-4">*/}
            {/*                    <CustomLabel>*/}
            {/*                        Hourly Rate*/}
            {/*                    </CustomLabel>*/}
            {/*                    <CustomTextField*/}
            {/*                        id={'hourlyRate'}*/}
            {/*                        readOnly={true}*/}
            {/*                        value={contract.hourlyRate.toString() ?? ''}*/}

            {/*                        onChange={(e) => {*/}
            {/*                            */}
            {/*                        }}*/}
            {/*                    />*/}
            {/*                </div>*/}
            {/*                <div className="col-4">*/}
            {/*                    <CustomLabel>*/}
            {/*                        ARTICLE 39*/}
            {/*                    </CustomLabel>*/}
            {/*                    <CustomTextField*/}
            {/*                        id={'article_39'}*/}
            {/*                        readOnly={true}*/}
            {/*                        value={contract.article_39 ?? ''}*/}

            {/*                        onChange={(e) => {*/}
            {/*                            */}
            {/*                        }}*/}
            {/*                    />*/}
            {/*                </div>*/}
            {/*                <div className="col-4">*/}
            {/*                    <CustomLabel>*/}
            {/*                        ΥΠΑΓΩΓΗ ΦΠΑ*/}
            {/*                    </CustomLabel>*/}
            {/*                    <CustomTextField*/}
            {/*                        id={'vatIncluded'}*/}
            {/*                        readOnly={true}*/}
            {/*                        value={contract.vatIncluded ?? ''}*/}

            {/*                        onChange={(e) => {*/}
            {/*                            */}
            {/*                        }}/>*/}
            {/*                </div>*/}
            {/*            </div>*/}
            {/*        </CustomFormSection>*/}
            {/*        <CustomFormSection>*/}
            {/*            <div className="row">*/}
            {/*                <div className="col-6">*/}
            {/*                    <CustomLabel>*/}
            {/*                        ΤΙΤΛΟΣ Α1*/}
            {/*                    </CustomLabel>*/}
            {/*                    <CustomTextField*/}
            {/*                        id={'titleA1'}*/}
            {/*                        readOnly={true}*/}
            {/*                        value={contract.titleA1.toString() ?? ''}*/}

            {/*                        onChange={(e) => {*/}
            {/*                            */}
            {/*                        }}*/}
            {/*                    />*/}
            {/*                </div>*/}
            {/*                <div className="col-6">*/}
            {/*                    <CustomLabel>*/}
            {/*                        ΚΑΤΗΓΟΡΙΑ ΠΡΟΣΩΠΙΚΟΥ*/}
            {/*                    </CustomLabel>*/}
            {/*                    <CustomTextField*/}
            {/*                        id={'staffCategory'}*/}
            {/*                        readOnly={true}*/}
            {/*                        value={contract.staffCategory ?? ''}*/}

            {/*                        onChange={(e) => {*/}
            {/*                            */}
            {/*                        }}*/}
            {/*                    />*/}
            {/*                </div>*/}
            {/*            </div>*/}
            {/*        </CustomFormSection>*/}
            {/*        <CustomFormSection>*/}
            {/*            <div className="row">*/}
            {/*                <div className="col-12">*/}
            {/*                    <CustomLabel>*/}
            {/*                        WP*/}
            {/*                    </CustomLabel>*/}
            {/*                    <CustomTextField*/}
            {/*                        id={'wp'}*/}
            {/*                        readOnly={true}*/}
            {/*                        value={contract.wp ?? ''}*/}

            {/*                        onChange={(e) => {*/}
            {/*                            */}
            {/*                        }}*/}
            {/*                    />*/}
            {/*                </div>*/}
            {/*            </div>*/}
            {/*        </CustomFormSection>*/}
            {/*        <CustomFormSection>*/}
            {/*            <div className="row g-3">*/}
            {/*                <div className="col-12">*/}
            {/*                    <CustomLabel>*/}
            {/*                        ΑΝΤΙΚΕΙΜΕΝΟ*/}
            {/*                    </CustomLabel>*/}
            {/*                    <CustomTextField*/}
            {/*                        id={'subject'}*/}
            {/*                        readOnly={true}*/}
            {/*                        value={contract.subject ?? ''}*/}

            {/*                        onChange={(e) => {*/}
            {/*                            */}
            {/*                        }}*/}
            {/*                    />*/}
            {/*                </div>*/}
            {/*            </div>*/}
            {/*        </CustomFormSection>*/}

            {/*    </div>*/}

            {/*    /!* Right Column (Notes) *!/*/}
            {/*    <div className="amendments-right col-12 col-lg-8">*/}
            {/*        <div className='rescom-projects-info-point px-5'>*/}
            {/*            <div className="sxolia-template px-5">*/}
            {/*                <div className="sidebar-header-content">*/}
            {/*                    <h3> ΣΗΜΕΙΩΣΗ {<b>| {contract.lastname + " " + contract.firstname}</b>}</h3>*/}
            {/*                </div>*/}
            {/*                <CustomFormSection theme={"light"}>*/}
            {/*                    <div className="row">*/}
            {/*                        <div className={'col-12'}>*/}
            {/*                            <CustomLabel>ΠΡΟΣΘΕΣΤΕ ΣΗΜΕΙΩΣΗ</CustomLabel>*/}
            {/*                            <CustomTextArea*/}
            {/*                                onChange={(e) => {*/}
            {/*                                    console.log(e);*/}
            {/*                                }}/>*/}
            {/*                        </div>*/}
            {/*                        <div className={'col-12 d-flex mt-3 justify-content-center'}>*/}
            {/*                            <FormButtonSave>*/}
            {/*                                ΠΡΟΣΘΗΚΗ ΣΗΜΕΙΩΣΗΣ*/}
            {/*                            </FormButtonSave>*/}
            {/*                        </div>*/}
            {/*                    </div>*/}
            {/*                </CustomFormSection>*/}
            {/*                <div className="comments-container">*/}
            {/*                    {sxc.sxolia.map((comment: Comment, index: number) => (*/}
            {/*                        <CustomFormSection key={index} theme={"blue"}>*/}
            {/*                            <CustomLabel secondaryLabel={comment.date}>*/}
            {/*                                {comment.id}*/}
            {/*                            </CustomLabel>*/}
            {/*                            <InputFake hasCopy={false}>*/}
            {/*                                {comment.name}*/}
            {/*                            </InputFake>*/}
            {/*                            <div className={'d-flex justify-content-end'}>*/}
            {/*                                <button onClick={() => {*/}
            {/*                                    deleteNote(contract.contract_id, comment.id)*/}
            {/*                                }}><Garbage/></button>*/}
            {/*                            </div>*/}

            {/*                        </CustomFormSection>*/}
            {/*                    ))}*/}
            {/*                </div>*/}
            {/*            </div>*/}

            {/*        </div>*/}
            {/*    </div>*/}

            {/*</div>*/}
        </>
    );
};


export default SimvasiAmendments;