// ECO-PANNEAU.FR - _react/riverains/_riverains_modals.jsx

// 1. - MODALE : LECTEUR PDF (ARRÊTÉS)
window.pano_RiverainPdfModal = ({ targetId, panneau, onClose, onOpenArretes, isPreview = false }) => {
    const { UniversalViewer } = window.pano_getComponents();

    let numPages = 1;
    if (panneau.pdfId === targetId) {
        numPages = panneau.pdfNumPages || 1;
    } else if (panneau.modificatifs) {
        const mod = panneau.modificatifs.find(m => m.id === targetId);
        if (mod) numPages = mod.numPages || 1;
    }

    const handleClose = () => {
        onClose();
        if (panneau.modificatifs?.length > 0) setTimeout(onOpenArretes, 50);
    };

    if (!UniversalViewer) return null;

    return (
        <UniversalViewer 
            fileId={targetId} 
            fileType="pdf" 
            fileName="Arrêté d'urbanisme" 
            numPages={numPages} 
            positionClass={isPreview ? "absolute" : "fixed"} 
            useSafePdfMode={true} 
            onClose={handleClose} 
        />
    );
};

// 2. - MODALE : APERÇU D'IMAGE DU PROJET
window.pano_RiverainImageModal = ({ displayImageUrl, onClose, isPreview = false }) => {
    const { UniversalViewer } = window.pano_getComponents();
    if (!UniversalViewer) return null;
    
    return (
        <UniversalViewer 
            fileUrl={displayImageUrl} 
            fileType="image" 
            fileName="Aperçu du projet" 
            positionClass={isPreview ? "absolute" : "fixed"} 
            onClose={onClose} 
        />
    );
};

// 3. - MODALE : LISTE DES ARRÊTÉS (INITIAL ET MODIFICATIFS)
window.pano_RiverainArretesModal = ({ panneau, onClose, onOpenPdf, isPreview = false }) => {
    const { FileDigitIcon, ArrowRightIcon, AlertTriangleIcon } = window.pano_getIcons();
    const { Modal, Button } = window.pano_getComponents();

    return (
        <Modal 
            title="Documents d'urbanisme" 
            onClose={onClose} 
            positionClass={isPreview ? "absolute" : "fixed"} 
            maxWidth="max-w-[320px]"
            actions={(close) => (
                <Button variant="secondary" onClick={close} className="w-full py-3 justify-center text-sm shadow-sm">
                    Fermer
                </Button>
            )}
        >
            <div className="space-y-3 pb-2">
                {/* 3.1 - Arrêté Initial */}
                {panneau.pdfId ? (
                    <div role="button" tabIndex={0} onClick={() => { onClose(); setTimeout(() => onOpenPdf(panneau.pdfId), 50); }} className="w-full p-3 bg-slate-50 hover:bg-emerald-50 border border-slate-200 rounded-2xl flex items-center justify-between group transition text-left cursor-pointer">
                        <div className="flex items-center gap-3 min-w-0">
                            <div className="w-10 h-10 rounded-xl bg-emerald-100 text-emerald-600 flex items-center justify-center shrink-0"><FileDigitIcon size={20}/></div>
                            <div className="min-w-0">
                                <p className="font-black text-slate-800 text-xs break-words leading-tight">Arrêté initial</p>
                                <p className="text-[9px] text-slate-500 font-bold uppercase break-words leading-tight mt-0.5">Document principal</p>
                            </div>
                        </div>
                        <ArrowRightIcon size={16} className="text-slate-300 group-hover:text-emerald-500 transition-transform group-hover:translate-x-1 shrink-0" />
                    </div>
                ) : (
                    <div className="w-full p-3 bg-slate-50 border border-slate-200 rounded-2xl flex items-center justify-between opacity-60 cursor-not-allowed">
                        <div className="flex items-center gap-3 min-w-0">
                            <div className="w-10 h-10 rounded-xl bg-slate-200 text-slate-500 flex items-center justify-center shrink-0"><AlertTriangleIcon size={20}/></div>
                            <div className="min-w-0">
                                <p className="font-black text-slate-800 text-xs break-words leading-tight">Arrêté initial</p>
                                <p className="text-[9px] text-slate-500 font-bold uppercase break-words leading-tight mt-0.5">Document manquant</p>
                            </div>
                        </div>
                    </div>
                )}

                {/* 3.2 - Arrêtés Modificatifs */}
                {panneau.modificatifs?.map((mod, idx) => {
                    const hasPdf = mod.id && !mod.id.startsWith('mod_');
                    
                    return (
                        <div 
                            role="button" 
                            tabIndex={0} 
                            key={idx} 
                            onClick={() => { if(hasPdf) { onClose(); setTimeout(() => onOpenPdf(mod.id), 50); } }} 
                            className={`w-full p-3 border border-slate-200 rounded-2xl flex items-center justify-between transition text-left ${hasPdf ? 'bg-slate-50 hover:bg-blue-50 cursor-pointer group' : 'bg-slate-50 opacity-60 cursor-not-allowed'}`}
                        >
                            <div className="flex items-center gap-3 min-w-0">
                                <div className={`w-10 h-10 rounded-xl flex items-center justify-center shrink-0 ${hasPdf ? 'bg-blue-100 text-blue-600' : 'bg-slate-200 text-slate-500'}`}>
                                    {hasPdf ? <FileDigitIcon size={20}/> : <AlertTriangleIcon size={20}/>}
                                </div>
                                <div className="min-w-0">
                                    <p className="font-black text-slate-800 text-xs break-words leading-tight">{mod.label || `Modificatif n°${idx + 1}`}</p>
                                    <p className="text-[9px] text-slate-500 font-bold uppercase break-words leading-tight mt-0.5">
                                        {mod.date ? `Ajouté le ${new Date(mod.date).toLocaleDateString('fr-FR')}` : 'Date non définie'}
                                    </p>
                                </div>
                            </div>
                            {hasPdf ? (
                                <ArrowRightIcon size={16} className="text-slate-300 group-hover:text-blue-500 transition-transform group-hover:translate-x-1 shrink-0" />
                            ) : (
                                <span className="text-[9px] font-bold text-slate-400 text-right leading-tight shrink-0 pl-2">PDF<br/>manquant</span>
                            )}
                        </div>
                    );
                })}
            </div>
        </Modal>
    );
};

// 4. - MODALE : AVERTISSEMENT DE MODE DÉMO (ZÉRO-TRUST)
window.pano_RiverainDemoWarningModal = ({ targetId, onClose, isPreview = false }) => {
    const { InfoIcon } = window.pano_getIcons();
    const { Button, Modal } = window.pano_getComponents();

    return (
        <Modal 
            title="Mode aperçu" 
            type="info" 
            onClose={onClose} 
            positionClass={isPreview ? "absolute" : "fixed"} 
            maxWidth="max-w-[320px]"
            actions={(close) => (
                <Button variant="primary" onClick={close} className="w-full py-3 justify-center text-sm uppercase tracking-widest shadow-md">OK</Button>
            )}
        >
            <div className="space-y-4 text-center pb-2">
                <InfoIcon size={32} className="text-blue-600 mx-auto" />
                <p className="text-sm text-slate-600 font-medium leading-relaxed break-words">
                    {targetId === 'chat' 
                        ? "La messagerie (messages et pièces jointes) est désactivée en mode aperçu ou démo." 
                        : "Les liens sortants sont désactivés en mode aperçu ou démo."}
                </p>
            </div>
        </Modal>
    );
};

/* EOF ========== [_react/riverains/_riverains_modals.jsx] */