mirror of
https://github.com/suitenumerique/meet.git
synced 2026-07-27 12:19:10 +00:00
fixup! ✨(frontend) add ScreenShareZoomableVideo component for zoomable screen shares
This commit is contained in:
@@ -0,0 +1,26 @@
|
||||
import { VideoTrack } from '@livekit/components-react'
|
||||
import { type TrackReference } from '@livekit/components-core'
|
||||
import { memo } from 'react'
|
||||
|
||||
interface ScreenShareVideoTrackProps {
|
||||
trackRef: TrackReference
|
||||
onSubscriptionStatusChanged: (subscribed: boolean) => void
|
||||
manageSubscription?: boolean
|
||||
}
|
||||
|
||||
// Zoom/pan updates the wrapper transform only; skip VideoTrack re-renders.
|
||||
export const ScreenShareVideoTrack = memo(
|
||||
({
|
||||
trackRef,
|
||||
onSubscriptionStatusChanged,
|
||||
manageSubscription,
|
||||
}: ScreenShareVideoTrackProps) => (
|
||||
<VideoTrack
|
||||
trackRef={trackRef}
|
||||
onSubscriptionStatusChanged={onSubscriptionStatusChanged}
|
||||
manageSubscription={manageSubscription}
|
||||
/>
|
||||
)
|
||||
)
|
||||
|
||||
ScreenShareVideoTrack.displayName = 'ScreenShareVideoTrack'
|
||||
@@ -1,11 +1,11 @@
|
||||
import { css } from '@/styled-system/css'
|
||||
import { VideoTrack } from '@livekit/components-react'
|
||||
import { type TrackReference } from '@livekit/components-core'
|
||||
import { useEffect, useRef } from 'react'
|
||||
import { useTranslation } from 'react-i18next'
|
||||
import { useScreenShareZoom } from '../hooks/useScreenShareZoom'
|
||||
import { useScreenReaderAnnounce } from '@/hooks/useScreenReaderAnnounce'
|
||||
import { ScreenShareZoomControls } from './ScreenShareZoomControls'
|
||||
import { ScreenShareVideoTrack } from './ScreenShareVideoTrack'
|
||||
|
||||
interface ScreenShareZoomableVideoProps {
|
||||
trackRef: TrackReference
|
||||
@@ -86,7 +86,7 @@ export const ScreenShareZoomableVideo = ({
|
||||
transition: zoom.isDragging ? 'none' : 'transform 150ms ease-out',
|
||||
}}
|
||||
>
|
||||
<VideoTrack
|
||||
<ScreenShareVideoTrack
|
||||
trackRef={trackRef}
|
||||
onSubscriptionStatusChanged={onSubscriptionStatusChanged}
|
||||
manageSubscription={manageSubscription}
|
||||
|
||||
Reference in New Issue
Block a user