import { jsxs as r, jsx as t } from "react/jsx-runtime";
import { Box as e, Typography as l } from "@mui/material";
import o from "../../Img/index.js";
function m({
  requestAppInfo: a,
  currentAppInfo: i
}) {
  return /* @__PURE__ */ r(
    e,
    {
      sx: {
        textAlign: "center",
        display: "flex",
        flexDirection: "column",
        alignItems: "center",
        gap: 2
      },
      children: [
        /* @__PURE__ */ r(
          e,
          {
            sx: {
              display: "flex",
              alignItems: "center",
              justifyContent: "center"
            },
            children: [
              /* @__PURE__ */ t(o, { src: i.appLogo, alt: "Server", width: 48, height: 48, useProxyFallback: !0 }),
              /* @__PURE__ */ r(
                e,
                {
                  sx: {
                    mx: 2,
                    display: "flex",
                    alignItems: "center",
                    "& .dot": {
                      width: 8,
                      height: 8,
                      borderRadius: "50%",
                      bgcolor: "grey.500",
                      mx: 0.5
                    }
                  },
                  children: [
                    /* @__PURE__ */ t(e, { className: "dot" }),
                    /* @__PURE__ */ t(e, { className: "dot" }),
                    /* @__PURE__ */ t(e, { className: "dot" })
                  ]
                }
              ),
              /* @__PURE__ */ t(o, { src: a.appLogo, alt: a.appName, width: 48, height: 48, useProxyFallback: !0 })
            ]
          }
        ),
        /* @__PURE__ */ r(
          l,
          {
            sx: {
              mb: 1,
              fontSize: "1.2rem"
            },
            children: [
              "Authorize",
              " ",
              /* @__PURE__ */ t(e, { component: "span", sx: { color: "primary.main" }, children: a.appName })
            ]
          }
        )
      ]
    }
  );
}
export {
  m as default
};
