synapse-react-client/dist/components/ExperimentalMode/ExperimentalMode.js

[](https://badge.fury.io/js/synapse-react-client) [](https://github.com/prettier/prettie

import { jsxs as h, jsx as e } from "react/jsx-runtime";
import { isInSynapseExperimentalMode as f } from "../../synapse-client/SynapseClient.js";
import { EXPERIMENTAL_MODE_COOKIE as s } from "../../utils/SynapseConstants.js";
import { InfoOutlined as u } from "@mui/icons-material";
import { useTheme as x, Box as E, Typography as k, Tooltip as I, IconButton as y } from "@mui/material";
import { useState as C, useEffect as M } from "react";
import w from "react-switch";
import c from "universal-cookie";
const l = "experimental-mode", g = "This mode gives you early access to features that are still in development. Please note that we do not guarantee an absence of errors, and that the data created using these features may be lost during product upgrade.";
function L({ onExperimentalModeToggle: t }) {
  const [n, o] = C(!1);
  let r = !0;
  const m = x();
  M(() => (r && f() && o(!0), () => {
    r = !1;
  }), []);
  const a = () => ({
    path: "/",
    domain: window.location.hostname.toLowerCase().endsWith(".synapse.org") ? "synapse.org" : void 0
  }), d = () => {
    new c().set(
      s,
      "true",
      a()
    ), o(!0), t && t(!0);
  }, p = () => {
    new c().remove(s, a()), o(!1), t && t(!1);
  };
  return /* @__PURE__ */ h(E, { sx: { display: "flex", alignItems: "center" }, children: [
    /* @__PURE__ */ e(
      k,
      {
        component: "label",
        variant: "body1",
        htmlFor: l,
        children: "Experimental Mode"
      }
    ),
    /* @__PURE__ */ e(I, { title: g, arrow: !0, placement: "top", children: /* @__PURE__ */ e(
      y,
      {
        "aria-label": "info",
        color: "inherit",
        sx: { "&:hover": { backgroundColor: "transparent" } },
        children: /* @__PURE__ */ e(u, { sx: { verticalAlign: "middle" } })
      }
    ) }),
    /* @__PURE__ */ e(
      w,
      {
        id: l,
        width: 35,
        height: 20,
        onColor: m.palette.secondary.main,
        checkedIcon: !1,
        uncheckedIcon: !1,
        checked: n,
        onChange: n ? p : d
      }
    )
  ] });
}
export {
  L as default
};
//# sourceMappingURL=ExperimentalMode.js.map