import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
import "./style.scss";
import { ClickableText, GetSvgIcon, Loader, RectangularIcon } from "..";
import { useEffect, useRef, useState } from "react";
const getStatusIcon = (evalStatus) => {
    switch (evalStatus) {
        case "verified":
            return (_jsx("div", { className: "verified", children: _jsx(GetSvgIcon, { iconType: "tickVerification", iconSize: "10" }) }));
        case "unverified":
            return (_jsx("div", { className: "unverified", children: _jsx(GetSvgIcon, { iconType: "cross", iconSize: "16" }) }));
        case "partiallyVerified":
            return (_jsx("div", { className: "partiallyVerified", children: _jsx(GetSvgIcon, { iconType: "exclamation", iconSize: "14" }) }));
        case "notEnoughData":
            return (_jsx("div", { className: "notEnoughData", children: _jsx(GetSvgIcon, { iconType: "questionMark", iconSize: "10" }) }));
        case "loading":
            return (_jsx("div", { className: "loading", children: _jsx(Loader, { height: "24", width: "24" }) }));
        default:
            return null;
    }
};
const getStatusText = (evalStatus) => {
    switch (evalStatus) {
        case "verified":
            return "Verified";
        case "unverified":
            return "Unverified";
        case "partiallyVerified":
            return "Partially Verified";
        case "notEnoughData":
            return "Data not found";
        case "loading":
            return "Verifying";
        default:
            return null;
    }
};
const CompanyDetailsCard = ({ company, descriptionCollapseCount = 250, viewMore, intialHeight = "calc(100% - 84px)", dataCy, }) => {
    const topSectionRef = useRef(null);
    const [bodySectionHeight, setBodySectionHeight] = useState(intialHeight);
    const [descriptionCollapse, setDescriptionCollapse] = useState(company?.description?.length > descriptionCollapseCount);
    let headquarter;
    if (company.headquarter) {
        headquarter =
            `${company.headquarter.city || ""}${company.headquarter.city && company.headquarter.country ? ", " : ""}${company.headquarter.country || ""}` || "Not Available";
    }
    else {
        headquarter = "Not Available";
    }
    useEffect(() => {
        if (topSectionRef.current) {
            const topSectionHeight = topSectionRef.current.clientHeight;
            setBodySectionHeight(`calc(100% - ${topSectionHeight}px)`);
        }
    }, [topSectionRef.current, company]);
    return (_jsxs("div", { className: "CompanyDetailsCard", children: [_jsx("div", { className: "TopSection", ref: topSectionRef, children: _jsxs("div", { className: "logo", children: [_jsx("div", { className: "icon", children: _jsx(RectangularIcon, { iconPath: company.logo, iconSize: "72", altImageType: "company", placeholderSize: 44, placeholderPadding: 14, companyName: company.name }) }), _jsxs("div", { className: "comapnyNameAndCount", children: [_jsx("p", { className: "CompanyName", children: company.name }), company.staffcount && (_jsx("p", { className: "EmployeeCount", children: (company.industries ? company.industries : "") +
                                        (company.industries && company.staffcount ? " • " : "") +
                                        (company.staffcount
                                            ? `${company?.staffcount?.toLocaleString()} Employees`
                                            : "-") })), _jsx(ClickableText, { onClick: viewMore, sizeVariant: "sm", text: "View more details", dataCy: `${dataCy}-view-more-details` })] })] }) }), company.evaluationStatus && (_jsxs("div", { className: "evaluatedDescription", children: [_jsxs("div", { className: `${company.evaluationStatus} verificationStatus`, children: [getStatusIcon(company.evaluationStatus), company.evaluationStatus !== "loading" ? (_jsx("p", { children: getStatusText(company.evaluationStatus) })) : (_jsx("p", { children: "Verifying" }))] }), company.evaluating ? (_jsxs("div", { className: "textShimmer", children: [_jsx("p", {}), _jsx("p", {}), _jsx("p", {})] })) : (company.evaluatedDescription &&
                        company.evaluatedDescription.length > 0 && (_jsxs("p", { className: "evaluatedData", children: [_jsx(GetSvgIcon, { iconType: "sparkles", iconSize: "20" }), company.evaluatedDescription
                                ? company.evaluatedDescription
                                : " "] })))] })), _jsxs("div", { className: "BodySection", style: { height: bodySectionHeight }, children: [_jsx("pre", { className: `CompanyDescription ${descriptionCollapse ? "CompanyDescriptionExpanded" : ""}`, contentEditable: "false", children: descriptionCollapse
                            ? company?.description?.slice(0, descriptionCollapseCount) + "..."
                            : company?.description || "" }), company?.description?.length > descriptionCollapseCount && (_jsx(ClickableText, { iconSize: "22", showIcon: true, iconType: descriptionCollapse ? "cheveronDown" : "cheveronUp", sizeVariant: "sm", text: descriptionCollapse ? "Show More" : `Show Less`, onClick: () => {
                            setDescriptionCollapse((prev) => !prev);
                        }, dataCy: `${dataCy}-show-more-less` })), _jsxs("div", { className: "BottomSection", children: [_jsxs("div", { children: [_jsx("p", { className: "label", children: "Industry" }), _jsx("p", { className: "value", children: company?.industries || "" })] }), _jsxs("div", { children: [_jsx("p", { className: "label", children: "Sub-Industries" }), _jsx("p", { className: "value", children: Array.isArray(company?.specialities)
                                            ? company.specialities.join(", ")
                                            : "" })] }), _jsxs("div", { children: [_jsx("p", { className: "label", children: "Company Size" }), _jsx("p", { className: "value", children: company?.staffcount?.toLocaleString() || "" })] }), _jsxs("div", { children: [_jsx("p", { className: "label", children: "Website" }), _jsx("p", { onClick: () => window.open(company?.websiteUrl, "_blank"), className: "value link", children: company?.websiteUrl || "" })] }), _jsxs("div", { children: [_jsx("p", { className: "label", children: "Headquarters" }), _jsx("p", { className: "value", children: headquarter })] })] })] })] }));
};
export default CompanyDetailsCard;
