UNPKG

@100mslive/roomkit-react

Version:

![Banner](https://github.com/100mslive/web-sdks/blob/06c65259912db6ccd8617f2ecb6fef51429251ec/prebuilt-banner.png)

68 lines (65 loc) 1.99 kB
import React, { useEffect } from 'react'; import { usePDFShare } from '@100mslive/react-sdk'; import { ToastManager } from '../components/Toast/ToastManager'; import { Box } from '../../Layout'; import { EmbedScreenShareView } from './EmbedView'; import { usePDFConfig, useResetPDFConfig } from '../components/AppData/useUISettings'; /** * PDFView is responsible for rendering the PDF iframe and managing the screen sharing functionality. */ export const PDFView = () => { const pdfConfig = usePDFConfig(); const resetConfig = useResetPDFConfig(); // need to send resetConfig to clear configuration, if stop screenshare occurs. const { iframeRef, startPDFShare, isPDFShareInProgress } = usePDFShare(resetConfig); useEffect(() => { // no working in other useEffect, as return is called multiple time on state change return () => { resetConfig(); }; // eslint-disable-next-line react-hooks/exhaustive-deps }, []); useEffect(() => { (async () => { try { if (!isPDFShareInProgress && pdfConfig) { await startPDFShare(pdfConfig); } } catch (err) { resetConfig(); ToastManager.addToast({ title: `Error while sharing annotator ${err.message || ''}`, variant: 'error', }); } })(); }, [isPDFShareInProgress, pdfConfig, resetConfig, startPDFShare]); return ( <EmbedScreenShareView> <Box css={{ mx: '$8', flex: '3 1 0', '@lg': { flex: '2 1 0', display: 'flex', alignItems: 'center', }, }} > <iframe title="Embed View" ref={iframeRef} style={{ width: '100%', height: '100%', border: 0, borderRadius: '0.75rem', }} allow="autoplay; clipboard-write;" referrerPolicy="no-referrer" /> </Box> </EmbedScreenShareView> ); };