strapi-plugin-magic-link-v5 5.5.9 → 6.0.0

package/dist/admin/index-DXe_ge4v.mjs

@@ -0,0 +1,620 @@
+import { jsxs, jsx, Fragment } from "react/jsx-runtime";
+import { useState, useRef, useCallback, useEffect } from "react";
+import { Alert, VisuallyHidden, Flex, Badge, Accordion, Box, Typography, Button, Loader } from "@strapi/design-system";
+import { useFetchClient, useNotification, Page } from "@strapi/strapi/admin";
+import { EyeStriked, Eye, Duplicate, Download, User, Shield, ChartBubble, ArrowClockwise } from "@strapi/icons";
+import styled, { css, keyframes } from "styled-components";
+import { u as useMagicLinkIntl, h as useFormatters, j as useCopyToClipboard, i as useMagicLinkRBAC, P as PluginPageTitle, L as LicenseGuard, k as LanguageProvider, s as space, a as brand, t as theme, b as breakpoints, r as reducedMotion, m as motionSafe, f as fontSize, c as color } from "./LicenseGuard-BgLA9go3.mjs";
+const MASK_CHAR = "•";
+const isMaskedKey = (value) => typeof value === "string" && (value.includes(MASK_CHAR) || value.includes("*"));
+const maskLicenseKey = (key) => {
+  if (typeof key !== "string" || !key.trim()) return "";
+  const trimmed = key.trim();
+  if (isMaskedKey(trimmed)) return trimmed;
+  const hidden = MASK_CHAR.repeat(4);
+  if (trimmed.length < 12) return `${hidden}${hidden}`;
+  return `${hidden}-${hidden}-${trimmed.slice(-4)}`;
+};
+const getLicenseView = (payload) => {
+  const details = payload?.data && typeof payload.data === "object" ? payload.data : {};
+  const rawKey = typeof details.licenseKey === "string" ? details.licenseKey.trim() : "";
+  const fullKey = rawKey && !isMaskedKey(rawKey) ? rawKey : null;
+  const maskedKey = typeof details.licenseKeyMasked === "string" && details.licenseKeyMasked.trim() || maskLicenseKey(rawKey);
+  const hasKey = Boolean(payload?.hasKey);
+  const isValid = payload?.valid !== false;
+  let kind = "none";
+  if (hasKey) kind = isValid ? "active" : "unverified";
+  return {
+    kind,
+    hasKey,
+    fullKey,
+    maskedKey,
+    isActive: details.isActive !== false,
+    details
+  };
+};
+const holderName = (details = {}) => [details.firstName, details.lastName].filter((part) => typeof part === "string" && part.trim()).map((part) => part.trim()).join(" ");
+const buildLicenseFileContent = (values, labels) => {
+  const rule = "=".repeat(40);
+  const line = "-".repeat(40);
+  return [
+    labels.title,
+    rule,
+    "",
+    `${labels.key}: ${values.key}`,
+    "",
+    labels.holder,
+    line,
+    `${labels.name}: ${values.name}`,
+    `${labels.email}: ${values.email}`,
+    "",
+    labels.statusSection,
+    line,
+    `${labels.status}: ${values.status}`,
+    `${labels.expires}: ${values.expires}`,
+    "",
+    rule,
+    `${labels.generated}: ${values.generated}`,
+    ""
+  ].join("\n");
+};
+const LICENSE_FILE_NAME = "magic-link-license.txt";
+const licenseErrorMessage = (error, t) => {
+  const status = error?.status ?? error?.response?.status;
+  if (status === 401 || status === 403) {
+    return t(
+      "license.error.forbidden",
+      "You do not have permission to view the license. Ask an administrator for the Settings read permission."
+    );
+  }
+  return t("license.error.load", "The license information could not be loaded. Try again.");
+};
+const fadeIn = keyframes`
+  from { opacity: 0; transform: translateY(8px); }
+  to { opacity: 1; transform: translateY(0); }
+`;
+const shimmer = keyframes`
+  0% { background-position: -200% 0; }
+  100% { background-position: 200% 0; }
+`;
+const Container = styled(Box)`
+  max-width: 1440px;
+  margin: 0 auto;
+  ${motionSafe(css`
+    animation: ${fadeIn} 0.4s ease-out;
+  `)}
+`;
+const StickyHeader = styled(Box)`
+  position: sticky;
+  top: 0;
+  z-index: 10;
+  background: ${color("neutral0")};
+  border-bottom: 1px solid ${color("neutral200")};
+  box-shadow: ${theme.shadows.sm};
+  padding: ${space(6)};
+
+  @media (max-width: ${breakpoints.mobile}) {
+    padding: ${space(4)};
+  }
+`;
+const HeaderRow = styled(Flex)`
+  flex-wrap: wrap;
+  gap: ${space(4)};
+  justify-content: space-between;
+  align-items: center;
+
+  & > :first-child {
+    min-width: 0;
+    flex: 1 1 240px;
+  }
+`;
+const GradientButton = styled(Button)`
+  background: ${brand.gradient};
+  border: none;
+  color: ${brand.onFill};
+
+  & > span,
+  & svg {
+    color: ${brand.onFill};
+    fill: ${brand.onFill};
+  }
+
+  &:hover:not([aria-disabled='true']) {
+    background: ${brand.gradientHover};
+  }
+`;
+const Content = styled(Box)`
+  padding: ${space(6)};
+
+  @media (max-width: ${breakpoints.mobile}) {
+    padding: ${space(4)};
+  }
+`;
+const Stack = styled(Flex)`
+  flex-direction: column;
+  align-items: stretch;
+  gap: ${space(6)};
+`;
+const LicenseKeyBanner = styled.section`
+  background:
+    linear-gradient(rgba(15, 23, 42, 0.25), rgba(15, 23, 42, 0.25)), ${brand.violetGradient};
+  border-radius: ${theme.borderRadius.lg};
+  padding: ${space(6)} ${space(7)};
+  color: ${brand.onFill};
+  position: relative;
+  overflow: hidden;
+  box-shadow: 0 4px 20px rgba(102, 126, 234, 0.25);
+
+  @media (max-width: ${breakpoints.mobile}) {
+    padding: ${space(4)};
+  }
+
+  &::after {
+    content: '';
+    position: absolute;
+    top: -50%;
+    right: -50%;
+    width: 200%;
+    height: 200%;
+    background: linear-gradient(45deg, transparent, rgba(255, 255, 255, 0.08), transparent);
+    background-size: 200% 100%;
+    ${motionSafe(css`
+      animation: ${shimmer} 3s infinite;
+    `)}
+    pointer-events: none;
+    z-index: 0;
+  }
+
+  & > * {
+    position: relative;
+    z-index: 1;
+  }
+
+  ${reducedMotion}
+`;
+const BannerRow = styled.div`
+  display: flex;
+  flex-wrap: wrap;
+  gap: ${space(4)};
+  justify-content: space-between;
+  align-items: flex-start;
+`;
+const BannerBody = styled.div`
+  flex: 1 1 260px;
+  min-width: 0;
+  display: flex;
+  flex-direction: column;
+  gap: ${space(3)};
+`;
+const BannerLabel = styled.h2`
+  margin: 0;
+  color: ${brand.onFill};
+  font-size: ${fontSize(0)};
+  font-weight: 600;
+  letter-spacing: 0.5px;
+  text-transform: uppercase;
+`;
+const KeyText = styled.p`
+  margin: 0;
+  color: ${brand.onFill};
+  font-family: monospace;
+  font-size: ${fontSize(6)};
+  font-weight: 700;
+  line-height: 1.25;
+  overflow-wrap: anywhere;
+
+  @media (max-width: ${breakpoints.mobile}) {
+    font-size: ${fontSize(4)};
+  }
+`;
+const FrostedButton = styled(Button)`
+  background: rgba(15, 23, 42, 0.2);
+  border: 1px solid rgba(255, 255, 255, 0.5);
+  color: ${brand.onFill};
+
+  & > span,
+  & svg {
+    color: ${brand.onFill};
+    fill: ${brand.onFill};
+  }
+
+  &:hover:not([aria-disabled='true']) {
+    background: rgba(15, 23, 42, 0.32);
+    border-color: ${brand.onFill};
+  }
+
+  &:focus-visible {
+    outline: 2px solid ${brand.onFill};
+    outline-offset: 2px;
+  }
+`;
+const DetailGrid = styled.dl`
+  display: grid;
+  grid-template-columns: repeat(auto-fit, minmax(min(180px, 100%), 1fr));
+  align-items: stretch;
+  gap: ${space(6)};
+  margin: 0;
+`;
+const DetailItem = styled.div`
+  display: flex;
+  flex-direction: column;
+  gap: ${space(2)};
+  min-width: 0;
+
+  & > dd {
+    margin: 0;
+    overflow-wrap: anywhere;
+  }
+`;
+const LoaderArea = styled(Flex)`
+  min-height: 320px;
+  align-items: center;
+  justify-content: center;
+`;
+const Detail = ({ label, children }) => /* @__PURE__ */ jsxs(DetailItem, { children: [
+  /* @__PURE__ */ jsx(Typography, { tag: "dt", variant: "sigma", textColor: "neutral600", children: label }),
+  /* @__PURE__ */ jsx(Typography, { tag: "dd", variant: "omega", fontWeight: "semiBold", textColor: "neutral800", children })
+] });
+const describeLicense = (view, t, formatDate) => {
+  const notProvided = t("license.value.notProvided", "Not provided");
+  return {
+    name: holderName(view.details),
+    notProvided,
+    expiresText: view.details.expiresAt ? formatDate(view.details.expiresAt, { dateStyle: "long" }, notProvided) : t("license.value.never", "Never"),
+    activeLabel: view.isActive ? t("license.status.active", "Active") : t("license.status.inactive", "Inactive")
+  };
+};
+const LicenseOverview = ({
+  view,
+  canUseFullKey,
+  revealed,
+  alertDismissed,
+  onDismissAlert,
+  onToggleReveal,
+  onCopy,
+  onDownload
+}) => {
+  const { t } = useMagicLinkIntl();
+  const { formatDate } = useFormatters();
+  const { details } = view;
+  const { name, notProvided, expiresText, activeLabel } = describeLicense(view, t, formatDate);
+  const closeLabel = t("license.alert.close", "Dismiss message");
+  const isRevealed = revealed && canUseFullKey;
+  const alertProps = {
+    active: {
+      variant: "success",
+      title: t("license.alert.active.title", "License active"),
+      body: t(
+        "license.alert.active.body",
+        "License key registered. Thank you for supporting the plugin."
+      )
+    },
+    unverified: {
+      variant: "warning",
+      title: t("license.alert.unverified.title", "License not verified"),
+      body: t(
+        "license.alert.unverified.body",
+        "The license server could not be reached. The plugin keeps working. Refresh the status later."
+      )
+    },
+    none: {
+      variant: "default",
+      title: t("license.alert.none.title", "No license key registered"),
+      body: t(
+        "license.alert.none.body",
+        "All Magic Link features are available without activation."
+      )
+    }
+  }[view.kind];
+  return /* @__PURE__ */ jsxs(Stack, { children: [
+    !alertDismissed && /* @__PURE__ */ jsx(
+      Alert,
+      {
+        variant: alertProps.variant,
+        title: alertProps.title,
+        closeLabel,
+        onClose: onDismissAlert,
+        children: alertProps.body
+      }
+    ),
+    view.maskedKey && /* @__PURE__ */ jsx(LicenseKeyBanner, { "aria-labelledby": "magic-link-license-key-label", children: /* @__PURE__ */ jsxs(BannerRow, { children: [
+      /* @__PURE__ */ jsxs(BannerBody, { children: [
+        /* @__PURE__ */ jsx(BannerLabel, { id: "magic-link-license-key-label", children: t("license.key.label", "License key") }),
+        isRevealed ? /* @__PURE__ */ jsx(KeyText, { children: view.fullKey }) : /* @__PURE__ */ jsxs(KeyText, { children: [
+          /* @__PURE__ */ jsx("span", { "aria-hidden": "true", children: view.maskedKey }),
+          /* @__PURE__ */ jsx(VisuallyHidden, { children: t("license.key.hidden", "License key hidden") })
+        ] }),
+        canUseFullKey && /* @__PURE__ */ jsxs(Flex, { gap: 2, wrap: "wrap", children: [
+          /* @__PURE__ */ jsx(
+            FrostedButton,
+            {
+              size: "M",
+              variant: "secondary",
+              onClick: onToggleReveal,
+              "aria-pressed": isRevealed,
+              startIcon: isRevealed ? /* @__PURE__ */ jsx(EyeStriked, { "aria-hidden": "true" }) : /* @__PURE__ */ jsx(Eye, { "aria-hidden": "true" }),
+              children: isRevealed ? t("license.key.hide", "Hide key") : t("license.key.show", "Show key")
+            }
+          ),
+          /* @__PURE__ */ jsx(
+            FrostedButton,
+            {
+              size: "M",
+              variant: "secondary",
+              onClick: onCopy,
+              startIcon: /* @__PURE__ */ jsx(Duplicate, { "aria-hidden": "true" }),
+              children: t("license.key.copy", "Copy key")
+            }
+          ),
+          /* @__PURE__ */ jsx(
+            FrostedButton,
+            {
+              size: "M",
+              variant: "secondary",
+              onClick: onDownload,
+              startIcon: /* @__PURE__ */ jsx(Download, { "aria-hidden": "true" }),
+              children: t("license.key.download", "Download as TXT")
+            }
+          )
+        ] })
+      ] }),
+      /* @__PURE__ */ jsx(
+        Badge,
+        {
+          size: "M",
+          backgroundColor: view.isActive ? "success100" : "danger100",
+          textColor: view.isActive ? "success700" : "danger700",
+          children: activeLabel
+        }
+      )
+    ] }) }),
+    /* @__PURE__ */ jsxs(Accordion.Root, { defaultValue: "account", children: [
+      /* @__PURE__ */ jsxs(Accordion.Item, { value: "account", children: [
+        /* @__PURE__ */ jsx(Accordion.Header, { children: /* @__PURE__ */ jsx(Accordion.Trigger, { icon: User, children: t("license.section.account", "Account information") }) }),
+        /* @__PURE__ */ jsx(Accordion.Content, { children: /* @__PURE__ */ jsx(Box, { padding: 6, children: /* @__PURE__ */ jsxs(DetailGrid, { children: [
+          /* @__PURE__ */ jsx(Detail, { label: t("license.field.email", "Email address"), children: details.email || notProvided }),
+          /* @__PURE__ */ jsx(Detail, { label: t("license.field.holder", "Name"), children: name || notProvided })
+        ] }) }) })
+      ] }),
+      /* @__PURE__ */ jsxs(Accordion.Item, { value: "details", children: [
+        /* @__PURE__ */ jsx(Accordion.Header, { children: /* @__PURE__ */ jsx(Accordion.Trigger, { icon: Shield, children: t("license.section.details", "License details") }) }),
+        /* @__PURE__ */ jsx(Accordion.Content, { children: /* @__PURE__ */ jsx(Box, { padding: 6, children: /* @__PURE__ */ jsxs(DetailGrid, { children: [
+          /* @__PURE__ */ jsx(
+            Detail,
+            {
+              label: details.isExpired ? t("license.field.expired", "Expired on") : t("license.field.expires", "Expires on"),
+              children: expiresText
+            }
+          ),
+          /* @__PURE__ */ jsx(Detail, { label: t("license.field.deviceName", "Device name"), children: details.deviceName || notProvided }),
+          /* @__PURE__ */ jsx(Detail, { label: t("license.field.ipAddress", "IP address"), children: details.ipAddress || notProvided })
+        ] }) }) })
+      ] }),
+      /* @__PURE__ */ jsxs(Accordion.Item, { value: "status", children: [
+        /* @__PURE__ */ jsx(Accordion.Header, { children: /* @__PURE__ */ jsx(Accordion.Trigger, { icon: ChartBubble, children: t("license.section.status", "System status") }) }),
+        /* @__PURE__ */ jsx(Accordion.Content, { children: /* @__PURE__ */ jsx(Box, { padding: 6, children: /* @__PURE__ */ jsxs(DetailGrid, { children: [
+          /* @__PURE__ */ jsx(Detail, { label: t("license.field.status", "Status"), children: view.hasKey ? activeLabel : t("license.status.noKey", "No key registered") }),
+          /* @__PURE__ */ jsx(Detail, { label: t("license.field.mode", "Plugin mode"), children: t("license.mode.unlocked", "All features available") })
+        ] }) }) })
+      ] })
+    ] })
+  ] });
+};
+const LicenseView = () => {
+  const { get } = useFetchClient();
+  const { toggleNotification } = useNotification();
+  const { t } = useMagicLinkIntl();
+  const { formatDate, formatDateTime } = useFormatters();
+  const copy = useCopyToClipboard();
+  const {
+    canReadSettings,
+    canUpdateSettings,
+    isLoading: rbacLoading,
+    error: rbacError
+  } = useMagicLinkRBAC();
+  const [status, setStatus] = useState("loading");
+  const [licenseData, setLicenseData] = useState(null);
+  const [loadError, setLoadError] = useState(null);
+  const [isRefreshing, setIsRefreshing] = useState(true);
+  const [revealed, setRevealed] = useState(false);
+  const [alertDismissed, setAlertDismissed] = useState(false);
+  const requestRef = useRef(null);
+  const loadLicenseStatus = useCallback(async () => {
+    requestRef.current?.abort();
+    const controller = new AbortController();
+    requestRef.current = controller;
+    try {
+      const response = await get("/magic-link/license/status", { signal: controller.signal });
+      if (controller.signal.aborted) return;
+      setLicenseData(response.data);
+      setLoadError(null);
+      setStatus("ready");
+    } catch (err) {
+      if (controller.signal.aborted) return;
+      setLoadError({ status: err?.status ?? err?.response?.status });
+      setStatus("error");
+    } finally {
+      if (requestRef.current === controller) {
+        requestRef.current = null;
+        setIsRefreshing(false);
+      }
+    }
+  }, [get]);
+  const refreshLicenseStatus = useCallback(() => {
+    setIsRefreshing(true);
+    setRevealed(false);
+    setAlertDismissed(false);
+    return loadLicenseStatus();
+  }, [loadLicenseStatus]);
+  useEffect(() => {
+    if (!canReadSettings) return void 0;
+    const load = async () => {
+      await loadLicenseStatus();
+    };
+    load();
+    return () => requestRef.current?.abort();
+  }, [canReadSettings, loadLicenseStatus]);
+  const pageTitle = /* @__PURE__ */ jsx(PluginPageTitle, { children: t("license.pageTitle", "License") });
+  if (rbacLoading) {
+    return /* @__PURE__ */ jsxs(Fragment, { children: [
+      pageTitle,
+      /* @__PURE__ */ jsx(Page.Loading, { children: t("common.loading", "Loading...") })
+    ] });
+  }
+  if (rbacError) {
+    return /* @__PURE__ */ jsxs(Fragment, { children: [
+      pageTitle,
+      /* @__PURE__ */ jsx(
+        Page.Error,
+        {
+          content: t(
+            "common.permissions.loadError",
+            "Your permissions could not be loaded. Reload the page to try again."
+          )
+        }
+      )
+    ] });
+  }
+  if (!canReadSettings) {
+    return /* @__PURE__ */ jsxs(Fragment, { children: [
+      pageTitle,
+      /* @__PURE__ */ jsx(Page.NoPermissions, {})
+    ] });
+  }
+  const view = getLicenseView(licenseData);
+  const canUseFullKey = canUpdateSettings && Boolean(view.fullKey);
+  const handleCopyLicenseKey = async () => {
+    if (!canUseFullKey) return;
+    await copy(view.fullKey, { success: t("license.copy.success", "License key copied") });
+  };
+  const handleDownloadLicenseKey = () => {
+    if (!canUseFullKey) return;
+    const { name, notProvided, expiresText, activeLabel } = describeLicense(view, t, formatDate);
+    let url = null;
+    try {
+      const content = buildLicenseFileContent(
+        {
+          key: view.fullKey,
+          name: name || notProvided,
+          email: view.details.email || notProvided,
+          status: activeLabel,
+          expires: expiresText,
+          generated: formatDateTime(/* @__PURE__ */ new Date())
+        },
+        {
+          title: t("license.file.title", "Magic Link plugin license key"),
+          key: t("license.key.label", "License key"),
+          holder: t("license.file.holder", "License holder"),
+          name: t("license.field.holder", "Name"),
+          email: t("license.field.email", "Email address"),
+          statusSection: t("license.file.statusSection", "License status"),
+          status: t("license.field.status", "Status"),
+          expires: t("license.field.expires", "Expires on"),
+          generated: t("license.file.generated", "Generated")
+        }
+      );
+      const blob = new Blob([content], { type: "text/plain;charset=utf-8" });
+      url = window.URL.createObjectURL(blob);
+      const link = document.createElement("a");
+      link.href = url;
+      link.download = LICENSE_FILE_NAME;
+      document.body.appendChild(link);
+      link.click();
+      document.body.removeChild(link);
+      toggleNotification({
+        type: "success",
+        message: t("license.download.success", "License file downloaded")
+      });
+    } catch {
+      toggleNotification({
+        type: "danger",
+        message: t("license.download.error", "The license file could not be downloaded.")
+      });
+    } finally {
+      if (url) {
+        const objectUrl = url;
+        window.setTimeout(() => window.URL.revokeObjectURL(objectUrl), 0);
+      }
+    }
+  };
+  const renderBody = () => {
+    if (status === "loading") {
+      return /* @__PURE__ */ jsx(LoaderArea, { "aria-busy": "true", children: /* @__PURE__ */ jsx(Loader, { children: t("license.loading", "Loading license information...") }) });
+    }
+    if (status === "error") {
+      if (alertDismissed) return null;
+      return /* @__PURE__ */ jsx(
+        Alert,
+        {
+          variant: "danger",
+          title: t("license.error.title", "License unavailable"),
+          closeLabel: t("license.alert.close", "Dismiss message"),
+          onClose: () => setAlertDismissed(true),
+          action: /* @__PURE__ */ jsx(
+            Button,
+            {
+              variant: "danger-light",
+              size: "S",
+              startIcon: /* @__PURE__ */ jsx(ArrowClockwise, { "aria-hidden": "true" }),
+              onClick: refreshLicenseStatus,
+              loading: isRefreshing,
+              children: t("license.retry", "Try again")
+            }
+          ),
+          children: licenseErrorMessage(loadError, t)
+        }
+      );
+    }
+    return /* @__PURE__ */ jsx(
+      LicenseOverview,
+      {
+        view,
+        canUseFullKey,
+        revealed,
+        alertDismissed,
+        onDismissAlert: () => setAlertDismissed(true),
+        onToggleReveal: () => setRevealed((current) => !current),
+        onCopy: handleCopyLicenseKey,
+        onDownload: handleDownloadLicenseKey
+      }
+    );
+  };
+  return /* @__PURE__ */ jsxs(Page.Main, { children: [
+    pageTitle,
+    /* @__PURE__ */ jsxs(Container, { children: [
+      /* @__PURE__ */ jsx(StickyHeader, { children: /* @__PURE__ */ jsxs(HeaderRow, { children: [
+        /* @__PURE__ */ jsxs(Flex, { direction: "column", alignItems: "flex-start", gap: 1, children: [
+          /* @__PURE__ */ jsx(Typography, { tag: "h1", variant: "alpha", textColor: "neutral800", children: t("license.title", "License management") }),
+          /* @__PURE__ */ jsx(Typography, { variant: "epsilon", textColor: "neutral600", children: t("license.subtitle", "View the license of your Magic Link plugin") })
+        ] }),
+        /* @__PURE__ */ jsx(
+          GradientButton,
+          {
+            size: "L",
+            startIcon: /* @__PURE__ */ jsx(ArrowClockwise, { "aria-hidden": "true" }),
+            onClick: refreshLicenseStatus,
+            loading: isRefreshing && status !== "loading",
+            disabled: status === "loading",
+            children: t("license.refresh", "Refresh status")
+          }
+        )
+      ] }) }),
+      /* @__PURE__ */ jsx(Content, { "aria-busy": isRefreshing ? "true" : void 0, children: renderBody() })
+    ] })
+  ] });
+};
+const LicensePage = () => /* @__PURE__ */ jsx(LicenseGuard, { children: /* @__PURE__ */ jsx(LanguageProvider, { children: /* @__PURE__ */ jsx(LicenseView, {}) }) });
+export {
+  LICENSE_FILE_NAME,
+  LicenseOverview,
+  LicenseView,
+  MASK_CHAR,
+  buildLicenseFileContent,
+  LicensePage as default,
+  describeLicense,
+  getLicenseView,
+  holderName,
+  isMaskedKey,
+  licenseErrorMessage,
+  maskLicenseKey
+};