[useCurrentMeeting] - created useMeeting hook

This commit is contained in:
Guilherme Leme 2024-04-25 16:19:44 -03:00
parent bdcd577daf
commit 0142ef7f81
5 changed files with 99 additions and 4 deletions

View File

@ -0,0 +1,68 @@
import { useEffect, useRef, useState } from 'react';
import * as PluginSdk from 'bigbluebutton-html-plugin-sdk';
import { SubscribedEventDetails, UpdatedEventDetails } from 'bigbluebutton-html-plugin-sdk/dist/cjs/core/types';
import {
HookEvents,
} from 'bigbluebutton-html-plugin-sdk/dist/cjs/core/enum';
import { DataConsumptionHooks } from 'bigbluebutton-html-plugin-sdk/dist/cjs/data-consumption/enums';
import { equals } from 'ramda';
import formatMeetingResponseFromGraphql from './utils';
import { GeneralHookManagerProps } from '../../../types';
import { GraphqlDataHookSubscriptionResponse } from '/imports/ui/Types/hook';
import { Meeting } from '/imports/ui/Types/meeting';
const MeetingHookContainer: React.FunctionComponent<
GeneralHookManagerProps<GraphqlDataHookSubscriptionResponse<Partial<Meeting>>>
> = (
props: GeneralHookManagerProps<GraphqlDataHookSubscriptionResponse<Partial<Meeting>>>,
) => {
const [sendSignal, setSendSignal] = useState(false);
const previousMeeting = useRef<GraphqlDataHookSubscriptionResponse<Partial<Meeting>> | null>(null);
const { data: meeting } = props;
const updateMeetingForPlugin = () => {
const meetingProjection: PluginSdk.GraphqlResponseWrapper<
PluginSdk.Meeting> = formatMeetingResponseFromGraphql(
meeting,
);
window.dispatchEvent(
new CustomEvent<UpdatedEventDetails<PluginSdk.GraphqlResponseWrapper<PluginSdk.Meeting>>>(
HookEvents.UPDATED,
{
detail: {
data: meetingProjection,
hook: DataConsumptionHooks.MEETING,
},
},
),
);
};
useEffect(() => {
if (!equals(previousMeeting.current, meeting)) {
previousMeeting.current = meeting;
updateMeetingForPlugin();
}
}, [meeting]);
useEffect(() => {
updateMeetingForPlugin();
}, [sendSignal]);
useEffect(() => {
const updateHookUseCurrentMeeting = ((event: CustomEvent<SubscribedEventDetails>) => {
if (event.detail.hook === DataConsumptionHooks.MEETING) setSendSignal((signal) => !signal);
}) as EventListener;
window.addEventListener(
HookEvents.SUBSCRIBED, updateHookUseCurrentMeeting,
);
return () => {
window.removeEventListener(
HookEvents.SUBSCRIBED, updateHookUseCurrentMeeting,
);
};
}, []);
return null;
};
export default MeetingHookContainer;

View File

@ -0,0 +1,17 @@
import * as PluginSdk from 'bigbluebutton-html-plugin-sdk';
import { GraphqlDataHookSubscriptionResponse } from '/imports/ui/Types/hook';
import { Meeting } from '/imports/ui/Types/meeting';
const formatMeetingResponseFromGraphql = (
graphqlDataResult: GraphqlDataHookSubscriptionResponse<Partial<Meeting>>,
): PluginSdk.GraphqlResponseWrapper<PluginSdk.Meeting> => ({
data: graphqlDataResult.data ? {
name: graphqlDataResult?.data?.name,
meetingId: graphqlDataResult?.data?.meetingId,
loginUrl: graphqlDataResult?.data?.loginUrl,
} : undefined,
loading: graphqlDataResult.loading,
error: graphqlDataResult?.errors?.[0],
} as PluginSdk.GraphqlResponseWrapper<PluginSdk.Meeting>);
export default formatMeetingResponseFromGraphql;

View File

@ -21,6 +21,9 @@ import TalkingIndicatorHookContainer from './domain/user-voice/talking-indicator
import { GeneralHookManagerProps } from './types';
import useCurrentUser from '/imports/ui/core/hooks/useCurrentUser';
import { User } from '/imports/ui/Types/user';
import useMeeting from '/imports/ui/core/hooks/useMeeting';
import { Meeting } from '/imports/ui/Types/meeting';
import MeetingHookContainer from './domain/meeting/from-core/hook-manager';
const hooksMap:{
[key: string]: React.FunctionComponent<GeneralHookManagerProps>
@ -30,6 +33,7 @@ const hooksMap:{
[DataConsumptionHooks.LOADED_USER_LIST]: LoadedUserListHookContainer,
[DataConsumptionHooks.CURRENT_USER]: CurrentUserHookContainer,
[DataConsumptionHooks.CURRENT_PRESENTATION]: CurrentPresentationHookContainer,
[DataConsumptionHooks.MEETING]: MeetingHookContainer,
};
const HooksMapWithArguments:{
@ -129,6 +133,11 @@ const PluginDataConsumptionManager: React.FC = () => {
presenter: currentUser.presenter,
}),
);
const meetingInformation = useMeeting((meeting: Partial<Meeting>) => ({
name: meeting?.name,
loginUrl: meeting?.loginUrl,
meetingId: meeting?.meetingId,
}));
return (
<>
{
@ -139,6 +148,7 @@ const PluginDataConsumptionManager: React.FC = () => {
let data;
const HookComponent = hooksMap[hookName];
if (hookName === DataConsumptionHooks.CURRENT_USER) data = currentUser;
if (hookName === DataConsumptionHooks.MEETING) data = meetingInformation;
return (
<HookComponent
key={hookName}

View File

@ -3408,9 +3408,9 @@
"dev": true
},
"bigbluebutton-html-plugin-sdk": {
"version": "0.0.42",
"resolved": "https://registry.npmjs.org/bigbluebutton-html-plugin-sdk/-/bigbluebutton-html-plugin-sdk-0.0.42.tgz",
"integrity": "sha512-xaYvoAAhiZTNBcVPRBKus2n0AgAcEyrKBeGNGxGRLP1xGxsDKg5LCEdFOY0AZZYlDM8fDgfXQL0K7+DUWFJO6A==",
"version": "0.0.46",
"resolved": "https://registry.npmjs.org/bigbluebutton-html-plugin-sdk/-/bigbluebutton-html-plugin-sdk-0.0.46.tgz",
"integrity": "sha512-2EKaw92WyEv7BS9f6os06Jb3vXmTf+oSW9G1YeJ3n1PmmiAEjpaDMeCPCVxezzKmnVY9VkMPsrd2iSTIlg11tQ==",
"requires": {
"@apollo/client": "^3.8.7"
}

View File

@ -47,7 +47,7 @@
"autoprefixer": "^10.4.4",
"axios": "^1.6.4",
"babel-runtime": "~6.26.0",
"bigbluebutton-html-plugin-sdk": "0.0.42",
"bigbluebutton-html-plugin-sdk": "0.0.46",
"bowser": "^2.11.0",
"browser-bunyan": "^1.8.0",
"classnames": "^2.2.6",