From be47dcdba2c6e57cd17074f4d35fed6c9e18b4a0 Mon Sep 17 00:00:00 2001 From: Ivan Malison Date: Fri, 8 Mar 2024 17:54:59 -0700 Subject: [PATCH] Add an overlay that shows streaming state --- src/index.tsx | 168 +++++++++++++++++++++++++++++++++++++++ src/operations/video.gql | 54 +++++++++++++ 2 files changed, 222 insertions(+) create mode 100644 src/operations/video.gql diff --git a/src/index.tsx b/src/index.tsx index 86dae4a..ce253a7 100644 --- a/src/index.tsx +++ b/src/index.tsx @@ -559,6 +559,53 @@ export type GetShotsQuery = { }>; }; +export type GetStreamMonitoringDetailsQueryVariables = Exact<{ + videoId: Scalars["Int"]["input"]; +}>; + +export type GetStreamMonitoringDetailsQuery = { + __typename?: "Query"; + getVideo: { + __typename?: "VideoGQL"; + id: number; + totalShots: number; + makePercentage: number; + elapsedTime?: number | null; + stream?: { + __typename?: "UploadStreamGQL"; + linksRequested: number; + uploadsCompleted: number; + segmentProcessingCursor: number; + homographyHistory: Array<{ + __typename?: "HomographyInfoGQL"; + crop: { + __typename?: "BoundingBoxGQL"; + left: number; + top: number; + width: number; + height: number; + }; + pockets: Array<{ + __typename?: "BoundingBoxGQL"; + left: number; + top: number; + width: number; + height: number; + }>; + sourcePoints: { + __typename?: "PocketPointsGQL"; + topLeft: { __typename?: "IntPoint2D"; x: number; y: number }; + topSide: { __typename?: "IntPoint2D"; x: number; y: number }; + topRight: { __typename?: "IntPoint2D"; x: number; y: number }; + bottomLeft: { __typename?: "IntPoint2D"; x: number; y: number }; + bottomSide: { __typename?: "IntPoint2D"; x: number; y: number }; + bottomRight: { __typename?: "IntPoint2D"; x: number; y: number }; + }; + }>; + } | null; + }; +}; + export type CreateUploadStreamMutationVariables = Exact<{ videoMetadataInput: VideoMetadataInput; }>; @@ -963,6 +1010,127 @@ export type GetShotsQueryResult = Apollo.QueryResult< GetShotsQuery, GetShotsQueryVariables >; +export const GetStreamMonitoringDetailsDocument = gql` + query GetStreamMonitoringDetails($videoId: Int!) { + getVideo(videoId: $videoId) { + id + totalShots + makePercentage + elapsedTime + stream { + homographyHistory { + crop { + left + top + width + height + } + pockets { + left + top + width + height + } + sourcePoints { + topLeft { + x + y + } + topSide { + x + y + } + topRight { + x + y + } + bottomLeft { + x + y + } + bottomSide { + x + y + } + bottomRight { + x + y + } + } + } + linksRequested + uploadsCompleted + segmentProcessingCursor + } + } + } +`; + +/** + * __useGetStreamMonitoringDetailsQuery__ + * + * To run a query within a React component, call `useGetStreamMonitoringDetailsQuery` and pass it any options that fit your needs. + * When your component renders, `useGetStreamMonitoringDetailsQuery` returns an object from Apollo Client that contains loading, error, and data properties + * you can use to render your UI. + * + * @param baseOptions options that will be passed into the query, supported options are listed on: https://www.apollographql.com/docs/react/api/react-hooks/#options; + * + * @example + * const { data, loading, error } = useGetStreamMonitoringDetailsQuery({ + * variables: { + * videoId: // value for 'videoId' + * }, + * }); + */ +export function useGetStreamMonitoringDetailsQuery( + baseOptions: Apollo.QueryHookOptions< + GetStreamMonitoringDetailsQuery, + GetStreamMonitoringDetailsQueryVariables + >, +) { + const options = { ...defaultOptions, ...baseOptions }; + return Apollo.useQuery< + GetStreamMonitoringDetailsQuery, + GetStreamMonitoringDetailsQueryVariables + >(GetStreamMonitoringDetailsDocument, options); +} +export function useGetStreamMonitoringDetailsLazyQuery( + baseOptions?: Apollo.LazyQueryHookOptions< + GetStreamMonitoringDetailsQuery, + GetStreamMonitoringDetailsQueryVariables + >, +) { + const options = { ...defaultOptions, ...baseOptions }; + return Apollo.useLazyQuery< + GetStreamMonitoringDetailsQuery, + GetStreamMonitoringDetailsQueryVariables + >(GetStreamMonitoringDetailsDocument, options); +} +export function useGetStreamMonitoringDetailsSuspenseQuery( + baseOptions?: Apollo.SuspenseQueryHookOptions< + GetStreamMonitoringDetailsQuery, + GetStreamMonitoringDetailsQueryVariables + >, +) { + const options = { ...defaultOptions, ...baseOptions }; + return Apollo.useSuspenseQuery< + GetStreamMonitoringDetailsQuery, + GetStreamMonitoringDetailsQueryVariables + >(GetStreamMonitoringDetailsDocument, options); +} +export type GetStreamMonitoringDetailsQueryHookResult = ReturnType< + typeof useGetStreamMonitoringDetailsQuery +>; +export type GetStreamMonitoringDetailsLazyQueryHookResult = ReturnType< + typeof useGetStreamMonitoringDetailsLazyQuery +>; +export type GetStreamMonitoringDetailsSuspenseQueryHookResult = ReturnType< + typeof useGetStreamMonitoringDetailsSuspenseQuery +>; +export type GetStreamMonitoringDetailsQueryResult = Apollo.QueryResult< + GetStreamMonitoringDetailsQuery, + GetStreamMonitoringDetailsQueryVariables +>; export const CreateUploadStreamDocument = gql` mutation CreateUploadStream($videoMetadataInput: VideoMetadataInput!) { createUploadStream(videoMetadata: $videoMetadataInput) { diff --git a/src/operations/video.gql b/src/operations/video.gql new file mode 100644 index 0000000..2e1e8e1 --- /dev/null +++ b/src/operations/video.gql @@ -0,0 +1,54 @@ +query GetStreamMonitoringDetails($videoId: Int!) { + getVideo(videoId: $videoId) { + id + totalShots + makePercentage + elapsedTime + + stream { + homographyHistory { + crop { + left + top + width + height + } + pockets { + left + top + width + height + } + sourcePoints { + topLeft { + x + y + } + topSide { + x + y + } + topRight { + x + y + } + bottomLeft { + x + y + } + bottomSide { + x + y + } + bottomRight { + x + y + } + } + } + linksRequested + uploadsCompleted + segmentProcessingCursor + } + } +}