fix(#3099): save match stats

src/config/routes.tsx

@@ -17,8 +17,15 @@ export const APIS = {
   },
 }
 
+const VIEWS_APIS = {
+  preproduction: 'https://views.insports.tv',
+  production: 'https://views.insports.tv',
+  staging: 'https://views.test.insports.tv',
+}
+
 const env = isProduction ? ENV : readSelectedApi() ?? ENV
 
+export const VIEWS_API = VIEWS_APIS[env]
 export const AUTH_SERVICE = APIS[env].auth
 export const API_ROOT = APIS[env].api
 export const DATA_URL = `${API_ROOT}/data`

src/features/MultiSourcePlayer/hooks/index.tsx

@@ -14,9 +14,18 @@ import { useVolume } from 'features/VideoPlayer/hooks/useVolume'
 import { useNoNetworkPopupStore } from 'features/NoNetworkPopup'
 import { useMatchPageStore } from 'features/MatchPage/store'
 
-import { useEventListener, useObjectState } from 'hooks'
+import {
+  useEventListener,
+  useInterval,
+  useObjectState,
+  usePageParams,
+} from 'hooks'
 
-import { MatchInfo } from 'requests'
+import {
+  intervalMs,
+  MatchInfo,
+  saveMatchStats,
+} from 'requests'
 
 import { useProgressChangeHandler } from './useProgressChangeHandler'
 import { usePlayingHandlers } from './usePlayingHandlers'
@@ -63,6 +72,8 @@ export const useMultiSourcePlayer = ({
     playNextEpisode,
   } = useMatchPageStore()
 
+  const { profileId, sportType } = usePageParams()
+
   const numberOfChapters = size(chapters)
   const [
     {
@@ -267,6 +278,27 @@ export const useMultiSourcePlayer = ({
     }
   }, [ready, videoRef])
 
+  // ведем статистику просмотра матча
+  const { start: startCollectingStats, stop: stopCollectingStats } = useInterval({
+    callback: () => {
+      saveMatchStats({
+        matchId: profileId,
+        matchSecond: videoRef.current?.currentTime!,
+        sportType,
+      })
+    },
+    intervalDuration: intervalMs,
+    startImmediate: false,
+  })
+
+  useEffect(() => {
+    if (playing) {
+      startCollectingStats()
+    } else {
+      stopCollectingStats()
+    }
+  }, [playing, startCollectingStats, stopCollectingStats])
+
   return {
     activeChapterIndex,
     activePlayer,

src/features/StreamPlayer/hooks/index.tsx

@@ -11,8 +11,12 @@ import isEmpty from 'lodash/isEmpty'
 
 import { isIOS } from 'config/userAgent'
 
-import { useObjectState } from 'hooks/useObjectState'
+import {
-import { useEventListener } from 'hooks/useEventListener'
+  useObjectState,
+  useEventListener,
+  usePageParams,
+  useInterval,
+} from 'hooks'
 
 import type { TSetCircleAnimation } from 'features/CircleAnimationBar'
 import type { Chapters } from 'features/StreamPlayer/types'
@@ -21,6 +25,8 @@ import { useNoNetworkPopupStore } from 'features/NoNetworkPopup'
 import { useLiveMatch } from 'features/MatchPage/components/LiveMatch/hooks'
 import { useLexicsStore } from 'features/LexicsStore'
 
+import { intervalMs, saveMatchStats } from 'requests'
+
 import { REWIND_SECONDS } from '../config'
 import { useHlsPlayer } from './useHlsPlayer'
 import { useFullscreen } from './useFullscreen'
@@ -88,6 +94,7 @@ export const useVideoPlayer = ({
     selectedPlaylist,
   } = useLiveMatch()
   const { lang } = useLexicsStore()
+  const { profileId, sportType } = usePageParams()
 
   const { url } = chapters[0] ?? { url: '' }
   const numberOfChapters = size(chapters)
@@ -427,6 +434,27 @@ export const useVideoPlayer = ({
     ? 'La transmisión en vivo no está disponible temporalmente en dispositivos iOS'
     : 'Live streaming is temporarily unavailable on iOS devices'
 
+  // ведем статистику просмотра матча
+  const { start: startCollectingStats, stop: stopCollectingStats } = useInterval({
+    callback: () => {
+      saveMatchStats({
+        matchId: profileId,
+        matchSecond: videoRef.current?.currentTime!,
+        sportType,
+      })
+    },
+    intervalDuration: intervalMs,
+    startImmediate: false,
+  })
+
+  useEffect(() => {
+    if (playing) {
+      startCollectingStats()
+    } else {
+      stopCollectingStats()
+    }
+  }, [playing, startCollectingStats, stopCollectingStats])
+
   return {
     activeChapterIndex,
     allPlayedProgress: playedProgress + getActiveChapter().startMs,

src/hooks/index.tsx

@@ -4,3 +4,4 @@ export * from './useStorage'
 export * from './useInterval'
 export * from './useEventListener'
 export * from './useObjectState'
+export * from './usePageParams'

src/requests/index.tsx

@@ -24,3 +24,4 @@ export * from './getMatchPlaylists'
 export * from './getPlayerPlaylists'
 export * from './getSubscriptions'
 export * from './buySubscription'
+export * from './saveMatchStats'

src/requests/saveMatchStats.tsx

@@ -0,0 +1,30 @@
+import { SportTypes, VIEWS_API } from 'config'
+
+import { callApi } from 'helpers'
+
+type Props = {
+  matchId: number,
+  matchSecond: number,
+  sportType: SportTypes,
+}
+
+export const intervalMs = 15000
+
+export const saveMatchStats = ({
+  matchId,
+  matchSecond,
+  sportType,
+}: Props) => {
+  const url = `${VIEWS_API}/user/view`
+
+  const config = {
+    body: {
+      interval: intervalMs / 1000,
+      match_id: matchId,
+      second: matchSecond,
+      sport_id: sportType,
+    },
+  }
+
+  return callApi({ config, url })
+}