synapse-react-client/dist/components/Authentication/LastLoginInfo.js

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

import { jsx as e, Fragment as c, jsxs as i } from "react/jsx-runtime";
import { formatDate as O } from "../../utils/functions/DateFormatter.js";
import { LAST_LOGIN_DATE_LOCALSTORAGE_KEY as S, LAST_LOGIN_SOURCEAPP_URL_LOCALSTORAGE_KEY as A, LAST_LOGIN_SOURCEAPP_NAME_LOCALSTORAGE_KEY as h, LAST_LOGIN_METHOD_LOCALSTORAGE_KEY as f, CURRENT_SOURCEAPP_NAME_LOCALSTORAGE_KEY as d } from "../../utils/SynapseConstants.js";
import { InfoTwoTone as v } from "@mui/icons-material";
import { Typography as n, Tooltip as N, Box as I, Link as R } from "@mui/material";
import { useLocalStorageValue as r } from "@react-hookz/web";
import M from "dayjs";
import { getLoginMethodFriendlyName as Y } from "./LoginMethod.js";
function C() {
  return {
    currentSourceAppNameState: r(
      d
    ),
    lastLoginMethodState: r(
      f
    ),
    lastLoginSourceAppNameState: r(
      h
    ),
    lastLoginSourceAppURLState: r(
      A
    ),
    lastLoginDateState: r(
      S
    )
  };
}
function z() {
  const t = C();
  return {
    currentSourceAppName: t.currentSourceAppNameState.value,
    lastLoginMethod: t.lastLoginMethodState.value,
    lastLoginSourceAppName: t.lastLoginSourceAppNameState.value,
    lastLoginSourceAppURL: t.lastLoginSourceAppURLState.value,
    lastLoginDate: t.lastLoginDateState.value
  };
}
function F() {
  [
    d,
    f,
    h,
    A,
    S
  ].forEach((o) => localStorage.removeItem(o));
}
function D(t) {
  return t.match(/^[aeiou]/i) ? "an" : "a";
}
function g(t) {
  return t.match(" Portal$") ? "the " : "";
}
function B(t) {
  const {
    currentSourceAppName: o,
    lastLoginMethod: l,
    lastLoginSourceAppName: a,
    lastLoginSourceAppURL: s,
    lastLoginDate: u,
    display: x
  } = t;
  if (!(o && l && a && s && u && o !== a))
    return null;
  const T = D(o), _ = g(o), p = g(
    a
  ), L = `You may already have ${T} ${o} account`, m = `Account last used on ${O(
    M(u),
    "MMMM D, YYYY"
  )}`, E = /* @__PURE__ */ i(c, { children: [
    /* @__PURE__ */ e(
      n,
      {
        variant: "smallText2",
        sx: {
          mb: 1
        },
        children: L
      }
    ),
    /* @__PURE__ */ e(
      n,
      {
        variant: "smallText1",
        color: "white",
        sx: {
          mb: 1
        },
        children: `This computer was used to sign in to an account on ${p}${a}. 
          You can use the same account to sign in to ${_}${o}.`
      }
    ),
    /* @__PURE__ */ e(n, { variant: "smallText1", color: "white", children: m })
  ] }), y = /* @__PURE__ */ i(c, { children: [
    /* @__PURE__ */ e(
      n,
      {
        variant: "smallText2",
        sx: {
          mb: 1,
          color: "grey.900",
          fontSize: "12px"
        },
        children: L
      }
    ),
    /* @__PURE__ */ i(
      n,
      {
        variant: "smallText1",
        sx: {
          mb: 1,
          color: "grey.900",
          fontSize: "12px"
        },
        children: [
          "It looks like you already have an account, last used on",
          " ",
          p,
          /* @__PURE__ */ e(R, { href: s, children: a }),
          ".",
          " ",
          `You can use this account to sign in via ${Y(
            l
          )}.`
        ]
      }
    ),
    /* @__PURE__ */ e(
      n,
      {
        variant: "smallText1",
        sx: { color: "grey.700", fontSize: "10px" },
        children: m
      }
    )
  ] });
  return /* @__PURE__ */ e(c, { children: x === "sentence" ? /* @__PURE__ */ i(
    n,
    {
      variant: "smallText1",
      sx: { color: "grey.700", textTransform: "none" },
      children: [
        "You may be able to use an existing account",
        /* @__PURE__ */ e(
          N,
          {
            title: E,
            placement: "top",
            slotProps: {
              tooltip: {
                sx: {
                  bgcolor: "#63676C",
                  "& .MuiTooltip-arrow": {
                    color: "#63676C"
                  }
                }
              }
            },
            children: /* @__PURE__ */ e(
              v,
              {
                sx: {
                  color: "grey.700",
                  width: "12px",
                  height: "12px",
                  ml: "4px",
                  verticalAlign: "middle"
                }
              }
            )
          }
        )
      ]
    }
  ) : /* @__PURE__ */ e(I, { sx: { backgroundColor: "grey.100", p: "10px" }, children: y }) });
}
export {
  F as clearLastLoginInfo,
  B as default,
  z as useLastLoginInfo,
  C as useLastLoginInfoState
};
//# sourceMappingURL=LastLoginInfo.js.map