feat(plugin): New Hook useUsersOverview (#19028)

* bump sdk

* [plugin-sdk-issue-45] - useUsersOverview implementation

* [plugin-sdk-issue-45 ] - bump version

bigbluebutton-html5/imports/ui/components/plugins-engine/plugin-hooks-handler/container.tsx

@@ -4,6 +4,7 @@ import React, { useEffect, useState } from 'react';
 import * as PluginSdk from 'bigbluebutton-html-plugin-sdk';
 import CurrentPresentationHookContainer from './use-current-presentation/container';
 import LoadedUserListHookContainer from './use-loaded-user-list/container';
+import UsersOverviewHookContainer from './use-users-overview/container';
 import CurrentUserHookContainer from './use-current-user/container';
 
 const hooksMap:{
@@ -12,6 +13,7 @@ const hooksMap:{
   [PluginSdk.Internal.BbbHooks.UseCurrentPresentation]: CurrentPresentationHookContainer,
   [PluginSdk.Internal.BbbHooks.UseLoadedUserList]: LoadedUserListHookContainer,
   [PluginSdk.Internal.BbbHooks.UseCurrentUser]: CurrentUserHookContainer,
+  [PluginSdk.Internal.BbbHooks.UseUsersOverview]: UsersOverviewHookContainer,
 };
 
 const PluginHooksHandlerContainer: React.FC = () => {

bigbluebutton-html5/imports/ui/components/plugins-engine/plugin-hooks-handler/use-users-overview/container.tsx

@@ -0,0 +1,41 @@
+import { useEffect, useState } from 'react';
+import { useSubscription } from '@apollo/client';
+import * as PluginSdk from 'bigbluebutton-html-plugin-sdk';
+import { USERS_OVERVIEW } from '/imports/ui/core/graphql/queries/users';
+
+const UsersOverviewHookContainer = () => {
+  const [sendSignal, setSendSignal] = useState(false);
+
+  const { data: usersData } = useSubscription(USERS_OVERVIEW);
+
+  const updateUsersOverviewForPlugin = () => {
+    window.dispatchEvent(new CustomEvent(PluginSdk.Internal.BbbHookEvents.Update, {
+      detail: {
+        data: usersData?.user,
+        hook: PluginSdk.Internal.BbbHooks.UseUsersOverview,
+      },
+    }));
+  };
+
+  useEffect(() => {
+    updateUsersOverviewForPlugin();
+  }, [usersData, sendSignal]);
+
+  useEffect(() => {
+    const updateHookUseUsersOverview = () => {
+      setSendSignal(!sendSignal);
+    };
+    window.addEventListener(
+      PluginSdk.Internal.BbbHookEvents.Subscribe, updateHookUseUsersOverview,
+    );
+    return () => {
+      window.removeEventListener(
+        PluginSdk.Internal.BbbHookEvents.Subscribe, updateHookUseUsersOverview,
+      );
+    };
+  }, []);
+
+  return null;
+};
+
+export default UsersOverviewHookContainer;

bigbluebutton-html5/imports/ui/core/graphql/queries/users.ts

@@ -69,7 +69,17 @@ export const USER_AGGREGATE_COUNT_SUBSCRIPTION = gql`
   }
 `;
 
+export const USERS_OVERVIEW = gql`
+subscription Users {
+  user {
+    userId
+    name
+    role
+  }
+}`;
+
 export default {
   USER_LIST_SUBSCRIPTION,
   USER_AGGREGATE_COUNT_SUBSCRIPTION,
+  USERS_OVERVIEW,
 };

bigbluebutton-html5/package-lock.json

@@ -3754,9 +3754,9 @@
       "dev": true
     },
     "bigbluebutton-html-plugin-sdk": {
-      "version": "0.0.21",
-      "resolved": "https://registry.npmjs.org/bigbluebutton-html-plugin-sdk/-/bigbluebutton-html-plugin-sdk-0.0.21.tgz",
-      "integrity": "sha512-qxh2hWhDXm6gTyQ6AzCZc+Phr6z1Do14WnAuWJZYx5u2hk36EcMRNrWiF+pJqwqftOhIadUOKPcKyy3GI9Zw9g=="
+      "version": "0.0.22",
+      "resolved": "https://registry.npmjs.org/bigbluebutton-html-plugin-sdk/-/bigbluebutton-html-plugin-sdk-0.0.22.tgz",
+      "integrity": "sha512-CyULo4yKPjnwPTnD2bX86WUl/6aja+cOMOpaOwecK5ojqogIt03ZptbF1S5tawgmEJEC/5D4I0+m8aLNSpryhQ=="
     },
     "bintrees": {
       "version": "1.0.2",

bigbluebutton-html5/package.json

@@ -45,7 +45,7 @@
     "autoprefixer": "^10.4.4",
     "axios": "^0.21.3",
     "babel-runtime": "~6.26.0",
-    "bigbluebutton-html-plugin-sdk": "0.0.21",
+    "bigbluebutton-html-plugin-sdk": "0.0.22",
     "bowser": "^2.11.0",
     "browser-bunyan": "^1.8.0",
     "classnames": "^2.2.6",