"use strict";
exports.id = 2353;
exports.ids = [2353];
exports.modules = {

/***/ 579851:
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {

/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */   "E": () => (/* binding */ LOGIN_STYLE)
/* harmony export */ });
const LOGIN_STYLE = {
    maxWidth: "400px",
    margin: "auto",
    border: "1px solid lightgrey",
    borderRadius: "5px",
    padding: "10px 20px 20px 20px",
    backgroundColor: "#fafafa",
    fontSize: "12pt",
    color: "#606060"
};


/***/ }),

/***/ 310017:
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {

/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */   "ZP": () => (/* binding */ SSO),
/* harmony export */   "xq": () => (/* binding */ StrategyAvatar)
/* harmony export */ });
/* unused harmony export getLink */
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(920997);
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__);
/* harmony import */ var antd__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(545725);
/* harmony import */ var antd__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(antd__WEBPACK_IMPORTED_MODULE_1__);
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(616689);
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_2__);
/* harmony import */ var _cocalc_frontend_components_icon__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(807772);
/* harmony import */ var _cocalc_frontend_components_icon__WEBPACK_IMPORTED_MODULE_3___default = /*#__PURE__*/__webpack_require__.n(_cocalc_frontend_components_icon__WEBPACK_IMPORTED_MODULE_3__);
/* harmony import */ var lib_base_path__WEBPACK_IMPORTED_MODULE_8__ = __webpack_require__(621923);
/* harmony import */ var path__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(371017);
/* harmony import */ var path__WEBPACK_IMPORTED_MODULE_4___default = /*#__PURE__*/__webpack_require__.n(path__WEBPACK_IMPORTED_MODULE_4__);
/* harmony import */ var next_router__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(371853);
/* harmony import */ var next_router__WEBPACK_IMPORTED_MODULE_5___default = /*#__PURE__*/__webpack_require__.n(next_router__WEBPACK_IMPORTED_MODULE_5__);
/* harmony import */ var lib_api_post__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(456658);
/* harmony import */ var components_share_loading__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(598278);









function getLink(strategy, target) {
    // TODO: the target is ignored by the server right now -- it's not implemented
    // and I don't know how... yet.  Code is currently in src/packages/hub/auth.ts
    return `${(0,path__WEBPACK_IMPORTED_MODULE_4__.join)(lib_base_path__WEBPACK_IMPORTED_MODULE_8__/* ["default"] */ .Z, "auth", strategy)}${target ? "?target=" + encodeURIComponent(target) : ""}`;
}
function SSO({ strategies , size , style , header  }) {
    const { 0: strategies2 , 1: setStrategies2  } = (0,react__WEBPACK_IMPORTED_MODULE_2__.useState)(strategies);
    (0,react__WEBPACK_IMPORTED_MODULE_2__.useEffect)(()=>{
        if (strategies2 === undefined) {
            (async ()=>{
                try {
                    setStrategies2(await (0,lib_api_post__WEBPACK_IMPORTED_MODULE_6__/* ["default"] */ .Z)("/auth/sso-strategies"));
                } catch (_err) {}
            })();
        }
    }, []);
    if (strategies2 === undefined) {
        return /*#__PURE__*/ react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx(components_share_loading__WEBPACK_IMPORTED_MODULE_7__/* ["default"] */ .Z, {
            style: {
                fontSize: "16pt"
            }
        });
    }
    if (strategies2.length == 0) return /*#__PURE__*/ react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.Fragment, {});
    // The -5px is to offset the initial avatar image, since they
    // all have a left margin.
    return /*#__PURE__*/ (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div", {
        style: {
            ...style
        },
        children: [
            header,
            /*#__PURE__*/ react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx("div", {
                style: {
                    marginLeft: "-5px"
                },
                children: strategies2.map((strategy)=>/*#__PURE__*/ react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx(StrategyAvatar, {
                        strategy: strategy,
                        size: size ?? 60
                    }, strategy.name)
                )
            })
        ]
    });
};
function StrategyAvatar({ strategy , size , noLink , toolTip  }) {
    const router = (0,next_router__WEBPACK_IMPORTED_MODULE_5__.useRouter)();
    const STYLE = {
        fontSize: `${size - 2}px`,
        color: "white",
        margin: "0 2px"
    };
    const { name , display , icon , backgroundColor  } = strategy;
    let src;
    if (icon.includes("://")) {
        src = /*#__PURE__*/ react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx("img", {
            src: icon,
            style: {
                height: `${size - 2}px`,
                width: `${size - 2}px`,
                marginLeft: "2.5px"
            }
        });
    } else {
        src = /*#__PURE__*/ react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx(_cocalc_frontend_components_icon__WEBPACK_IMPORTED_MODULE_3__.Icon, {
            name: icon,
            style: {
                ...STYLE,
                backgroundColor
            }
        });
    }
    const avatar = /*#__PURE__*/ react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx(antd__WEBPACK_IMPORTED_MODULE_1__.Avatar, {
        shape: "square",
        size: size,
        src: src,
        gap: 1
    });
    return /*#__PURE__*/ react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx(antd__WEBPACK_IMPORTED_MODULE_1__.Tooltip, {
        title: /*#__PURE__*/ (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.Fragment, {
            children: [
                icon.includes("://") ? "" : /*#__PURE__*/ react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx(_cocalc_frontend_components_icon__WEBPACK_IMPORTED_MODULE_3__.Icon, {
                    name: icon,
                    style: {
                        fontSize: "14pt",
                        marginRight: "10px"
                    }
                }),
                " ",
                toolTip ?? /*#__PURE__*/ (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.Fragment, {
                    children: [
                        "Use your ",
                        display,
                        " account."
                    ]
                })
            ]
        }),
        color: backgroundColor,
        children: noLink ? avatar : /*#__PURE__*/ react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx("a", {
            href: getLink(name, (0,path__WEBPACK_IMPORTED_MODULE_4__.join)(router.basePath, router.pathname)),
            style: {
                margin: "0 2.5px",
                cursor: "pointer"
            },
            children: avatar
        })
    });
}


/***/ })

};
;