diff --git a/src/frontend/src/features/rooms/livekit/components/DocumentPiPPortal.tsx b/src/frontend/src/features/pip/components/DocumentPiPPortal.tsx similarity index 100% rename from src/frontend/src/features/rooms/livekit/components/DocumentPiPPortal.tsx rename to src/frontend/src/features/pip/components/DocumentPiPPortal.tsx diff --git a/src/frontend/src/features/rooms/livekit/components/PipControlBar.tsx b/src/frontend/src/features/pip/components/PipControlBar.tsx similarity index 62% rename from src/frontend/src/features/rooms/livekit/components/PipControlBar.tsx rename to src/frontend/src/features/pip/components/PipControlBar.tsx index e1afdb15..cb15055b 100644 --- a/src/frontend/src/features/rooms/livekit/components/PipControlBar.tsx +++ b/src/frontend/src/features/pip/components/PipControlBar.tsx @@ -1,13 +1,13 @@ import { styled } from '@/styled-system/jsx' -import { AudioDevicesControl } from './controls/Device/AudioDevicesControl' -import { VideoDeviceControl } from './controls/Device/VideoDeviceControl' -import { ScreenShareToggle } from './controls/ScreenShareToggle' -import { LeaveButton } from './controls/LeaveButton' -import { ReactionsToggle } from './controls/ReactionsToggle' -import { SubtitlesToggle } from './controls/SubtitlesToggle' -import { HandToggle } from './controls/HandToggle' -import { OptionsButton } from './controls/Options/OptionsButton' -import { StartMediaButton } from './controls/StartMediaButton' +import { AudioDevicesControl } from '@/features/rooms/livekit/components/controls/Device/AudioDevicesControl' +import { VideoDeviceControl } from '@/features/rooms/livekit/components/controls/Device/VideoDeviceControl' +import { ScreenShareToggle } from '@/features/rooms/livekit/components/controls/ScreenShareToggle' +import { LeaveButton } from '@/features/rooms/livekit/components/controls/LeaveButton' +import { ReactionsToggle } from '@/features/rooms/livekit/components/controls/ReactionsToggle' +import { SubtitlesToggle } from '@/features/rooms/livekit/components/controls/SubtitlesToggle' +import { HandToggle } from '@/features/rooms/livekit/components/controls/HandToggle' +import { OptionsButton } from '@/features/rooms/livekit/components/controls/Options/OptionsButton' +import { StartMediaButton } from '@/features/rooms/livekit/components/controls/StartMediaButton' import { PipLateralMenu } from './controls/PipLateralMenu' /** diff --git a/src/frontend/src/features/rooms/livekit/components/PipView.tsx b/src/frontend/src/features/pip/components/PipView.tsx similarity index 92% rename from src/frontend/src/features/rooms/livekit/components/PipView.tsx rename to src/frontend/src/features/pip/components/PipView.tsx index 081a2d13..684bdb7d 100644 --- a/src/frontend/src/features/rooms/livekit/components/PipView.tsx +++ b/src/frontend/src/features/pip/components/PipView.tsx @@ -6,9 +6,9 @@ import { } from '@livekit/components-core' import { useTracks } from '@livekit/components-react' import { Track } from 'livekit-client' -import { ParticipantTile } from './ParticipantTile' -import { GridLayout } from './layout/GridLayout' -import { SidePanel } from './SidePanel' +import { ParticipantTile } from '@/features/rooms/livekit/components/ParticipantTile' +import { GridLayout } from '@/features/rooms/livekit/components/layout/GridLayout' +import { SidePanel } from '@/features/rooms/livekit/components/SidePanel' import { PipControlBar } from './PipControlBar' const pickTrackForPip = ( diff --git a/src/frontend/src/features/rooms/livekit/components/RoomPiP.tsx b/src/frontend/src/features/pip/components/RoomPiP.tsx similarity index 100% rename from src/frontend/src/features/rooms/livekit/components/RoomPiP.tsx rename to src/frontend/src/features/pip/components/RoomPiP.tsx diff --git a/src/frontend/src/features/rooms/livekit/components/controls/PipLateralMenu.tsx b/src/frontend/src/features/pip/components/controls/PipLateralMenu.tsx similarity index 82% rename from src/frontend/src/features/rooms/livekit/components/controls/PipLateralMenu.tsx rename to src/frontend/src/features/pip/components/controls/PipLateralMenu.tsx index 9b0c24a4..c2b7e2f0 100644 --- a/src/frontend/src/features/rooms/livekit/components/controls/PipLateralMenu.tsx +++ b/src/frontend/src/features/pip/components/controls/PipLateralMenu.tsx @@ -6,11 +6,11 @@ import { RiArrowDownSLine, RiArrowUpSLine } from '@remixicon/react' import { useTranslation } from 'react-i18next' import { StyledPopover } from '@/primitives/Popover' import { useOverlayBoundaryElement } from '@/primitives/useOverlayPortalContainer' -import { ChatToggle } from './ChatToggle' -import { ParticipantsToggle } from './Participants/ParticipantsToggle' -import { ToolsToggle } from './ToolsToggle' -import { InfoToggle } from './InfoToggle' -import { AdminToggle } from '../AdminToggle' +import { ChatToggle } from '@/features/rooms/livekit/components/controls/ChatToggle' +import { ParticipantsToggle } from '@/features/rooms/livekit/components/controls/Participants/ParticipantsToggle' +import { ToolsToggle } from '@/features/rooms/livekit/components/controls/ToolsToggle' +import { InfoToggle } from '@/features/rooms/livekit/components/controls/InfoToggle' +import { AdminToggle } from '@/features/rooms/livekit/components/AdminToggle' const NavigationControls = ({ onPress }: { onPress?: () => void }) => ( <> diff --git a/src/frontend/src/features/rooms/livekit/components/controls/Options/PipOptionsMenu.tsx b/src/frontend/src/features/pip/components/controls/PipOptionsMenu.tsx similarity index 95% rename from src/frontend/src/features/rooms/livekit/components/controls/Options/PipOptionsMenu.tsx rename to src/frontend/src/features/pip/components/controls/PipOptionsMenu.tsx index 735ffda9..c320a7b8 100644 --- a/src/frontend/src/features/rooms/livekit/components/controls/Options/PipOptionsMenu.tsx +++ b/src/frontend/src/features/pip/components/controls/PipOptionsMenu.tsx @@ -2,7 +2,7 @@ import React, { useEffect } from 'react' import { RiMoreFill } from '@remixicon/react' import { Box, Button } from '@/primitives' import { css } from '@/styled-system/css' -import { OptionsMenuItems } from './OptionsMenuItems' +import { OptionsMenuItems } from '@/features/rooms/livekit/components/controls/Options/OptionsMenuItems' type PipOptionsMenuProps = { wrapperRef: React.RefObject diff --git a/src/frontend/src/features/rooms/livekit/hooks/useDocumentPiP.ts b/src/frontend/src/features/pip/hooks/useDocumentPiP.ts similarity index 100% rename from src/frontend/src/features/rooms/livekit/hooks/useDocumentPiP.ts rename to src/frontend/src/features/pip/hooks/useDocumentPiP.ts diff --git a/src/frontend/src/features/rooms/livekit/hooks/useRoomPiP.tsx b/src/frontend/src/features/pip/hooks/useRoomPiP.tsx similarity index 100% rename from src/frontend/src/features/rooms/livekit/hooks/useRoomPiP.tsx rename to src/frontend/src/features/pip/hooks/useRoomPiP.tsx diff --git a/src/frontend/src/features/rooms/livekit/components/controls/Options/OptionsButton.tsx b/src/frontend/src/features/rooms/livekit/components/controls/Options/OptionsButton.tsx index 959d2627..2f3fbad2 100644 --- a/src/frontend/src/features/rooms/livekit/components/controls/Options/OptionsButton.tsx +++ b/src/frontend/src/features/rooms/livekit/components/controls/Options/OptionsButton.tsx @@ -3,8 +3,8 @@ import { RiMoreFill } from '@remixicon/react' import { Button, Menu } from '@/primitives' import { OptionsMenuItems } from './OptionsMenuItems' import { useOverlayPortalContainer } from '@/primitives/useOverlayPortalContainer' -import { useEffect, useRef, useState } from 'react' -import { PipOptionsMenu } from './PipOptionsMenu' +import { useRef, useState } from 'react' +import { PipOptionsMenu } from '@/features/pip/components/controls/PipOptionsMenu' export const OptionsButton = () => { const { t } = useTranslation('rooms') @@ -13,25 +13,6 @@ export const OptionsButton = () => { const [isOpen, setIsOpen] = useState(false) const wrapperRef = useRef(null) - useEffect(() => { - if (!isOpen || !isInPiP) return - const doc = wrapperRef.current?.ownerDocument ?? document - - const handlePointerDown = (event: PointerEvent) => { - const target = event.target as Node | null - const wrapper = wrapperRef.current - if (!wrapper || !target) return - if (!wrapper.contains(target)) { - setIsOpen(false) - } - } - - doc.addEventListener('pointerdown', handlePointerDown, true) - return () => { - doc.removeEventListener('pointerdown', handlePointerDown, true) - } - }, [isInPiP, isOpen]) - if (isInPiP) { return ( { const { t } = useTranslation('rooms', { keyPrefix: 'options.items' }) diff --git a/src/frontend/src/features/rooms/livekit/prefabs/VideoConference.tsx b/src/frontend/src/features/rooms/livekit/prefabs/VideoConference.tsx index ac32e8fd..3d7d7890 100644 --- a/src/frontend/src/features/rooms/livekit/prefabs/VideoConference.tsx +++ b/src/frontend/src/features/rooms/livekit/prefabs/VideoConference.tsx @@ -34,7 +34,7 @@ import { SettingsDialogExtendedKey } from '@/features/settings/type' import { useVideoResolutionSubscription } from '../hooks/useVideoResolutionSubscription' import { SettingsDialogProvider } from '@/features/settings/components/SettingsDialogProvider' import { IsIdleDisconnectModal } from '../components/IsIdleDisconnectModal' -import { RoomPiP } from '../components/RoomPiP' +import { RoomPiP } from '@/features/pip/components/RoomPiP' import { getParticipantName } from '@/features/rooms/utils/getParticipantName' import { useScreenReaderAnnounce } from '@/hooks/useScreenReaderAnnounce' import { ReactionPortals } from '@/features/reactions/components/ReactionPortals'