import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
import { Divider } from "../../divider";
import { useMemo } from "react";
import { NetworkStatus } from "./networkStatus";
import { CommunityDiscord, CommunityX, CommunityTG } from "./communityIcon";
import { OrderlyLogo } from "./orderlyLogo";
import React from "react";
export const SystemStatusBar = (props)=>{
    const { xUrl, telegramUrl, discordUrl, commutitylist, powerBy = /*#__PURE__*/ _jsx(OrderlyLogo, {}) } = props;
    const children = useMemo(()=>{
        if (commutitylist !== undefined) {
            return commutitylist;
        }
        const children = [];
        if (telegramUrl !== undefined) {
            children.push(/*#__PURE__*/ _jsx("button", {
                onClick: ()=>{
                    window.open(telegramUrl, "_blank");
                },
                children: /*#__PURE__*/ _jsx(CommunityTG, {})
            }));
        }
        if (discordUrl !== undefined) {
            children.push(/*#__PURE__*/ _jsx("button", {
                onClick: ()=>{
                    window.open(discordUrl, "_blank");
                },
                children: /*#__PURE__*/ _jsx(CommunityDiscord, {})
            }));
        }
        if (xUrl !== undefined) {
            children.push(/*#__PURE__*/ _jsx("button", {
                onClick: ()=>{
                    window.open(xUrl, "_blank");
                },
                children: /*#__PURE__*/ _jsx(CommunityX, {})
            }));
        }
        return children;
    }, [
        xUrl,
        telegramUrl,
        discordUrl,
        commutitylist
    ]);
    return /*#__PURE__*/ _jsxs(_Fragment, {
        children: [
            /*#__PURE__*/ _jsxs("div", {
                id: "orderly-bottom-navigation-bar",
                className: "orderly-flex orderly-items-center",
                children: [
                    /*#__PURE__*/ _jsx(NetworkStatus, {}),
                    /*#__PURE__*/ _jsx("div", {
                        className: "orderly-pl-2",
                        children: /*#__PURE__*/ _jsx(Divider, {
                            vertical: true
                        })
                    }),
                    /*#__PURE__*/ _jsx("span", {
                        className: "orderly-text-base-contrast-54 orderly-text-4xs orderly-font-semibold orderly-pr-2",
                        children: "Join our community"
                    }),
                    children.map((item)=>item)
                ]
            }),
            /*#__PURE__*/ _jsxs("div", {
                className: "orderly-flex orderly-items-center",
                children: [
                    /*#__PURE__*/ _jsx("span", {
                        className: "orderly-text-base-contrast-54 orderly-text-4xs orderly-font-semibold orderly-pr-2 orderly-justify-end",
                        children: "Powered by"
                    }),
                    powerBy
                ]
            })
        ]
    });
};

//# sourceMappingURL=systemStatusBar.js.map