28 lines
908 B
TypeScript
28 lines
908 B
TypeScript
import { useMemo } from 'react';
|
|
import { useQuery } from '@tanstack/react-query';
|
|
import { useParams } from 'react-router-dom';
|
|
import { getCameras } from '../../entities/camera/api';
|
|
import { EdgePageLayout } from './components/EdgePageLayout';
|
|
import { VideoView } from './components/VideoView';
|
|
|
|
export function EdgeVideoPage() {
|
|
const { edgeId = '' } = useParams();
|
|
const cameras = useQuery({
|
|
queryKey: ['camera', edgeId],
|
|
queryFn: () => getCameras(edgeId),
|
|
enabled: Boolean(edgeId),
|
|
});
|
|
const cameraItems = useMemo(() => cameras.data?.items ?? [], [cameras.data?.items]);
|
|
|
|
return (
|
|
<EdgePageLayout
|
|
currentEventsConnected={false}
|
|
edgeId={edgeId}
|
|
view="video"
|
|
onRefresh={() => void cameras.refetch()}
|
|
>
|
|
<VideoView cameras={cameraItems} loading={cameras.isPending} isError={cameras.isError} error={cameras.error} />
|
|
</EdgePageLayout>
|
|
);
|
|
}
|