import React, {useContext,} from "react";
import AuthContext from "../../context/auth-context";
import NewsArticleSlider from "../UI/NewsArticleSlider/NewsArticleSlider";
import DuaAppsBanner from "../../assets/images/DuaAppsBanner.png";
import "./application-box.scss"
import ApplicationBox from "./ApplicatioBox";

interface ApplicationsProps {
}

const newsArticle = {
    image: DuaAppsBanner,
    title: "Εφαρμογές DUA",
    subtitle: "Εφαρμογές & Υπηρεσίες για όλους εμάς",
    content: "Ενημερωθείτε για τις παρεχόμενες εφαρμογές και υπηρεσίες της D.U.A. Platform - All In One Go",
    btnLabel: "Θέλω να ενημερωθώ",
    btnUrl: 'https://egov.demokritos.gr/dua-apps/'
}


const Applications: React.FC<ApplicationsProps> = () => {
    const {currentUser} = useContext(AuthContext);
    const workRelationId = currentUser?.work_relation_id;
    const uniqueMicroservices = Object.keys(currentUser!.microservice_permissions);

    const hasVisibleModules = (ms: string): boolean => {
        return currentUser!.roles.some(role => {
            const role_per = currentUser!.permissions[role];
            if (!role_per) return false;

            return Object.entries(role_per).some(([permission, moduleObject]) => {
                const [micro_service, module] = permission.split('.');
                if (micro_service !== ms) return false;

                // Mirror the exclusion rules from Application.tsx
                if (
                    (micro_service === "difo" && workRelationId === 1 && module === "personal_folder") ||
                    (micro_service === "difo" && workRelationId === 1 && role === 'dua_user' && module === "alfa_ena") ||
                    (micro_service === "hr_support" && workRelationId === 2 && module === "personal_folder")
                ) return false;

                // @ts-ignore
                if (!moduleObject.permissions.includes("list")) return false;

                return true;
            });
        });
    };


    return (
        <div id={'allApplications'}>

            <NewsArticleSlider
                theme={`application`}
                image={newsArticle.image}
                title={newsArticle.title}
                subtitle={newsArticle.subtitle}
                content={newsArticle.content}
                btnLabel={newsArticle.btnLabel}
                btnUrl={newsArticle.btnUrl}
            />

            <section className="row gy-4 apps-wrapper">
                {
                    uniqueMicroservices
                        .filter(ms => ms !== 'settings')
                        .filter(ms => hasVisibleModules(ms))  // 👈 new filter
                        .map((ms) => (
                            <div key={ms} className='col-clg-6 col-cxxl-4'>
                                <ApplicationBox ms={ms} />
                            </div>
                        ))
                }
            </section>
        </div>
    );
};

export default Applications;