import React from "react";
import { Button, FormLabel } from "@carbon/react";
import { Enterprise } from "@carbon/react/icons";
import C3NavigationSideBar from "./c3-navigation-sidebar";
import { SwitcherDivider } from "./components";
import { useOrgSidebarState } from "./c3-sidebar-state-provider";
import { useC3Profile } from "../../c3-user-configuration/c3-profile-provider/c3-profile-provider";
import { useC3UserConfiguration } from "../../c3-user-configuration/c3-user-configuration-provider";
const C3OrgSidebar = ({ sideBar }) => {
    const { customElements, switchToOrg, elements, ...sideBarProps } = sideBar;
    const { isOpen, setIsOpen } = useOrgSidebarState();
    const { decodedAudience, analyticsTrack, setActiveOrgId } = useC3UserConfiguration();
    const { activeOrg, orgs } = useC3Profile();
    const isCustomized = Boolean(customElements?.activeOrganization);
    const onManageOrg = () => {
        if (!isCustomized) {
            analyticsTrack?.("navBar:orgSettings:click", { orgId: activeOrg?.uuid });
        }
        if (sideBar.closeOnClick !== false)
            setIsOpen(false);
    };
    const activeOrganization = customElements?.activeOrganization || {
        activeLabel: "Active Organization",
        orgName: activeOrg?.name || "",
        action: {
            onClick: onManageOrg,
            label: "Manage",
        },
        otherLabel: "Other Organizations",
    };
    const switchOrg = (orgId) => {
        setActiveOrgId(orgId);
        analyticsTrack?.("navBar:orgSwitch:click", { orgId });
        switchToOrg?.(orgId);
        setIsOpen(false);
    };
    const orgElements = orgs
        ?.filter(({ uuid }) => uuid !== activeOrg?.uuid)
        .map((org) => ({
        key: org.uuid,
        label: org.name,
        onClick: () => switchOrg(org.uuid),
    }));
    const itemTabIndex = isOpen ? undefined : -1;
    return (React.createElement(C3NavigationSideBar, { sideBar: {
            ...sideBarProps,
            elements: elements || orgElements,
            ariaLabel: sideBarProps.ariaLabel || "Organization Sidebars",
        }, icon: React.createElement(Enterprise, { size: 20 }) }, (customElements?.activeOrganization || activeOrg) && (React.createElement(React.Fragment, null,
        React.createElement("div", { style: {
                padding: "1rem",
                paddingTop: "1.5rem",
                paddingBottom: ".5rem",
                display: "grid",
                gridAutoFlow: "column",
                gap: ".25rem",
            } },
            React.createElement("div", { style: {
                    overflow: "hidden",
                    display: "grid",
                    gap: "4px",
                } },
                React.createElement(FormLabel, null, activeOrganization.activeLabel),
                React.createElement("div", { className: "textPrimary", style: {
                        height: "20px", // Set minimum height to allow decenders to be rendered
                        lineHeight: "20px",
                        fontSize: "14px",
                        textOverflow: "ellipsis",
                        overflow: "hidden",
                        whiteSpace: "nowrap",
                    }, title: activeOrganization.orgName }, activeOrganization.orgName)),
            isCustomized ? (React.createElement(Button, { size: "md", kind: "ghost", onClick: () => {
                    activeOrganization.action.onClick();
                    onManageOrg();
                }, tabIndex: itemTabIndex }, activeOrganization.action?.label)) : (activeOrg?.uuid &&
                decodedAudience && (React.createElement(Button, { as: "a", size: "md", kind: "ghost", key: "org-management", href: `https://console.${decodedAudience}/org/${activeOrg?.uuid}/management`, onClick: onManageOrg, tabIndex: itemTabIndex }, activeOrganization.action?.label)))),
        sideBar.elements && sideBar.elements.length > 0 && (React.createElement(React.Fragment, null,
            React.createElement(SwitcherDivider, null),
            React.createElement(FormLabel, { style: {
                    paddingTop: ".5rem",
                    paddingLeft: "1rem",
                    paddingBottom: ".25rem",
                } }, activeOrganization.otherLabel)))))));
};
export default C3OrgSidebar;
