strapi-plugin-magic-sessionmanager 1.0.0

package/dist/_chunks/OnlineUsersWidget-B8JS1xZu.js

@@ -0,0 +1,174 @@
+"use strict";
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const jsxRuntime = require("react/jsx-runtime");
+const react = require("react");
+const designSystem = require("@strapi/design-system");
+const icons = require("@strapi/icons");
+const admin = require("@strapi/strapi/admin");
+const OnlineUsersWidget = () => {
+  const { get } = admin.useFetchClient();
+  const [stats, setStats] = react.useState({
+    onlineNow: 0,
+    offline: 0,
+    last15min: 0,
+    last30min: 0,
+    totalUsers: 0,
+    blocked: 0
+  });
+  const [loading, setLoading] = react.useState(true);
+  const fetchStats = react.useCallback(async () => {
+    try {
+      const { data } = await get("/magic-sessionmanager/sessions");
+      const sessions = data.data || [];
+      const now = Date.now();
+      const fifteenMin = 15 * 60 * 1e3;
+      const thirtyMin = 30 * 60 * 1e3;
+      const onlineNow = /* @__PURE__ */ new Set();
+      const last15min = /* @__PURE__ */ new Set();
+      const last30min = /* @__PURE__ */ new Set();
+      sessions.forEach((session) => {
+        const userId = session.user?.id;
+        if (!userId) return;
+        const lastActive = session.lastActive ? new Date(session.lastActive) : new Date(session.loginTime);
+        const timeSinceActive = now - lastActive.getTime();
+        if (timeSinceActive < fifteenMin) {
+          onlineNow.add(userId);
+          last15min.add(userId);
+          last30min.add(userId);
+        } else if (timeSinceActive < thirtyMin) {
+          last15min.add(userId);
+          last30min.add(userId);
+        }
+      });
+      try {
+        const { data: usersData } = await get("/content-manager/collection-types/plugin::users-permissions.user?pageSize=1");
+        const totalUsers = usersData?.pagination?.total || 0;
+        const { data: blockedData } = await get("/content-manager/collection-types/plugin::users-permissions.user?filters[$and][0][blocked][$eq]=true&pageSize=1");
+        const blockedUsers = blockedData?.pagination?.total || 0;
+        setStats({
+          onlineNow: onlineNow.size,
+          last15min: last15min.size,
+          last30min: last30min.size,
+          offline: totalUsers - onlineNow.size,
+          totalUsers,
+          blocked: blockedUsers
+        });
+      } catch (err) {
+        console.error("[OnlineUsersWidget] Error fetching user count:", err);
+        setStats({
+          onlineNow: onlineNow.size,
+          last15min: last15min.size,
+          last30min: last30min.size,
+          offline: 0,
+          totalUsers: onlineNow.size,
+          blocked: 0
+        });
+      }
+    } catch (err) {
+      console.error("[OnlineUsersWidget] Error:", err);
+    } finally {
+      setLoading(false);
+    }
+  }, [get]);
+  react.useEffect(() => {
+    fetchStats();
+    const interval = setInterval(fetchStats, 3e4);
+    return () => clearInterval(interval);
+  }, [fetchStats]);
+  const StatCard = ({ icon: Icon, label, value, color }) => /* @__PURE__ */ jsxRuntime.jsx(
+    designSystem.Box,
+    {
+      as: "a",
+      padding: 4,
+      background: "neutral0",
+      hasRadius: true,
+      shadow: "tableShadow",
+      style: {
+        textDecoration: "none",
+        cursor: "default",
+        transition: "box-shadow 0.2s",
+        border: "1px solid #f0f0ff"
+      },
+      children: /* @__PURE__ */ jsxRuntime.jsx(designSystem.Flex, { justifyContent: "space-between", alignItems: "flex-start", children: /* @__PURE__ */ jsxRuntime.jsxs(designSystem.Flex, { gap: 3, alignItems: "center", children: [
+        /* @__PURE__ */ jsxRuntime.jsx(
+          designSystem.Box,
+          {
+            padding: 2,
+            background: `${color}100`,
+            hasRadius: true,
+            style: {
+              display: "flex",
+              alignItems: "center",
+              justifyContent: "center"
+            },
+            children: /* @__PURE__ */ jsxRuntime.jsx(Icon, { width: "16px", height: "16px", fill: `${color}600` })
+          }
+        ),
+        /* @__PURE__ */ jsxRuntime.jsxs(designSystem.Flex, { direction: "column", gap: 1, alignItems: "flex-start", children: [
+          /* @__PURE__ */ jsxRuntime.jsx(designSystem.Typography, { variant: "pi", textColor: "neutral600", children: label }),
+          /* @__PURE__ */ jsxRuntime.jsx(designSystem.Typography, { variant: "delta", fontWeight: "bold", textColor: "neutral800", children: value })
+        ] })
+      ] }) })
+    }
+  );
+  if (loading) {
+    return /* @__PURE__ */ jsxRuntime.jsx(designSystem.Box, { padding: 4, children: /* @__PURE__ */ jsxRuntime.jsx(designSystem.Typography, { variant: "pi", textColor: "neutral600", children: "Loading..." }) });
+  }
+  return /* @__PURE__ */ jsxRuntime.jsx(designSystem.Box, { padding: 0, children: /* @__PURE__ */ jsxRuntime.jsx(designSystem.Flex, { direction: "column", gap: 3, children: /* @__PURE__ */ jsxRuntime.jsxs(designSystem.Grid.Root, { gap: 3, gridCols: 2, children: [
+    /* @__PURE__ */ jsxRuntime.jsx(designSystem.Grid.Item, { col: 1, children: /* @__PURE__ */ jsxRuntime.jsx(
+      StatCard,
+      {
+        icon: icons.Check,
+        label: "Online Now",
+        value: stats.onlineNow,
+        color: "success"
+      }
+    ) }),
+    /* @__PURE__ */ jsxRuntime.jsx(designSystem.Grid.Item, { col: 1, children: /* @__PURE__ */ jsxRuntime.jsx(
+      StatCard,
+      {
+        icon: icons.Cross,
+        label: "Offline",
+        value: stats.offline,
+        color: "neutral"
+      }
+    ) }),
+    /* @__PURE__ */ jsxRuntime.jsx(designSystem.Grid.Item, { col: 1, children: /* @__PURE__ */ jsxRuntime.jsx(
+      StatCard,
+      {
+        icon: icons.Clock,
+        label: "Last 15 min",
+        value: stats.last15min,
+        color: "primary"
+      }
+    ) }),
+    /* @__PURE__ */ jsxRuntime.jsx(designSystem.Grid.Item, { col: 1, children: /* @__PURE__ */ jsxRuntime.jsx(
+      StatCard,
+      {
+        icon: icons.Clock,
+        label: "Last 30 min",
+        value: stats.last30min,
+        color: "secondary"
+      }
+    ) }),
+    /* @__PURE__ */ jsxRuntime.jsx(designSystem.Grid.Item, { col: 1, children: /* @__PURE__ */ jsxRuntime.jsx(
+      StatCard,
+      {
+        icon: icons.User,
+        label: "Total Users",
+        value: stats.totalUsers,
+        color: "neutral"
+      }
+    ) }),
+    /* @__PURE__ */ jsxRuntime.jsx(designSystem.Grid.Item, { col: 1, children: /* @__PURE__ */ jsxRuntime.jsx(
+      StatCard,
+      {
+        icon: icons.Cross,
+        label: "Blocked",
+        value: stats.blocked,
+        color: "danger"
+      }
+    ) })
+  ] }) }) });
+};
+exports.default = OnlineUsersWidget;