bigbluebutton-Github/bigbluebutton-html5/imports/ui/components/components-data/graphqlToMakeVarAdapterManager/component.tsx
2024-06-28 16:44:14 -03:00

50 lines
1.2 KiB
TypeScript

import React, {
useCallback,
useMemo,
useRef,
useState,
} from 'react';
import VideoStreamAdapter from '/imports/ui/components/video-provider/adapter';
interface GraphqlToMakeVarAdapterManagerProps {
children: React.ReactNode;
}
export interface AdapterProps extends GraphqlToMakeVarAdapterManagerProps {
onReady: (key:string) => void;
}
const GraphqlToMakeVarAdapterManager: React.FC<GraphqlToMakeVarAdapterManagerProps> = ({ children }) => {
const [adapterLoaded, setAdapterLoaded] = useState(false);
const loadedComponents = useRef<{
[key: string]: number;
}>({});
const adapterComponents = useRef([
VideoStreamAdapter,
]);
const onReady = useCallback((key: string) => {
loadedComponents.current[key] = 1;
if (Object.keys(loadedComponents.current).length >= adapterComponents.current.length) {
setAdapterLoaded(true);
}
}, []);
const nestAdapters = useMemo(() => {
return adapterComponents.current.reduce((acc, Component) => (
<Component onReady={onReady}>
{acc}
</Component>
), <span />);
}, []);
return (
<>
{nestAdapters}
{adapterLoaded ? children : null}
</>
);
};
export default GraphqlToMakeVarAdapterManager;