Fixed Video preview crash and added error boundaries

canary
WolverinDEV 2020-12-19 20:14:51 +01:00
parent f87dfed579
commit c1a683e505
1 changed files with 10 additions and 3 deletions

View File

@ -16,6 +16,7 @@ import ResizeObserver from "resize-observer-polyfill";
import {LogCategory, logWarn} from "tc-shared/log"; import {LogCategory, logWarn} from "tc-shared/log";
import {spawnContextMenu} from "tc-shared/ui/ContextMenu"; import {spawnContextMenu} from "tc-shared/ui/ContextMenu";
import {VideoBroadcastType} from "tc-shared/connection/VideoConnection"; import {VideoBroadcastType} from "tc-shared/connection/VideoConnection";
import {ErrorBoundary} from "tc-shared/ui/react-elements/ErrorBoundary";
const SubscribeContext = React.createContext<VideoSubscribeInfo>(undefined); const SubscribeContext = React.createContext<VideoSubscribeInfo>(undefined);
const EventContext = React.createContext<Registry<ChannelVideoEvents>>(undefined); const EventContext = React.createContext<Registry<ChannelVideoEvents>>(undefined);
@ -586,7 +587,11 @@ const VideoBar = () => {
<div className={cssStyle.videoBar}> <div className={cssStyle.videoBar}>
<div className={cssStyle.videos} ref={refVideos}> <div className={cssStyle.videos} ref={refVideos}>
{videos === "loading" ? undefined : {videos === "loading" ? undefined :
videos.map(videoId => <VideoContainer videoId={videoId} key={videoId} isSpotlight={false} />) videos.map(videoId => (
<ErrorBoundary key={videoId}>
<VideoContainer videoId={videoId} isSpotlight={false} />
</ErrorBoundary>
))
} }
</div> </div>
<VideoBarArrow direction={"left"} containerRef={refArrowLeft} /> <VideoBarArrow direction={"left"} containerRef={refArrowLeft} />
@ -640,9 +645,11 @@ export const ChannelVideoRenderer = (props: { handlerId: string, events: Registr
<div className={cssStyle.panel}> <div className={cssStyle.panel}>
<VideoSubscribeContextProvider> <VideoSubscribeContextProvider>
<VideoBar /> <VideoBar />
<ExpendArrow />
<ErrorBoundary>
<Spotlight />
</ErrorBoundary>
</VideoSubscribeContextProvider> </VideoSubscribeContextProvider>
<ExpendArrow />
<Spotlight />
</div> </div>
</HandlerIdContext.Provider> </HandlerIdContext.Provider>
</EventContext.Provider> </EventContext.Provider>