@strapi-community/plugin-io 5.3.0 → 5.3.2

package/README.md

@@ -898,13 +898,17 @@ Authorization: Bearer <admin-jwt>
 
 The plugin provides a full admin interface for configuration and monitoring.
 
-### Dashboard Widget
+### Dashboard Widgets
 
 > **Requires Strapi v5.13+**
 
-After installation, a live statistics widget appears on your Strapi admin homepage:
+After installation, live statistics widgets appear on your Strapi admin homepage:
 
-**Widget Shows:**
+#### Socket.IO Statistics Widget
+
+![Socket.IO Statistics Widget](./pics/widget.png)
+
+**Shows:**
 - Live connection status (pulsing indicator when active)
 - Active connections count
 - Active rooms count
@@ -913,12 +917,24 @@ After installation, a live statistics widget appears on your Strapi admin homepa
 
 Updates automatically every 5 seconds.
 
+#### Who's Online Widget
+
+![Who's Online Widget](./pics/whoisonlinewidget.png)
+
+**Shows:**
+- List of currently online admin users
+- User avatars with role badges
+- Online status and last activity
+- Quick access to view all activity
+
 ### Settings Page
 
 Navigate to **Settings > Socket.IO > Settings** for visual configuration:
 
 **Path:** `/admin/settings/io/settings`
 
+![Socket.IO Settings](./pics/settings.png)
+
 #### General Settings
 - Enable/disable the plugin
 - Configure CORS origins
@@ -956,6 +972,8 @@ Navigate to **Settings > Socket.IO > Monitoring** for live statistics:
 
 **Path:** `/admin/settings/io/monitoring`
 
+![Monitoring & Logging](./pics/monitoringSettings.png)
+
 - View active connections with user details
 - See event logs in real-time
 - Monitor performance metrics (events/second)
@@ -971,6 +989,8 @@ When editing content in the Content Manager, a **Live Presence** panel appears i
 - **Active Editors** - List of other users editing the same content
 - **Typing Indicator** - Shows when someone is typing and in which field
 
+![Live Presence Panel](./pics/livepresenceindi.png)
+
 **How It Works:**
 
 1. When you open a content entry, the panel connects via Socket.IO
@@ -978,24 +998,6 @@ When editing content in the Content Manager, a **Live Presence** panel appears i
 3. Typing in any field broadcasts a typing indicator to others
 4. When you leave, others are notified
 
-**Example Display:**
-
-```
-+-----------------------------+
-| Live Presence               |
-+-----------------------------+
-| [*] Live                    |
-|     Real-time sync active   |
-+-----------------------------+
-| ALSO EDITING (1)            |
-| +-------------------------+ |
-| | SA  Sarah Admin         | |
-| |     Typing in: title    | |
-| |            [Typing...]  | |
-| +-------------------------+ |
-+-----------------------------+
-```
-
 ---
 
 ## Monitoring Service

package/dist/_chunks/{LivePresencePanel-D_vzQr4B.mjs → LivePresencePanel-GVXmNi4P.mjs}

@@ -5,7 +5,7 @@ import { Flex } from "@strapi/design-system";
 import { useFetchClient } from "@strapi/strapi/admin";
 import styled, { css, keyframes } from "styled-components";
 import { io } from "socket.io-client";
-import { P as PLUGIN_ID } from "./index-Bw7WjN5H.mjs";
+import { P as PLUGIN_ID } from "./index-6OLmXhVw.mjs";
 const pulse = keyframes`
   0%, 100% { 
     box-shadow: 0 0 0 3px rgba(34, 197, 94, 0.2);

package/dist/_chunks/{LivePresencePanel-BkeWL4kq.js → LivePresencePanel-vr2O8XCP.js}

@@ -7,7 +7,7 @@ const designSystem = require("@strapi/design-system");
 const admin = require("@strapi/strapi/admin");
 const styled = require("styled-components");
 const socket_ioClient = require("socket.io-client");
-const index$1 = require("./index-DVNfszio.js");
+const index$1 = require("./index-BOmMSyxA.js");
 const _interopDefault = (e) => e && e.__esModule ? e : { default: e };
 const styled__default = /* @__PURE__ */ _interopDefault(styled);
 const pulse = styled.keyframes`

package/dist/_chunks/{MonitoringPage-CYGqkzva.js → MonitoringPage-BF7j_o-y.js}

@@ -6,7 +6,7 @@ const admin = require("@strapi/strapi/admin");
 const styled = require("styled-components");
 const designSystem = require("@strapi/design-system");
 const index = require("./index-DkTxsEqL.js");
-const index$1 = require("./index-DVNfszio.js");
+const index$1 = require("./index-BOmMSyxA.js");
 const _interopDefault = (e) => e && e.__esModule ? e : { default: e };
 const styled__default = /* @__PURE__ */ _interopDefault(styled);
 const UsersIcon = () => /* @__PURE__ */ jsxRuntime.jsx("svg", { xmlns: "http://www.w3.org/2000/svg", fill: "none", viewBox: "0 0 24 24", strokeWidth: 1.5, stroke: "currentColor", children: /* @__PURE__ */ jsxRuntime.jsx("path", { strokeLinecap: "round", strokeLinejoin: "round", d: "M15 19.128a9.38 9.38 0 0 0 2.625.372 9.337 9.337 0 0 0 4.121-.952 4.125 4.125 0 0 0-7.533-2.493M15 19.128v-.003c0-1.113-.285-2.16-.786-3.07M15 19.128v.106A12.318 12.318 0 0 1 8.624 21c-2.331 0-4.512-.645-6.374-1.766l-.001-.109a6.375 6.375 0 0 1 11.964-3.07M12 6.375a3.375 3.375 0 1 1-6.75 0 3.375 3.375 0 0 1 6.75 0Zm8.25 2.25a2.625 2.625 0 1 1-5.25 0 2.625 2.625 0 0 1 5.25 0Z" }) });

package/dist/_chunks/{MonitoringPage-DKfhYUgU.mjs → MonitoringPage-D_-Z46BS.mjs}

@@ -4,7 +4,7 @@ import { useFetchClient, useNotification } from "@strapi/strapi/admin";
 import styled, { css, keyframes } from "styled-components";
 import { Box, Loader, Flex, Field, TextInput, Badge, Typography } from "@strapi/design-system";
 import { u as useIntl } from "./index-CEh8vkxY.mjs";
-import { P as PLUGIN_ID } from "./index-Bw7WjN5H.mjs";
+import { P as PLUGIN_ID } from "./index-6OLmXhVw.mjs";
 const UsersIcon = () => /* @__PURE__ */ jsx("svg", { xmlns: "http://www.w3.org/2000/svg", fill: "none", viewBox: "0 0 24 24", strokeWidth: 1.5, stroke: "currentColor", children: /* @__PURE__ */ jsx("path", { strokeLinecap: "round", strokeLinejoin: "round", d: "M15 19.128a9.38 9.38 0 0 0 2.625.372 9.337 9.337 0 0 0 4.121-.952 4.125 4.125 0 0 0-7.533-2.493M15 19.128v-.003c0-1.113-.285-2.16-.786-3.07M15 19.128v.106A12.318 12.318 0 0 1 8.624 21c-2.331 0-4.512-.645-6.374-1.766l-.001-.109a6.375 6.375 0 0 1 11.964-3.07M12 6.375a3.375 3.375 0 1 1-6.75 0 3.375 3.375 0 0 1 6.75 0Zm8.25 2.25a2.625 2.625 0 1 1-5.25 0 2.625 2.625 0 0 1 5.25 0Z" }) });
 const BoltIcon = () => /* @__PURE__ */ jsx("svg", { xmlns: "http://www.w3.org/2000/svg", fill: "none", viewBox: "0 0 24 24", strokeWidth: 1.5, stroke: "currentColor", children: /* @__PURE__ */ jsx("path", { strokeLinecap: "round", strokeLinejoin: "round", d: "m3.75 13.5 10.5-11.25L12 10.5h8.25L9.75 21.75 12 13.5H3.75Z" }) });
 const ChartBarIcon = () => /* @__PURE__ */ jsx("svg", { xmlns: "http://www.w3.org/2000/svg", fill: "none", viewBox: "0 0 24 24", strokeWidth: 1.5, stroke: "currentColor", children: /* @__PURE__ */ jsx("path", { strokeLinecap: "round", strokeLinejoin: "round", d: "M3 13.125C3 12.504 3.504 12 4.125 12h2.25c.621 0 1.125.504 1.125 1.125v6.75C7.5 20.496 6.996 21 6.375 21h-2.25A1.125 1.125 0 0 1 3 19.875v-6.75ZM9.75 8.625c0-.621.504-1.125 1.125-1.125h2.25c.621 0 1.125.504 1.125 1.125v11.25c0 .621-.504 1.125-1.125 1.125h-2.25a1.125 1.125 0 0 1-1.125-1.125V8.625ZM16.5 4.125c0-.621.504-1.125 1.125-1.125h2.25C20.496 3 21 3.504 21 4.125v15.75c0 .621-.504 1.125-1.125 1.125h-2.25a1.125 1.125 0 0 1-1.125-1.125V4.125Z" }) });

package/dist/_chunks/{OnlineEditorsWidget-Bf8hfVha.js → OnlineEditorsWidget-CIvPvATB.js}

@@ -7,7 +7,7 @@ const icons = require("@strapi/icons");
 const admin = require("@strapi/strapi/admin");
 const styled = require("styled-components");
 const socket_ioClient = require("socket.io-client");
-const index = require("./index-DVNfszio.js");
+const index = require("./index-BOmMSyxA.js");
 const _interopDefault = (e) => e && e.__esModule ? e : { default: e };
 const styled__default = /* @__PURE__ */ _interopDefault(styled);
 const pulse = styled.keyframes`
@@ -338,4 +338,3 @@ const OnlineEditorsWidget = () => {
   ] });
 };
 exports.OnlineEditorsWidget = OnlineEditorsWidget;
-exports.default = OnlineEditorsWidget;

package/dist/_chunks/{OnlineEditorsWidget-RcYLxQke.mjs → OnlineEditorsWidget-HoSM-JvQ.mjs}

@@ -5,7 +5,7 @@ import { Pencil, User, Clock } from "@strapi/icons";
 import { useFetchClient } from "@strapi/strapi/admin";
 import styled, { keyframes } from "styled-components";
 import { io } from "socket.io-client";
-import { P as PLUGIN_ID } from "./index-Bw7WjN5H.mjs";
+import { P as PLUGIN_ID } from "./index-6OLmXhVw.mjs";
 const pulse = keyframes`
   0%, 100% { opacity: 1; }
   50% { opacity: 0.5; }
@@ -334,6 +334,5 @@ const OnlineEditorsWidget = () => {
   ] });
 };
 export {
-  OnlineEditorsWidget,
-  OnlineEditorsWidget as default
+  OnlineEditorsWidget
 };

package/dist/_chunks/{SettingsPage-Qi0iMaWc.mjs → SettingsPage-CbtGTI5C.mjs}

@@ -5,7 +5,7 @@ import { Download, Upload, Check } from "@strapi/icons";
 import { useFetchClient, useNotification } from "@strapi/strapi/admin";
 import { u as useIntl } from "./index-CEh8vkxY.mjs";
 import styled from "styled-components";
-import { P as PLUGIN_ID } from "./index-Bw7WjN5H.mjs";
+import { P as PLUGIN_ID } from "./index-6OLmXhVw.mjs";
 const ResponsiveMain = styled(Main)`
   & > div {
     padding: 16px !important;

package/dist/_chunks/{SettingsPage-0k9qPAJZ.js → SettingsPage-Cq__0eJy.js}

@@ -7,7 +7,7 @@ const icons = require("@strapi/icons");
 const admin = require("@strapi/strapi/admin");
 const index = require("./index-DkTxsEqL.js");
 const styled = require("styled-components");
-const index$1 = require("./index-DVNfszio.js");
+const index$1 = require("./index-BOmMSyxA.js");
 const _interopDefault = (e) => e && e.__esModule ? e : { default: e };
 const styled__default = /* @__PURE__ */ _interopDefault(styled);
 const ResponsiveMain = styled__default.default(designSystem.Main)`

package/dist/_chunks/{index-Bw7WjN5H.mjs → index-6OLmXhVw.mjs}

@@ -50,7 +50,7 @@ const index = {
           },
           id: `${PLUGIN_ID}-settings`,
           to: `${PLUGIN_ID}/settings`,
-          Component: () => import("./SettingsPage-Qi0iMaWc.mjs").then((mod) => ({ default: mod.SettingsPage }))
+          Component: () => import("./SettingsPage-CbtGTI5C.mjs").then((mod) => ({ default: mod.SettingsPage }))
         },
         {
           intlLabel: {
@@ -59,7 +59,7 @@ const index = {
           },
           id: `${PLUGIN_ID}-monitoring`,
           to: `${PLUGIN_ID}/monitoring`,
-          Component: () => import("./MonitoringPage-DKfhYUgU.mjs").then((mod) => ({ default: mod.MonitoringPage }))
+          Component: () => import("./MonitoringPage-D_-Z46BS.mjs").then((mod) => ({ default: mod.MonitoringPage }))
         }
       ]
     );
@@ -84,7 +84,7 @@ const index = {
           defaultMessage: "Who's Online"
         },
         component: async () => {
-          const component = await import("./OnlineEditorsWidget-RcYLxQke.mjs");
+          const component = await import("./OnlineEditorsWidget-HoSM-JvQ.mjs");
           return component.OnlineEditorsWidget;
         },
         id: "socket-io-online-editors-widget",
@@ -96,7 +96,7 @@ const index = {
   async bootstrap(app) {
     console.log(`[${PLUGIN_ID}] [INFO] Bootstrapping plugin...`);
     try {
-      const { default: LivePresencePanel } = await import("./LivePresencePanel-D_vzQr4B.mjs");
+      const { default: LivePresencePanel } = await import("./LivePresencePanel-GVXmNi4P.mjs");
       const contentManagerPlugin = app.getPlugin("content-manager");
       if (contentManagerPlugin && contentManagerPlugin.apis) {
         contentManagerPlugin.apis.addEditViewSidePanel([LivePresencePanel]);

package/dist/_chunks/{index-DVNfszio.js → index-BOmMSyxA.js}

@@ -51,7 +51,7 @@ const index = {
           },
           id: `${PLUGIN_ID}-settings`,
           to: `${PLUGIN_ID}/settings`,
-          Component: () => Promise.resolve().then(() => require("./SettingsPage-0k9qPAJZ.js")).then((mod) => ({ default: mod.SettingsPage }))
+          Component: () => Promise.resolve().then(() => require("./SettingsPage-Cq__0eJy.js")).then((mod) => ({ default: mod.SettingsPage }))
         },
         {
           intlLabel: {
@@ -60,7 +60,7 @@ const index = {
           },
           id: `${PLUGIN_ID}-monitoring`,
           to: `${PLUGIN_ID}/monitoring`,
-          Component: () => Promise.resolve().then(() => require("./MonitoringPage-CYGqkzva.js")).then((mod) => ({ default: mod.MonitoringPage }))
+          Component: () => Promise.resolve().then(() => require("./MonitoringPage-BF7j_o-y.js")).then((mod) => ({ default: mod.MonitoringPage }))
         }
       ]
     );
@@ -85,7 +85,7 @@ const index = {
           defaultMessage: "Who's Online"
         },
         component: async () => {
-          const component = await Promise.resolve().then(() => require("./OnlineEditorsWidget-Bf8hfVha.js"));
+          const component = await Promise.resolve().then(() => require("./OnlineEditorsWidget-CIvPvATB.js"));
           return component.OnlineEditorsWidget;
         },
         id: "socket-io-online-editors-widget",
@@ -97,7 +97,7 @@ const index = {
   async bootstrap(app) {
     console.log(`[${PLUGIN_ID}] [INFO] Bootstrapping plugin...`);
     try {
-      const { default: LivePresencePanel } = await Promise.resolve().then(() => require("./LivePresencePanel-BkeWL4kq.js"));
+      const { default: LivePresencePanel } = await Promise.resolve().then(() => require("./LivePresencePanel-vr2O8XCP.js"));
       const contentManagerPlugin = app.getPlugin("content-manager");
       if (contentManagerPlugin && contentManagerPlugin.apis) {
         contentManagerPlugin.apis.addEditViewSidePanel([LivePresencePanel]);

package/dist/admin/index.js

@@ -1,3 +1,3 @@
 "use strict";
-const index = require("../_chunks/index-DVNfszio.js");
+const index = require("../_chunks/index-BOmMSyxA.js");
 module.exports = index.index;

package/dist/admin/index.mjs

@@ -1,4 +1,4 @@
-import { i } from "../_chunks/index-Bw7WjN5H.mjs";
+import { i } from "../_chunks/index-6OLmXhVw.mjs";
 export {
   i as default
 };