import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
import { EllipsisText, Loader, RadarChart, SecondaryButton } from "../..";
import { capitalizeFirstAlphabet } from "../../../utils";
import "./style.scss";
const PersonViewInfo = ({ age = "", sex = "", ethnicity = "", email = "", workmail = "", phone = "", workphone = "", publicIdentifier = "", isDemographicsLoading = false, isDemographicsError = false, isSkillsDomainsLoading = false, isSkillsError = false, isDomainsError = false, skillsData = [], domainsData = [], isRetrievedContact = false, isRetrievingContact = false, retrieveContact, }) => {
    return (_jsxs("div", { className: "personViewInfo--Generic", children: [_jsxs("div", { className: "personViewInfo-Contact", children: [_jsxs("span", { className: "personViewInfo-ContactContainer", children: [_jsx("h1", { children: "Contact" }), !isRetrievedContact && (_jsx(SecondaryButton, { colorVariant: "orange", text: "Retrieve", onClick: retrieveContact })), isRetrievingContact && (_jsx(Loader, { width: "24", height: "24", type: "tailSpin" }))] }), _jsxs("div", { className: "personContactInfo", children: [_jsxs("div", { children: [_jsxs("span", { children: [_jsx("span", { children: _jsx("h3", { className: "personViewInfo-Badge", children: "Work Email" }) }), _jsx("p", { className: workmail === "" ? "notAvailable" : "personContact", children: _jsx(EllipsisText, { maxWidth: "250px", children: workmail || "N/A" }) })] }), _jsxs("span", { children: [_jsx("span", { children: _jsx("h3", { className: "personViewInfo-Badge", children: "Personal Email" }) }), _jsx("p", { className: email === "" ? "notAvailable" : "personContact", children: email || "N/A" })] })] }), _jsxs("div", { children: [_jsxs("span", { children: [_jsx("span", { children: _jsx("h3", { className: "personViewInfo-Badge", children: "Work Phone" }) }), _jsx("p", { className: workphone === "" ? "notAvailable" : "personContact", children: _jsx(EllipsisText, { maxWidth: "250px", children: workphone || "N/A" }) })] }), _jsxs("span", { children: [_jsx("span", { children: _jsx("h3", { className: "personViewInfo-Badge", children: "Personal Phone" }) }), _jsx("p", { className: phone === "" ? "notAvailable" : "personContact", children: phone || "N/A" })] })] }), _jsx("div", { children: _jsxs("span", { children: [_jsx("span", { children: _jsx("h3", { className: "personViewInfo-Badge", children: "Linkedin" }) }), _jsx("a", { target: "_blank", href: `https://www.linkedin.com/in/${publicIdentifier}/`, children: `https://www.linkedin.com/in/${publicIdentifier}/` })] }) })] })] }), _jsx("div", { className: "hrLineHorizontal" }), _jsxs("div", { className: "personViewInfo-Domains", children: [isSkillsDomainsLoading ? (_jsxs("span", { className: "personViewInfo-HeadingContainer", children: [_jsx("h1", { children: "Skills" }), _jsx(Loader, { width: "24", height: "24" })] })) : (_jsx("h1", { children: "Skill" })), !isSkillsDomainsLoading &&
                        (isSkillsError || skillsData?.length === 0 ? (_jsx("div", { className: "personViewInfo-DataNA", children: "NOT AVAILABLE" })) : (_jsx(RadarChart, { inputData: skillsData })))] }), _jsx("div", { className: "hrLineHorizontal" }), _jsxs("div", { className: "personViewInfo-Skills", children: [isSkillsDomainsLoading ? (_jsxs("span", { className: "personViewInfo-HeadingContainer", children: [_jsx("h1", { children: "Domains" }), _jsx(Loader, { width: "24", height: "24" })] })) : (_jsx("h1", { children: "Domains" })), !isSkillsDomainsLoading &&
                        (isDomainsError || domainsData?.length === 0 ? (_jsx("div", { className: "personViewInfo-DataNA", children: "NOT AVAILABLE" })) : (_jsx(RadarChart, { inputData: domainsData })))] }), _jsx("div", { className: "hrLineHorizontal" }), _jsxs("div", { className: "personViewInfo-Demographics", children: [isDemographicsLoading ? (_jsxs("span", { className: "personViewInfo-HeadingContainer", children: [_jsx("h1", { children: "Demographics" }), _jsx(Loader, { width: "24", height: "24" })] })) : (_jsx("h1", { children: "Demographics" })), !isDemographicsLoading &&
                        (isDemographicsError ? (_jsx("div", { className: "personViewInfo-DataNA", children: "NOT AVAILABLE" })) : (_jsxs("div", { children: [_jsxs("span", { className: "personViewInfo-Demographics-Field", children: [_jsx("h1", { children: "Age" }), _jsx("p", { children: age || "--" })] }), _jsxs("span", { className: "personViewInfo-Demographics-Field", children: [_jsx("h1", { children: "Sex" }), _jsx("p", { children: capitalizeFirstAlphabet(sex) || "--" })] }), _jsxs("span", { className: "personViewInfo-Demographics-Field", children: [_jsx("h1", { children: "Ethnicity" }), _jsx("p", { children: ethnicity || "--" })] })] })))] })] }));
};
export default PersonViewInfo;
