fix(ott-2702): added watermark

src/features/StreamPlayer/index.tsx

@@ -1,10 +1,12 @@
-import { isMobileDevice } from 'config/userAgent'
-
 import { Loader } from 'features/Loader'
 import { VideoPlayer } from 'features/VideoPlayer'
 import { useMatchPageStore } from 'features/MatchPage/store'
 import { Name } from 'features/Name'
 
+import { WaterMark } from 'components/WaterMark'
+
+import { isMobileDevice } from 'config/userAgent'
+
 import { REWIND_SECONDS } from './config'
 
 import {
@@ -19,6 +21,7 @@ import {
 } from './styled'
 import type { Props } from './hooks'
 import { useVideoPlayer } from './hooks'
+import { useAuthStore } from '../AuthStore'
 import { Controls } from './components/Controls'
 import RewindMobile from './components/RewindMobile'
 
@@ -27,6 +30,7 @@ import RewindMobile from './components/RewindMobile'
  */
 export const StreamPlayer = (props: Props) => {
   const { profile } = useMatchPageStore()
+  const { user } = useAuthStore()
 
   const {
     activeChapterIndex,
@@ -90,7 +94,11 @@ export const StreamPlayer = (props: Props) => {
       <LoaderWrapper buffering={buffering}>
         <Loader color='#515151' />
       </LoaderWrapper>
-
+      {(profile?.tournament.id === 1136 || profile?.tournament.id === 131)
+          && playing
+          && (
+            <WaterMark value={user?.profile?.sub} />
+          )}
       <VideoPlayer
         width='100%'
         height='100%'