import { jsx as _jsx, Fragment as _Fragment } from "react/jsx-runtime";
import { Col, Row, Tooltip } from "antd";
import { useBadges } from "../hooks/useBadges";
export const badgeIcons = {
    ["daoVotedProposal"]: 1,
    ["daoCreated"]: 2,
    ["daoCreatedProposal"]: 3,
    ["daoJoinedCount"]: 4,
    ["staked"]: 5,
    ["folderCreated"]: 6,
    ["tickerCreated"]: 7,
    ["accountCreated"]: 8,
    ["qualityInvitee"]: 9,
};
const renderBadgeWidget = (badges, className, badgeLimit) => {
    return (_jsx(Row, { gutter: [10, 10], justify: "center", children: badges?.map((badge, index) => {
            if (badgeLimit && badgeLimit <= index) {
                return;
            }
            return (_jsx(Tooltip, { trigger: "hover", title: badge?.title, children: _jsx(Col, { children: _jsx("img", { src: `/badges/${badgeIcons[badge.name]}.png`, className: `nl-badge-widget  ${className}` }) }) }, badge?.id));
        }) }));
};
const BadgeWidget = ({ user, className, badges, badgeLimit }) => {
    if (badges) {
        return renderBadgeWidget(badges, className, badgeLimit);
    }
    else {
        const { badges, isBadgesLoading, badgesError } = useBadges(user?.id || "");
        return _jsx(_Fragment, { children: badges && !isBadgesLoading && !badgesError && renderBadgeWidget(badges, className, badgeLimit) });
    }
};
export default BadgeWidget;
//# sourceMappingURL=BadgeWidget.js.map