fix(refresh): refresh token fix

This reverts commit fc3a3c052c.

.drone.yml

@@ -15,9 +15,28 @@ trigger:
   - refs/heads/master
 
 steps:
-  - name: deploy script
+  - name: npm-install
+    image: node:16-alpine
+    environment:
+      REACT_APP_STRIPE_PK:
+        from_secret: REACT_APP_STRIPE_PK
+    commands:
+      - apk add --no-cache make
+      - npm install --legacy-peer-deps
+
+  - name: make-prod
     image: node:16-alpine
+    environment:
+      REACT_APP_STRIPE_PK:
+        from_secret: REACT_APP_STRIPE_PK
+    commands:
+      - apk add --no-cache make
+      - make prod
+    depends_on:
+      - npm-install
 
+  - name: deploy-prod
+    image: amazon/aws-cli:latest
     environment:
       AWS_ACCESS_KEY_ID:
         from_secret: AWS_ACCESS_KEY_ID
@@ -25,27 +44,193 @@ steps:
         from_secret: AWS_SECRET_ACCESS_KEY
       AWS_DEFAULT_REGION:
         from_secret: AWS_DEFAULT_REGION
+      AWS_MAX_ATTEMPTS: 10
+    commands:
+      - aws s3 sync build s3://insports-prod --delete
+      - aws cloudfront create-invalidation --distribution-id E3KY6BCU3AYHEW --paths "/*"
+    depends_on:
+      - make-prod
+
+  - name: make-auth
+    image: node:16-alpine
+    environment:
       REACT_APP_STRIPE_PK:
         from_secret: REACT_APP_STRIPE_PK
+    commands:
+      - apk add --no-cache make
+      - make auth-production-build
+    depends_on:
+      - npm-install
+
+  - name: deploy-S3-auth
+    image: amazon/aws-cli:latest
+    environment:
+      AWS_ACCESS_KEY_ID:
+        from_secret: AWS_ACCESS_KEY_ID
+      AWS_SECRET_ACCESS_KEY:
+        from_secret: AWS_SECRET_ACCESS_KEY
+      AWS_DEFAULT_REGION:
+        from_secret: AWS_DEFAULT_REGION
+      AWS_MAX_ATTEMPTS: 10
+    commands:
+      - aws s3 sync build_auth s3://insports-auth --delete
+      - aws cloudfront create-invalidation --distribution-id EERIKX9X2SRPJ --paths "/*"
+    depends_on:
+      - make-auth
+
+  - name: deploy-old-auth-server
+    image: node:16-alpine
+    environment:
       SSH_KEY_AUTH:
         from_secret: SSH_KEY_AUTH
-
     commands:
-      - apk add --no-cache aws-cli bash git openssh-client make rsync
-      - npm install --legacy-peer-deps
-      - make prod
-#      - aws s3 sync build s3://insports-prod --delete
-#      - aws cloudfront create-invalidation --distribution-id E3KY6BCU3AYHEW --paths "/*"
-      - aws s3 sync build s3://instat-frontend-test-a --delete
-      - aws cloudfront create-invalidation --distribution-id E1WZHVCHZ48SG6 --paths "/*"
-      - make auth-production-build
+      - apk add --no-cache openssh-client rsync
       - eval $(ssh-agent -s)
       - echo -n "$SSH_KEY_AUTH" | tr -d '\r' | ssh-add -
       - mkdir -p ~/.ssh && chmod 700 ~/.ssh
       - ssh-keyscan auth.insports.tv >> ~/.ssh/known_hosts
       - rsync -v -r -C build_auth/ ubuntu@auth.insports.tv:/home/ubuntu/ott-auth/src/frontend/
-      - rsync -v -r -C build_auth/clients/* ubuntu@auth.insports.tv:/home/ubuntu/ott-auth/src/frontend/templates
-      - ssh ubuntu@auth.insports.tv 'bash -s' < ./run.sh OTT-2535 docker-compose-stage.yaml
+    depends_on:
+      - make-auth
+
+  - name: make-india
+    image: node:16-alpine
+    environment:
+      REACT_APP_STRIPE_PK:
+        from_secret: REACT_APP_STRIPE_PK
+    commands:
+      - apk add --no-cache make
+      - make india-prod
+    depends_on:
+      - npm-install
+
+  - name: deploy-india
+    image: amazon/aws-cli:latest
+    environment:
+      AWS_ACCESS_KEY_ID:
+        from_secret: AWS_ACCESS_KEY_ID
+      AWS_SECRET_ACCESS_KEY:
+        from_secret: AWS_SECRET_ACCESS_KEY
+      AWS_DEFAULT_REGION:
+        from_secret: AWS_DEFAULT_REGION
+      AWS_MAX_ATTEMPTS: 10
+    commands:
+      - aws s3 sync build_india s3://insports-india --delete
+      - aws cloudfront create-invalidation --distribution-id E5DKN8IPOMASO --paths "/*"
+    depends_on:
+      - make-india
+
+  - name: make-facr
+    image: node:16-alpine
+    environment:
+      REACT_APP_STRIPE_PK:
+        from_secret: REACT_APP_STRIPE_PK
+    commands:
+      - apk add --no-cache make
+      - make facr-prod
+    depends_on:
+      - npm-install
+
+  - name: deploy-facr
+    image: amazon/aws-cli:latest
+    environment:
+      AWS_ACCESS_KEY_ID:
+        from_secret: AWS_ACCESS_KEY_ID
+      AWS_SECRET_ACCESS_KEY:
+        from_secret: AWS_SECRET_ACCESS_KEY
+      AWS_DEFAULT_REGION:
+        from_secret: AWS_DEFAULT_REGION
+      AWS_MAX_ATTEMPTS: 10
+    commands:
+      - aws s3 sync build_facr s3://insports-facr-tv --delete
+      - aws cloudfront create-invalidation --distribution-id E1ZYJS9RAJO89D --paths "/*"
+    depends_on:
+      - make-facr
+
+  - name: make-lff
+    image: node:16-alpine
+    environment:
+      REACT_APP_STRIPE_PK:
+        from_secret: REACT_APP_STRIPE_PK
+    commands:
+      - apk add --no-cache make
+      - make lff-prod
+    depends_on:
+      - npm-install
+
+  - name: deploy-lff
+    image: amazon/aws-cli:latest
+    environment:
+      AWS_ACCESS_KEY_ID:
+        from_secret: AWS_ACCESS_KEY_ID
+      AWS_SECRET_ACCESS_KEY:
+        from_secret: AWS_SECRET_ACCESS_KEY
+      AWS_DEFAULT_REGION:
+        from_secret: AWS_DEFAULT_REGION
+      AWS_MAX_ATTEMPTS: 10
+    commands:
+      - aws s3 sync build_lff s3://insports-tv-lff-lv --delete
+      - aws cloudfront create-invalidation --distribution-id E2127IDW4TEH4S --paths "/*"
+    depends_on:
+      - make-lff
+
+  - name: make-diwansport
+    image: node:16-alpine
+    environment:
+      REACT_APP_STRIPE_PK:
+        from_secret: REACT_APP_STRIPE_PK
+    commands:
+      - apk add --no-cache make
+      - make diwansport-prod
+    depends_on:
+      - npm-install
+
+  - name: deploy-diwansport
+    image: amazon/aws-cli:latest
+    environment:
+      AWS_ACCESS_KEY_ID:
+        from_secret: AWS_ACCESS_KEY_ID
+      AWS_SECRET_ACCESS_KEY:
+        from_secret: AWS_SECRET_ACCESS_KEY
+      AWS_DEFAULT_REGION:
+        from_secret: AWS_DEFAULT_REGION
+      AWS_MAX_ATTEMPTS: 10
+    commands:
+      - aws s3 sync build_tunisia s3://insports-diwansport --delete
+      - aws cloudfront create-invalidation --distribution-id E3LKAH6TR4O2JL --paths "/*"  # # diwansport.net
+      - aws cloudfront create-invalidation --distribution-id E3NJ2G0QSB6MVI --paths "/*"  # tunisia.insports.tv
+
+    depends_on:
+      - make-diwansport
+
+  - name: make-fqtv
+    image: node:16-alpine
+    environment:
+      REACT_APP_STRIPE_PK:
+        from_secret: REACT_APP_STRIPE_PK
+    commands:
+      - apk add --no-cache make
+      - make fqtv-prod
+    depends_on:
+      - npm-install
+
+  - name: deploy-fqtv
+    image: amazon/aws-cli:latest
+    environment:
+      AWS_ACCESS_KEY_ID:
+        from_secret: AWS_ACCESS_KEY_ID
+      AWS_SECRET_ACCESS_KEY:
+        from_secret: AWS_SECRET_ACCESS_KEY
+      AWS_DEFAULT_REGION:
+        from_secret: AWS_DEFAULT_REGION
+      AWS_MAX_ATTEMPTS: 10
+    commands:
+      - aws s3 sync build_fqtv s3://insports-fqtv-com-au --delete
+      - aws cloudfront create-invalidation --distribution-id E2MFJBSBIUQSDH --paths "/*"  # # fqtv.insports.tv
+      - aws cloudfront create-invalidation --distribution-id E22TED4Z46Q01V --paths "/*"  # fqtv.com.au
+
+    depends_on:
+      - make-fqtv
 
 ---
 kind: pipeline
@@ -86,53 +271,44 @@ steps:
       - aws s3 sync build s3://instat-frontend-test --delete
       - aws cloudfront create-invalidation --distribution-id E2ZD1DVVFA1ACC --paths "/*"
 
-#---
-#kind: pipeline
-#type: docker
-#name: deploy test-a
-#
-#concurrency:
-#  limit: 1
-#
-#platform:
-#  os: linux
-#  arch: amd64
-#
-#trigger:
-#  ref:
-#  - refs/heads/test-a
-#
-#steps:
-#  - name: deploy script
-#    image: node:16-alpine
-#
-#    environment:
-#      AWS_ACCESS_KEY_ID:
-#        from_secret: AWS_ACCESS_KEY_ID
-#      AWS_SECRET_ACCESS_KEY:
-#        from_secret: AWS_SECRET_ACCESS_KEY
-#      AWS_DEFAULT_REGION:
-#        from_secret: AWS_DEFAULT_REGION
-#      REACT_APP_STRIPE_PK:
-#        from_secret: REACT_APP_STRIPE_PK_TEST
-#      SSH_KEY_AUTH:
-#        from_secret: SSH_KEY_AUTH
-#
-#    commands:
-#      - apk add --no-cache aws-cli bash git openssh-client make rsync
-#      - npm install --legacy-peer-deps
-#      - make build-a
-#      - aws s3 sync build s3://instat-frontend-test-a --delete
-#      - aws cloudfront create-invalidation --distribution-id E1WZHVCHZ48SG6 --paths "/*"
-##      - make auth-build
-##      - eval $(ssh-agent -s)
-##      - echo -n "$SSH_KEY_AUTH" | tr -d '\r' | ssh-add -
-##      - mkdir -p ~/.ssh && chmod 700 ~/.ssh
-##      - ssh-keyscan auth.insports.tv >> ~/.ssh/known_hosts
-##      - rsync -v -r -C build_auth/ ubuntu@auth.insports.tv:/home/ubuntu/ott-auth/src/frontend/
-##      - rsync -v -r -C build_auth/clients/* ubuntu@auth.insports.tv:/home/ubuntu/ott-auth/src/frontend/templates
-##      - ssh ubuntu@auth.insports.tv 'bash -s' < ./run.sh OTT-2535 docker-compose-stage.yaml
+---
+kind: pipeline
+type: docker
+name: deploy test-a
 
+concurrency:
+  limit: 1
+
+platform:
+  os: linux
+  arch: amd64
+
+trigger:
+  ref:
+  - refs/heads/test-a
+
+steps:
+  - name: deploy script
+    image: node:16-alpine
+
+    environment:
+      AWS_ACCESS_KEY_ID:
+        from_secret: AWS_ACCESS_KEY_ID
+      AWS_SECRET_ACCESS_KEY:
+        from_secret: AWS_SECRET_ACCESS_KEY
+      AWS_DEFAULT_REGION:
+        from_secret: AWS_DEFAULT_REGION
+      REACT_APP_STRIPE_PK:
+        from_secret: REACT_APP_STRIPE_PK_TEST
+      SSH_KEY_AUTH:
+        from_secret: SSH_KEY_AUTH
+
+    commands:
+      - apk add --no-cache aws-cli bash git openssh-client make rsync
+      - npm install --legacy-peer-deps
+      - make build-a
+      - aws s3 sync build s3://instat-frontend-test-a --delete
+      - aws cloudfront create-invalidation --distribution-id E1WZHVCHZ48SG6 --paths "/*"
 
 ---
 kind: pipeline
@@ -457,7 +633,7 @@ steps:
 ---
 kind: pipeline
 type: docker
-name: deploy test-auth
+name: deploy test-j
 
 concurrency:
   limit: 1
@@ -468,7 +644,7 @@ platform:
 
 trigger:
   ref:
-  - refs/heads/test-auth
+  - refs/heads/test-j
 
 steps:
   - name: deploy script
@@ -489,11 +665,398 @@ steps:
     commands:
       - apk add --no-cache aws-cli bash git openssh-client make rsync
       - npm install --legacy-peer-deps
+      - make build-j
+      - aws s3 sync build s3://instat-frontend-test-j --delete
+      - aws cloudfront create-invalidation --distribution-id EC35D25OP7FSL --paths "/*"
+
+
+---
+kind: pipeline
+type: docker
+name: deploy test-auth
+
+concurrency:
+  limit: 1
+
+platform:
+  os: linux
+  arch: amd64
+
+trigger:
+  ref:
+  - refs/heads/test-auth
+
+steps:
+  - name: npm-install
+    image: node:16-alpine
+    environment:
+      REACT_APP_STRIPE_PK:
+        from_secret: REACT_APP_STRIPE_PK
+    commands:
+      - apk add --no-cache make
+      - npm install --legacy-peer-deps
+
+  - name: make-auth
+    image: node:16-alpine
+    environment:
+      REACT_APP_STRIPE_PK:
+        from_secret: REACT_APP_STRIPE_PK
+    commands:
+      - apk add --no-cache make
       - make auth-build
+    depends_on:
+      - npm-install
+
+  - name: deploy-S3-auth
+    image: amazon/aws-cli:latest
+    environment:
+      AWS_ACCESS_KEY_ID:
+        from_secret: AWS_ACCESS_KEY_ID
+      AWS_SECRET_ACCESS_KEY:
+        from_secret: AWS_SECRET_ACCESS_KEY
+      AWS_DEFAULT_REGION:
+        from_secret: AWS_DEFAULT_REGION
+      AWS_MAX_ATTEMPTS: 10
+    commands:
+      - aws s3 sync build_auth s3://insports-auth-test --delete
+      - aws cloudfront create-invalidation --distribution-id E10YI3RFOZZDLZ --paths "/*"
+    depends_on:
+      - make-auth
+
+
+---
+kind: pipeline
+type: docker
+name: deploy auth prod
+
+concurrency:
+  limit: 1
+
+platform:
+  os: linux
+  arch: amd64
+
+trigger:
+  ref:
+  - refs/heads/auth
+
+steps:
+  - name: npm-install
+    image: node:16-alpine
+    environment:
+      REACT_APP_STRIPE_PK:
+        from_secret: REACT_APP_STRIPE_PK
+    commands:
+      - apk add --no-cache make
+      - npm install --legacy-peer-deps
+
+  - name: make-auth
+    image: node:16-alpine
+    environment:
+      REACT_APP_STRIPE_PK:
+        from_secret: REACT_APP_STRIPE_PK
+    commands:
+      - apk add --no-cache make
+      - make auth-production-build
+    depends_on:
+      - npm-install
+
+  - name: deploy-S3-auth
+    image: amazon/aws-cli:latest
+    environment:
+      AWS_ACCESS_KEY_ID:
+        from_secret: AWS_ACCESS_KEY_ID
+      AWS_SECRET_ACCESS_KEY:
+        from_secret: AWS_SECRET_ACCESS_KEY
+      AWS_DEFAULT_REGION:
+        from_secret: AWS_DEFAULT_REGION
+      AWS_MAX_ATTEMPTS: 10
+    commands:
+      - aws s3 sync build_auth s3://insports-auth --delete
+      - aws cloudfront create-invalidation --distribution-id EERIKX9X2SRPJ --paths "/*"
+    depends_on:
+      - make-auth
+
+  - name: deploy-old-auth-server
+    image: node:16-alpine
+    environment:
+      SSH_KEY_AUTH:
+        from_secret: SSH_KEY_AUTH
+    commands:
+      - apk add --no-cache openssh-client rsync
       - eval $(ssh-agent -s)
       - echo -n "$SSH_KEY_AUTH" | tr -d '\r' | ssh-add -
       - mkdir -p ~/.ssh && chmod 700 ~/.ssh
-      - ssh-keyscan auth.test.insports.tv >> ~/.ssh/known_hosts
-      - rsync -v -r -C build_auth/ ubuntu@auth.test.insports.tv:/home/ubuntu/ott-auth/src/frontend/
-      - rsync -v -r -C build_auth/clients/* ubuntu@auth.test.insports.tv:/home/ubuntu/ott-auth/src/frontend/templates
-      - ssh ubuntu@auth.test.insports.tv 'bash -s' < ./run.sh OTT-2535-test docker-compose-test.yaml
+      - ssh-keyscan auth.insports.tv >> ~/.ssh/known_hosts
+      - rsync -v -r -C build_auth/ ubuntu@auth.insports.tv:/home/ubuntu/ott-auth/src/frontend/
+    depends_on:
+      - make-auth
+
+---
+kind: pipeline
+type: docker
+name: deploy diwan.insports.tv
+
+concurrency:
+  limit: 1
+
+platform:
+  os: linux
+  arch: amd64
+
+trigger:
+  ref:
+  - refs/heads/diwan.insports.tv
+
+steps:
+  - name: npm-install
+    image: node:16-alpine
+    environment:
+      REACT_APP_STRIPE_PK:
+        from_secret: REACT_APP_STRIPE_PK
+    commands:
+      - apk add --no-cache make
+      - npm install --legacy-peer-deps
+
+  - name: make-diwansport
+    image: node:16-alpine
+    environment:
+      REACT_APP_STRIPE_PK:
+        from_secret: REACT_APP_STRIPE_PK
+    commands:
+      - apk add --no-cache make
+      - make diwansport-prod
+    depends_on:
+      - npm-install
+
+  - name: deploy-diwansport
+    image: amazon/aws-cli:latest
+    environment:
+      AWS_ACCESS_KEY_ID:
+        from_secret: AWS_ACCESS_KEY_ID
+      AWS_SECRET_ACCESS_KEY:
+        from_secret: AWS_SECRET_ACCESS_KEY
+      AWS_DEFAULT_REGION:
+        from_secret: AWS_DEFAULT_REGION
+      AWS_MAX_ATTEMPTS: 10
+    commands:
+      - aws s3 sync build_tunisia s3://insports-diwansport --delete
+      - aws cloudfront create-invalidation --distribution-id E3LKAH6TR4O2JL --paths "/*"  # # diwansport.net
+      - aws cloudfront create-invalidation --distribution-id E3NJ2G0QSB6MVI --paths "/*"  # tunisia.insports.tv
+
+    depends_on:
+      - make-diwansport
+
+---
+kind: pipeline
+type: docker
+name: deploy fqtv.insports.tv
+
+concurrency:
+  limit: 1
+
+platform:
+  os: linux
+  arch: amd64
+
+trigger:
+  ref:
+  - refs/heads/fqtv.insports.tv
+
+steps:
+  - name: npm-install
+    image: node:16-alpine
+    environment:
+      REACT_APP_STRIPE_PK:
+        from_secret: REACT_APP_STRIPE_PK
+    commands:
+      - apk add --no-cache make
+      - npm install --legacy-peer-deps
+
+  - name: make-fqtv
+    image: node:16-alpine
+    environment:
+      REACT_APP_STRIPE_PK:
+        from_secret: REACT_APP_STRIPE_PK
+    commands:
+      - apk add --no-cache make
+      - make fqtv-prod
+    depends_on:
+      - npm-install
+
+  - name: deploy-fqtv
+    image: amazon/aws-cli:latest
+    environment:
+      AWS_ACCESS_KEY_ID:
+        from_secret: AWS_ACCESS_KEY_ID
+      AWS_SECRET_ACCESS_KEY:
+        from_secret: AWS_SECRET_ACCESS_KEY
+      AWS_DEFAULT_REGION:
+        from_secret: AWS_DEFAULT_REGION
+      AWS_MAX_ATTEMPTS: 10
+    commands:
+      - aws s3 sync build_fqtv s3://insports-fqtv-com-au --delete
+      - aws cloudfront create-invalidation --distribution-id E2MFJBSBIUQSDH --paths "/*"  # # fqtv.insports.tv
+      - aws cloudfront create-invalidation --distribution-id E22TED4Z46Q01V --paths "/*"  # fqtv.com.au
+
+    depends_on:
+      - make-fqtv
+
+---
+kind: pipeline
+type: docker
+name: deploy india.insports.tv
+
+concurrency:
+  limit: 1
+
+platform:
+  os: linux
+  arch: amd64
+
+trigger:
+  ref:
+  - refs/heads/india.insports.tv
+
+steps:
+  - name: npm-install
+    image: node:16-alpine
+    environment:
+      REACT_APP_STRIPE_PK:
+        from_secret: REACT_APP_STRIPE_PK
+    commands:
+      - apk add --no-cache make
+      - npm install --legacy-peer-deps
+
+  - name: make-india
+    image: node:16-alpine
+    environment:
+      REACT_APP_STRIPE_PK:
+        from_secret: REACT_APP_STRIPE_PK
+    commands:
+      - apk add --no-cache make
+      - make india-prod
+    depends_on:
+      - npm-install
+
+  - name: deploy-india
+    image: amazon/aws-cli:latest
+    environment:
+      AWS_ACCESS_KEY_ID:
+        from_secret: AWS_ACCESS_KEY_ID
+      AWS_SECRET_ACCESS_KEY:
+        from_secret: AWS_SECRET_ACCESS_KEY
+      AWS_DEFAULT_REGION:
+        from_secret: AWS_DEFAULT_REGION
+      AWS_MAX_ATTEMPTS: 10
+    commands:
+      - aws s3 sync build_india s3://insports-india --delete
+      - aws cloudfront create-invalidation --distribution-id E5DKN8IPOMASO --paths "/*"
+    depends_on:
+      - make-india
+
+---
+kind: pipeline
+type: docker
+name: deploy tv.rustatsport.ru
+
+concurrency:
+  limit: 1
+
+platform:
+  os: linux
+  arch: amd64
+
+trigger:
+  ref:
+  - refs/heads/tv.rustatsport.ru
+
+steps:
+  - name: npm-install
+    image: node:16-alpine
+    environment:
+      REACT_APP_STRIPE_PK:
+        from_secret: REACT_APP_STRIPE_PK
+    commands:
+      - apk add --no-cache make
+      - npm install --legacy-peer-deps
+
+  - name: make-rustat
+    image: node:16-alpine
+    environment:
+      REACT_APP_STRIPE_PK:
+        from_secret: REACT_APP_STRIPE_PK
+    commands:
+      - apk add --no-cache make
+      - make rustat-prod
+    depends_on:
+      - npm-install
+
+  - name: deploy-rustat
+    image: amazon/aws-cli:latest
+    environment:
+      AWS_ACCESS_KEY_ID:
+        from_secret: AWS_ACCESS_KEY_ID
+      AWS_SECRET_ACCESS_KEY:
+        from_secret: AWS_SECRET_ACCESS_KEY
+      AWS_DEFAULT_REGION:
+        from_secret: AWS_DEFAULT_REGION
+      AWS_MAX_ATTEMPTS: 10
+    commands:
+      - aws s3 sync build_rustat s3://insports-tv-rustatsport --delete
+      - aws cloudfront create-invalidation --distribution-id E15IFY23VM147K --paths "/*"
+    depends_on:
+      - make-rustat
+
+---
+kind: pipeline
+type: docker
+name: deploy insport.live
+
+concurrency:
+  limit: 1
+
+platform:
+  os: linux
+  arch: amd64
+
+trigger:
+  ref:
+  - refs/heads/insport.live
+
+steps:
+  - name: npm-install
+    image: node:16-alpine
+    environment:
+      REACT_APP_STRIPE_PK:
+        from_secret: REACT_APP_STRIPE_PK
+    commands:
+      - apk add --no-cache make
+      - npm install --legacy-peer-deps
+
+  - name: make-insport-live
+    image: node:16-alpine
+    environment:
+      REACT_APP_STRIPE_PK:
+        from_secret: REACT_APP_STRIPE_PK
+    commands:
+      - apk add --no-cache make
+      - make insport-live-prod
+    depends_on:
+      - npm-install
+
+  - name: deploy-insport-live
+    image: amazon/aws-cli:latest
+    environment:
+      AWS_ACCESS_KEY_ID:
+        from_secret: AWS_ACCESS_KEY_ID
+      AWS_SECRET_ACCESS_KEY:
+        from_secret: AWS_SECRET_ACCESS_KEY
+      AWS_DEFAULT_REGION:
+        from_secret: AWS_DEFAULT_REGION
+      AWS_MAX_ATTEMPTS: 10
+    commands:
+      - aws s3 sync build_insport_live s3://insports-live --delete
+      - aws cloudfront create-invalidation --distribution-id E1LBC88VYP6XVB --paths "/*"
+    depends_on:
+      - make-insport-live

.eslintrc

@@ -11,6 +11,7 @@
     "postro4no"
   ],
   "rules": {
+    "@typescript-eslint/no-explicit-any": "warn",
     "@typescript-eslint/array-type": [
       "warn",
       { "default" : "generic" }
@@ -79,8 +80,16 @@
     ],
     "typescript-sort-keys/interface": 1,
     "typescript-sort-keys/string-enum": 1,
-
+    "react/function-component-definition": [
+      2,
+      {
+        "namedComponents": "arrow-function",
+        "unnamedComponents": "arrow-function"
+      },
+    ],
+    "react/jsx-no-useless-fragment": [2, { "allowExpressions": true }],
     "camelcase": "off",
+    "default-param-last": 0,
     "import/no-unresolved": "off",
     "import/prefer-default-export": "off",
     "indent": "off",
@@ -93,6 +102,7 @@
     "react/prop-types": "off",
     "react/react-in-jsx-scope": "off",
     "react/require-default-props": "off",
-    "semi": "off"
+    "semi": "off",
+    "no-multiple-empty-lines":["error",{ "max":1 }]
   }
 }

.gitignore

@@ -7,10 +7,11 @@
 
 # testing
 /coverage
+/cypress/videos
+/cypress/screenshots
 
 # production
-/build
-/build_auth
+/build*
 
 # misc
 .DS_Store
@@ -29,3 +30,6 @@ yarn.lock
 # IntelliJ IDEA products
 .idea
 .eslintcache
+
+# ssl keys
+*.pem

Makefile

@@ -19,7 +19,7 @@ build-stage: clean
 	REACT_APP_TYPE=ott \
 	REACT_APP_ENV=preproduction \
 	REACT_APP_CLIENT=insports \
-	REACT_APP_STRIPE_PK=pk_live_51J5TEYEDSxVnTgDW7v2lF8GGogrm7XaaICZ9CN876sITIBBauZgB2ommUTUOiY868jzpbhQjZcoBOjIRX5Vs54Aq00y4C3USyB \
+	REACT_APP_STRIPE_PK=pk_live_51J5TEYEDSxVnTgDW5XxhC6ntKZKddXgKHq5HOCDmJTdfSKluMYCdLHOcUA3Miuy8HesxG1eS4c0dQRQpMsEHRrQL00USpu5xIq \
 	npm run build
 
 build-a: clean
@@ -85,6 +85,13 @@ build-i: clean
 	REACT_APP_STAGE=test-i \
 	npm run build
 
+build-j: clean
+	REACT_APP_TYPE=ott \
+	REACT_APP_ENV=staging \
+	REACT_APP_CLIENT=insports \
+	REACT_APP_STAGE=test-j \
+	npm run build
+
 auth-build:
 	rm -rf build_auth
 
@@ -113,14 +120,38 @@ auth-production-build:
 
 facr-build: clean
 	REACT_APP_TYPE=ott \
-	REACT_APP_ENV=staging \
-	REACT_APP_CLIENT=facr \
-	npm run build
+    REACT_APP_ENV=staging \
+    REACT_APP_CLIENT=facr \
+    npm run build
+
+india-build: clean
+	REACT_APP_TYPE=ott \
+    REACT_APP_ENV=staging \
+    REACT_APP_CLIENT=india \
+    npm run build
+
+tunisia-build: clean
+	REACT_APP_TYPE=ott \
+    REACT_APP_ENV=staging \
+    REACT_APP_CLIENT=tunisia \
+    npm run build
+
+fqtv-build: clean
+	REACT_APP_TYPE=ott \
+    REACT_APP_ENV=staging \
+    REACT_APP_CLIENT=fqtv \
+    npm run build
 
 lff-build: clean
 	REACT_APP_TYPE=ott \
-	REACT_APP_ENV=staging \
+    REACT_APP_ENV=staging \
 	REACT_APP_CLIENT=lff \
+    npm run build
+
+rustat-build: clean
+	REACT_APP_TYPE=ott \
+	REACT_APP_ENV=staging \
+	REACT_APP_CLIENT=rustat \
 	npm run build
 
 .PHONY: build
@@ -129,76 +160,86 @@ prod: clean
 	REACT_APP_TYPE=ott \
 	REACT_APP_ENV=production \
 	REACT_APP_CLIENT=insports \
-	REACT_APP_STRIPE_PK=pk_live_51J5TEYEDSxVnTgDW7v2lF8GGogrm7XaaICZ9CN876sITIBBauZgB2ommUTUOiY868jzpbhQjZcoBOjIRX5Vs54Aq00y4C3USyB \
+	REACT_APP_STRIPE_PK=pk_live_51J5TEYEDSxVnTgDW5XxhC6ntKZKddXgKHq5HOCDmJTdfSKluMYCdLHOcUA3Miuy8HesxG1eS4c0dQRQpMsEHRrQL00USpu5xIq \
 	npm run build && cp -r .well-known build
 
-# 	rsync -zavP --delete-before build/ -e 'ssh -p 666' ott@de.instat.tv:/usr/local/www/ott/wwwroot/
-# 	rsync -zavP --delete-before build/ -e 'ssh -p 666' ott@fr.instat.tv:/usr/local/www/ott/wwwroot/
-# 	rsync -zavP --delete-before build/ -e 'ssh -p 666' ott@137.74.33.74:/usr/local/www/ott/wwwroot/
-
 preprod: clean
 	REACT_APP_TYPE=ott \
 	REACT_APP_ENV=preproduction \
 	REACT_APP_STAGE=test \
 	REACT_APP_CLIENT=insports \
-	REACT_APP_STRIPE_PK=pk_live_ANI76cBhSo69DZUxPmyRVIZW \
+	REACT_APP_STRIPE_PK=pk_live_51J5TEYEDSxVnTgDW5XxhC6ntKZKddXgKHq5HOCDmJTdfSKluMYCdLHOcUA3Miuy8HesxG1eS4c0dQRQpMsEHRrQL00USpu5xIq \
 	npm run build
 
-facr-prod: clean
+india-prod:
+	rm -rf build_india && \
+    REACT_APP_TYPE=ott \
+    REACT_APP_ENV=production \
+    REACT_APP_CLIENT=india \
+    REACT_APP_STRIPE_PK=pk_live_51J5TEYEDSxVnTgDW5XxhC6ntKZKddXgKHq5HOCDmJTdfSKluMYCdLHOcUA3Miuy8HesxG1eS4c0dQRQpMsEHRrQL00USpu5xIq \
+    BUILD_PATH=build_india \
+    npm run build && cp -r .well-known build_india
+
+facr-prod:
+	rm -rf build_facr && \
 	REACT_APP_TYPE=ott \
 	REACT_APP_ENV=production \
-	REACT_APP_STRIPE_PK=pk_live_51J5TEYEDSxVnTgDW7v2lF8GGogrm7XaaICZ9CN876sITIBBauZgB2ommUTUOiY868jzpbhQjZcoBOjIRX5Vs54Aq00y4C3USyB \
+	REACT_APP_STRIPE_PK=pk_live_51J5TEYEDSxVnTgDW5XxhC6ntKZKddXgKHq5HOCDmJTdfSKluMYCdLHOcUA3Miuy8HesxG1eS4c0dQRQpMsEHRrQL00USpu5xIq \
 	REACT_APP_CLIENT=facr \
-	npm run build
-
-	rsync -zavP --delete-before build/ -e 'ssh -p 666' ott@de.instat.tv:/usr/local/www/ott/facr-wwwroot/
-	rsync -zavP --delete-before build/ -e 'ssh -p 666' ott@fr.instat.tv:/usr/local/www/ott/facr-wwwroot/
-	rsync -zavP --delete-before build/ -e 'ssh -p 666' ott@137.74.33.74:/usr/local/www/ott/facr-wwwroot/
+	BUILD_PATH=build_facr \
+	npm run build && cp -r .well-known build_facr
 
-lff-prod: clean
+lff-prod:
+	rm -rf build_lff && \
 	REACT_APP_TYPE=ott \
 	REACT_APP_ENV=production \
-	REACT_APP_STRIPE_PK=pk_live_51J5TEYEDSxVnTgDW7v2lF8GGogrm7XaaICZ9CN876sITIBBauZgB2ommUTUOiY868jzpbhQjZcoBOjIRX5Vs54Aq00y4C3USyB \
+	REACT_APP_STRIPE_PK=pk_live_51J5TEYEDSxVnTgDW5XxhC6ntKZKddXgKHq5HOCDmJTdfSKluMYCdLHOcUA3Miuy8HesxG1eS4c0dQRQpMsEHRrQL00USpu5xIq \
 	REACT_APP_CLIENT=lff \
-	npm run build
-
-	rsync -zavP --delete-before build/ -e 'ssh -p 666' ott@de.instat.tv:/usr/local/www/ott/lff-wwwroot/
-	rsync -zavP --delete-before build/ -e 'ssh -p 666' ott@fr.instat.tv:/usr/local/www/ott/lff-wwwroot/
-	rsync -zavP --delete-before build/ -e 'ssh -p 666' ott@137.74.33.74:/usr/local/www/ott/lff-wwwroot/
-
-deploy-all: prod preprod facr-prod lff-prod
-
-stage: build-stage
-	rsync -zavP --delete-before build/ -e 'ssh -p 666' ott-staging@137.74.33.74:/usr/local/www/ott-staging/wwwroot/
-
-a-stage: build-a
-	rsync -zavP --delete-before build/ -e 'ssh -p 666' ott-staging@137.74.33.74:/usr/local/www/ott-staging/a-wwwroot/
-
-b-stage: build-b
-	rsync -zavP --delete-before build/ -e 'ssh -p 666' ott-staging@137.74.33.74:/usr/local/www/ott-staging/b-wwwroot/
-
-c-stage: build-c
-	rsync -zavP --delete-before build/ -e 'ssh -p 666' ott-staging@137.74.33.74:/usr/local/www/ott-staging/c-wwwroot/
-
-d-stage: build-d
-	rsync -zavP --delete-before build/ -e 'ssh -p 666' ott-staging@137.74.33.74:/usr/local/www/ott-staging/d-wwwroot/
+	BUILD_PATH=build_lff \
+	npm run build && cp -r .well-known build_lff
 
-e-stage: build-e
-	rsync -zavP --delete-before build/ -e 'ssh -p 666' ott-staging@137.74.33.74:/usr/local/www/ott-staging/e-wwwroot/
+diwansport-prod:
+	rm -rf build_tunisia && \
+	REACT_APP_TYPE=ott \
+	REACT_APP_ENV=production \
+	REACT_APP_STRIPE_PK=pk_live_51J5TEYEDSxVnTgDW5XxhC6ntKZKddXgKHq5HOCDmJTdfSKluMYCdLHOcUA3Miuy8HesxG1eS4c0dQRQpMsEHRrQL00USpu5xIq \
+	REACT_APP_CLIENT=tunisia \
+	BUILD_PATH=build_tunisia \
+	npm run build && cp -r .well-known build_tunisia
 
-f-stage: build-f
-	rsync -zavP --delete-before build/ -e 'ssh -p 666' ott-staging@137.74.33.74:/usr/local/www/ott-staging/f-wwwroot/
+fqtv-prod:
+	rm -rf build_fqtv && \
+	REACT_APP_TYPE=ott \
+	REACT_APP_ENV=production \
+	REACT_APP_STRIPE_PK=pk_live_51J5TEYEDSxVnTgDW5XxhC6ntKZKddXgKHq5HOCDmJTdfSKluMYCdLHOcUA3Miuy8HesxG1eS4c0dQRQpMsEHRrQL00USpu5xIq \
+	REACT_APP_CLIENT=fqtv \
+	BUILD_PATH=build_fqtv \
+	npm run build && cp -r .well-known build_fqtv
 
-g-stage: build-g
-	rsync -zavP --delete-before build/ -e 'ssh -p 666' ott-staging@137.74.33.74:/usr/local/www/ott-staging/g-wwwroot/
+rustat-prod:
+	rm -rf build_rustat && \
+	REACT_APP_TYPE=ott \
+	REACT_APP_ENV=production \
+	REACT_APP_CLIENT=rustat \
+	REACT_APP_STRIPE_PK=pk_live_51J5TEYEDSxVnTgDW5XxhC6ntKZKddXgKHq5HOCDmJTdfSKluMYCdLHOcUA3Miuy8HesxG1eS4c0dQRQpMsEHRrQL00USpu5xIq \
+	BUILD_PATH=build_rustat \
+	npm run build && cp -r .well-known build_rustat
 
-h-stage: build-h
-	rsync -zavP --delete-before build/ -e 'ssh -p 666' ott-staging@137.74.33.74:/usr/local/www/ott-staging/h-wwwroot/
+insport-live-prod:
+	rm -rf build_insport_live && \
+	REACT_APP_TYPE=ott \
+	REACT_APP_ENV=staging \
+	REACT_APP_CLIENT=lff \
+	REACT_APP_STRIPE_PK=pk_live_51J5TEYEDSxVnTgDW5XxhC6ntKZKddXgKHq5HOCDmJTdfSKluMYCdLHOcUA3Miuy8HesxG1eS4c0dQRQpMsEHRrQL00USpu5xIq \
+	BUILD_PATH=build_insport_live \
+	npm run build && cp -r .well-known build_insport_live
 
-i-stage: build-i
-	rsync -zavP --delete-before build/ -e 'ssh -p 666' ott-staging@137.74.33.74:/usr/local/www/ott-staging/i-wwwroot/
+deploy-all: prod preprod facr-prod lff-prod diwansport-prod india-prod fqtv-prod rustat-prod
 
 test:
 	npm test
 
 .PHONY: test
+
+generate-ssl-keys:
+	openssl req -x509 -newkey rsa:2048 -keyout key.pem -out cert.pem -days 365

package.json

@@ -4,6 +4,7 @@
   "private": true,
   "scripts": {
     "start": "react-scripts start",
+    "start-https": "export PORT=443 HTTPS=true&&SSL_CRT_FILE=cert.pem&&SSL_KEY_FILE=key.pem react-scripts start",
     "build": "GENERATE_SOURCEMAP=false react-scripts build && gzipper --verbose ./build",
     "test": "react-scripts test --testMatch '**/__tests__/*' --passWithNoTests --watchAll=false",
     "test:watch": "react-scripts test --testMatch '**/__tests__/*'",
@@ -16,14 +17,20 @@
     "test:auth": "REACT_APP_TYPE=auth-service react-scripts test",
     "facr": "REACT_APP_CLIENT=facr react-scripts start",
     "lff": "REACT_APP_CLIENT=lff react-scripts start",
+    "india": "REACT_APP_CLIENT=india react-scripts start",
+    "tunisia": "REACT_APP_CLIENT=tunisia react-scripts start",
+    "fqtv": "REACT_APP_CLIENT=fqtv react-scripts start",
     "insports": "REACT_APP_CLIENT=insports react-scripts start"
   },
   "dependencies": {
-    "@jonkoops/matomo-tracker-react": "^0.7.0",
+    "@reactour/tour": "^3.3.0",
+    "@sentry/react": "^7.53.1",
     "@stripe/react-stripe-js": "^1.4.0",
     "@stripe/stripe-js": "^1.13.2",
     "babel-polyfill": "^6.26.0",
     "date-fns": "^2.14.0",
+    "dueljs": "^1.2.7",
+    "eslint-plugin-typescript-sort-keys": "^2.3.0",
     "history": "^4.10.1",
     "hls.js": "^1.1.1",
     "lodash": "^4.17.15",
@@ -32,11 +39,12 @@
     "react": "^17.0.2",
     "react-datepicker": "^3.1.3",
     "react-dom": "^17.0.2",
+    "react-ga": "^3.3.1",
+    "react-query": "^3.39.3",
     "react-router": "^5.2.0",
     "react-router-dom": "^5.2.0",
     "react-scripts": "^5.0.1",
     "react-window": "^1.8.6",
-    "react-youtube": "^7.14.0",
     "recoil": "^0.7.4",
     "screenfull": "^5.0.2",
     "styled-components": "^5.3.3",
@@ -49,10 +57,10 @@
     "@storybook/addon-actions": "^6.3.12",
     "@storybook/addon-docs": "^6.3.12",
     "@storybook/addon-links": "^5.3.19",
-    "@storybook/addons": "^5.3.19",
+    "@storybook/addons": "^7.0.2",
     "@storybook/preset-create-react-app": "^3.0.0",
     "@storybook/preset-typescript": "^3.0.0",
-    "@storybook/react": "^6.3.12",
+    "@storybook/react": "^7.0.2",
     "@testing-library/jest-dom": "^5.15.0",
     "@testing-library/react": "^12.1.2",
     "@testing-library/user-event": "^7.1.2",
@@ -69,8 +77,8 @@
     "@types/react-window": "^1.8.5",
     "@types/styled-components": "^5.1.15",
     "commitizen": "^4.2.4",
-    "eslint": "^7.0.1",
-    "eslint-config-airbnb": "18.2.1",
+    "eslint": "^8.38.0",
+    "eslint-config-airbnb": "^19.0.4",
     "eslint-config-react-app": "^7.0.1",
     "eslint-plugin-import": "^2.22.1",
     "eslint-plugin-jsx-a11y": "^6.4.1",
@@ -78,13 +86,12 @@
     "eslint-plugin-react": "^7.21.5",
     "eslint-plugin-react-hooks": "^4.2.0",
     "eslint-plugin-sort-destructure-keys": "^1.3.5",
-    "eslint-plugin-typescript-sort-keys": "^1.5.0",
     "fork-ts-checker-webpack-plugin": "^7.2.13",
     "gzipper": "^3.7.0",
     "husky": "^4.2.5",
     "lint-staged": "^10.2.7",
     "miragejs": "^0.1.45",
-    "storybook-addon-styled-component-theme": "^1.3.0",
+    "storybook-addon-styled-component-theme": "^2.0.0",
     "stylelint": "^13.13.1",
     "stylelint-config-recommended": "^5.0.0",
     "stylelint-config-styled-components": "^0.1.1",

public/ads.txt

@@ -0,0 +1 @@
+google.com, pub-6802442215403184, DIRECT, f08c47fec0942fa0

public/apple-app-site-association

@@ -0,0 +1,9 @@
+{
+	"applinks": {
+		"apps": [],
+		"details": [{
+			"appID": "2X9NY5X2LZ.com.insports.ott",
+			"paths": ["*"]
+		}]
+	}
+}

public/clients/india/favicon/browserconfig.xml

@@ -0,0 +1,12 @@
+<?xml version="1.0" encoding="utf-8"?>
+<browserconfig>
+    <msapplication>
+        <tile>
+            <square70x70logo src="/mstile-70x70.png"/>
+            <square144x144logo src="/mstile-144x144.png"/>
+            <square150x150logo src="/mstile-150x150.png"/>
+            <square310x310logo src="/mstile-310x310.png"/>
+            <TileColor>#da532c</TileColor>
+        </tile>
+    </msapplication>
+</browserconfig>

public/clients/india/favicon/manifest.json

@@ -0,0 +1,19 @@
+{
+  "name": "",
+  "short_name": "",
+  "icons": [
+    {
+      "src": "/android-chrome-192x192.png",
+      "sizes": "192x192",
+      "type": "image/png"
+    },
+    {
+      "src": "/android-chrome-512x512.png",
+      "sizes": "512x512",
+      "type": "image/png"
+    }
+  ],
+  "theme_color": "#ffffff",
+  "background_color": "#ffffff",
+  "display": "standalone"
+}

public/clients/india/favicon/safari-pinned-tab.svg

@@ -0,0 +1,18 @@
+<?xml version="1.0" standalone="no"?>
+<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 20010904//EN" "http://www.w3.org/TR/2001/REC-SVG-20010904/DTD/svg10.dtd">
+<svg version="1.0" xmlns="http://www.w3.org/2000/svg" width="700.000000pt" height="700.000000pt" viewBox="0 0 700.000000 700.000000" preserveAspectRatio="xMidYMid meet">
+  <metadata>
+Created by potrace 1.14, written by Peter Selinger 2001-2017
+</metadata>
+  <g transform="translate(0.000000,700.000000) scale(0.100000,-0.100000)" fill="#000000" stroke="none">
+    <path d="M1499 6996 c-2 -2 -59 -6 -125 -9 -247 -12 -462 -57 -614 -129 -64
+-30 -206 -123 -265 -173 -105 -89 -173 -164 -247 -270 -153 -219 -210 -411
+-235 -790 -11 -161 -10 -4130 0 -4270 12 -158 20 -222 43 -331 60 -297 246
+-573 515 -766 182 -130 345 -193 584 -225 22 -2 51 -6 65 -8 124 -17 518 -20
+2260 -20 1773 0 2220 4 2295 19 11 2 45 7 75 10 75 9 120 17 190 36 121 32
+186 61 300 129 87 53 77 46 155 109 140 114 277 283 353 437 83 166 119 330
+139 630 11 160 10 4107 0 4260 -29 420 -108 642 -311 880 -175 205 -390 346
+-626 412 -47 13 -107 26 -135 29 -27 4 -52 8 -55 9 -3 2 -44 6 -90 10 -47 4
+-96 9 -110 13 -26 6 -4154 14 -4161 8z" />
+  </g>
+</svg>

public/clients/insports/privacy-policy-and-statement.html

@@ -86,7 +86,8 @@
       </p>
 
       <p>
-        (inSports TV also referred to as "us", "we", "our" or "the company"; refers to InStat TV Limited)
+        (inSports TV also referred to as "us", "we", "our" or "the company";
+        refers to InSport TV Limited)
       </p>
 
       <p
@@ -105,11 +106,11 @@
             font-family: 'Trebuchet MS', sans-serif;
             color: black;
           "
-          >inSports TV is committed to the privacy of those that we engage with and
-          this statements details our approach. While using this site or
+          >inSports TV is committed to the privacy of those that we engage with
+          and this statements details our approach. While using this site or
           providing personal data to us in the course of business, we will
-          manage your data in accordance with this privacy statement.</span
-        >
+          manage your data in accordance with this privacy statement.
+        </span>
       </p>
 
       <ul style="margin-top: 0in" type="disc">
@@ -174,13 +175,12 @@
             font-family: 'Trebuchet MS', sans-serif;
             color: black;
           "
-          >inSports TV provides an online platform that allows to broadcast sports
-          video content. This is a legitimate interest pursued by inSports TV.
-          Personal data processed by the business is done so in accordance with
-          current Data Protection Regulation and GDPR.</span
+          >inSports TV provides an online platform that allows to broadcast
+          sports video content. This is a legitimate interest pursued by
+          inSports TV. Personal data processed by the business is done so in
+          accordance with current Data Protection Regulation and GDPR.</span
         >
       </p>
-
       <p
         style="
           margin-top: 22.5pt;
@@ -665,8 +665,8 @@
             color: black;
           "
           >Personal data submitted through this site may be transferred to third
-          party service providers or to other companies within the inSports group
-          of companies that are outside of the state, and outside of the
+          party service providers or to other companies within the inSports
+          group of companies that are outside of the state, and outside of the
           European Economic Area (EEA). Where you request goods or services to
           be provided outside the EEA (European Economic Area), or to be
           delivered in conjunction with others outside of the EEA, personal data
@@ -763,14 +763,15 @@
             font-family: 'Trebuchet MS', sans-serif;
             color: black;
           "
-          >inSports TV have implemented generally accepted standards of technology
-          and operational security to protect personal data from alteration,
-          unauthorized disclosure or destruction, and from use for unauthorized
-          purposes. Furthermore, we have taken measures to ensure that contracts
-          with all third parties that provide technical and processing services
-          include terms that specify appropriate technical and organizational
-          security measures to prevent accidental, unauthorized or unlawful
-          disclosure or processing of personal data.</span
+          >inSports TV have implemented generally accepted standards of
+          technology and operational security to protect personal data from
+          alteration, unauthorized disclosure or destruction, and from use for
+          unauthorized purposes. Furthermore, we have taken measures to ensure
+          that contracts with all third parties that provide technical and
+          processing services include terms that specify appropriate technical
+          and organizational security measures to prevent accidental,
+          unauthorized or unlawful disclosure or processing of personal
+          data.</span
         >
       </p>
 
@@ -1236,31 +1237,14 @@
         >
       </p>
 
-      <p style="margin-bottom: 0in; line-height: normal; background: #f2f2f2">
-        <span
-          style="
-            font-size: 9pt;
-            font-family: 'Trebuchet MS', sans-serif;
-            color: black;
-          "
-          >© inSportsTV.com All right reserved.</span
-        >
-      </p>
-    </div>
-    <div
-      style="
-        background-color: white;
-        max-width: 1264px;
-        padding: 40px;
-        margin: 0 auto;
-      "
-    >
       <p
         style="
           margin-top: 22.5pt;
           margin-right: 7.5pt;
           margin-bottom: 7.5pt;
-          line-height: 1.1;
+          margin-left: 7.5pt;
+          line-height: normal;
+          background: #f2f2f2;
         "
       >
         <b
@@ -1270,7 +1254,7 @@
               font-family: 'Trebuchet MS', sans-serif;
               color: #002060;
             "
-            >*ERSTE LIGA ADDITIONAL NOTICE</span
+            >Cookies Policy</span
           ></b
         >
       </p>
@@ -1280,7 +1264,8 @@
           margin-right: 0in;
           margin-bottom: 7.5pt;
           margin-left: 0in;
-          line-height: 1.1;
+          line-height: normal;
+          background: #f2f2f2;
         "
       >
         <span
@@ -1289,23 +1274,48 @@
             font-family: 'Trebuchet MS', sans-serif;
             color: black;
           "
-          >In the case of ERSTE LIGA TV channel, data is processed jointly in
-          accordance with EU Regulation 2016/679 (hereinafter GDPR). When
-          registering on the inSports site, after accepting this Privacy Policy
-          and Privacy Statement, the user provides the e-mail address required
-          to use the service, which is handed over to the Hungarian Ice Hockey
-          Federation (hereinafter referred to as HIHF), the rights holder of the
-          ERSTE LIGA TV channel, within the framework of joint data processing.
-          Details of the joint processing by the HIHF:
+          >We use cookies, pixels, and other technologies (collectively,
+          “cookies”) to recognize your browser or device, learn more about your
+          interests, and provide you with essential features and services and
+          for additional purposes.<br />
+          If you opt out of advertising cookies, you may still see /platform
+          name/ ads on other sites, but those ads will not be customized by us
+          or our service providers and we will continue to customize your
+          experience on our website via our use of cookies you have not
+          refused.<br />
+          Please note that some of the services will not function as well if
+          cookies are disabled.
         </span>
       </p>
+      <p
+        style="
+          margin-top: 22.5pt;
+          margin-right: 7.5pt;
+          margin-bottom: 7.5pt;
+          margin-left: 7.5pt;
+          line-height: normal;
+          background: #f2f2f2;
+        "
+      >
+        <b
+          ><span
+            style="
+              font-size: 12.5pt;
+              font-family: 'Trebuchet MS', sans-serif;
+              color: #002060;
+            "
+            >What kind of cookies do we use?</span
+          ></b
+        >
+      </p>
       <p
         style="
           margin-top: 7.5pt;
           margin-right: 0in;
           margin-bottom: 7.5pt;
           margin-left: 0in;
-          line-height: 1.1;
+          line-height: normal;
+          background: #f2f2f2;
         "
       >
         <span
@@ -1314,10 +1324,19 @@
             font-family: 'Trebuchet MS', sans-serif;
             color: black;
           "
-          >Purpose of data processing: the HIHF sends marketing, PR and sports
-          promotional content by electronic messages to users who accept this
-          Privacy Statement,  to the e-mail address they have provided.
-        </span>
+          ><i>Analytics and Performance:</i> We make use of analytic cookies to
+          analyze how our visitors use our Website and to monitor Website
+          performance. This allows us to provide a high-quality experience by
+          customizing our offering and quickly identifying and fixing any issues
+          that arise. For example, we might use performance cookies to keep
+          track of which pages are most popular, which method of linking between
+          pages is most effective, and to determine why some pages are receiving
+          error messages. We might also use these cookies to highlight articles
+          or site services that we think will be of interest to you based on
+          your usage of the Website. The information collected by these cookies
+          is not associated with your personal information by us or by our
+          contractors.</span
+        >
       </p>
       <p
         style="
@@ -1325,7 +1344,8 @@
           margin-right: 0in;
           margin-bottom: 7.5pt;
           margin-left: 0in;
-          line-height: 1.1;
+          line-height: normal;
+          background: #f2f2f2;
         "
       >
         <span
@@ -1334,8 +1354,13 @@
             font-family: 'Trebuchet MS', sans-serif;
             color: black;
           "
-          >Legal basis for processing: consent of the data subject.
-        </span>
+          ><i>Website Functionality:</i> We make use of cookies to provide you
+          with certain functionality. For example, to remember choices you make
+          (such as your username, language or the region you are in), or to
+          recognize the platform from which you access the Website, and to
+          provide enhanced and more personal features. These cookies are not
+          used to track your browsing on other sites.</span
+        >
       </p>
       <p
         style="
@@ -1343,7 +1368,8 @@
           margin-right: 0in;
           margin-bottom: 7.5pt;
           margin-left: 0in;
-          line-height: 1.1;
+          line-height: normal;
+          background: #f2f2f2;
         "
       >
         <span
@@ -1352,9 +1378,38 @@
             font-family: 'Trebuchet MS', sans-serif;
             color: black;
           "
-          >The scope of the data processed: the e-mail address of the user
-          registered on inSports.tv.
-        </span>
+          ><i>Advertising:</i> Advertising cookies (also known as Third Party or
+          targeting cookies) collect information about the browsing habits
+          associated with your device and are used to make advertising more
+          relevant to you and your interests. Advertisers such as Facebook,
+          Google, Twitter and others may have buttons embedded on our webpage
+          that such as ‘Like' or ‘Share' buttons in addition to providing the
+          requested functionality or if you click on an advertiser’s ad on our
+          website and are taken to the advertiser’s website (these are Third
+          Party Cookies).</span
+        >
+      </p>
+      <p
+        style="
+          margin-top: 22.5pt;
+          margin-right: 7.5pt;
+          margin-bottom: 7.5pt;
+          margin-left: 7.5pt;
+          line-height: normal;
+          background: #f2f2f2;
+        "
+      >
+        <b
+          ><span
+            style="
+              font-size: 12.5pt;
+              font-family: 'Trebuchet MS', sans-serif;
+              color: #002060;
+              font-style: italic;
+            "
+            >What is the lifespan of cookies?</span
+          ></b
+        >
       </p>
       <p
         style="
@@ -1362,7 +1417,8 @@
           margin-right: 0in;
           margin-bottom: 7.5pt;
           margin-left: 0in;
-          line-height: 1.1;
+          line-height: normal;
+          background: #f2f2f2;
         "
       >
         <span
@@ -1370,18 +1426,44 @@
             font-size: 10.5pt;
             font-family: 'Trebuchet MS', sans-serif;
             color: black;
+            font-style: italic;
           "
-          >Duration of processing: until the data subject's consent is
-          withdrawn.
+        >
+          Analytics and Performance: 2 Years;<br />
+          Website Functionality: 100 days;<br />
+          Advertising: 2 Years;
         </span>
       </p>
+
+      <p
+        style="
+          margin-top: 22.5pt;
+          margin-right: 7.5pt;
+          margin-bottom: 7.5pt;
+          margin-left: 7.5pt;
+          line-height: normal;
+          background: #f2f2f2;
+        "
+      >
+        <b
+          ><span
+            style="
+              font-size: 12.5pt;
+              font-family: 'Trebuchet MS', sans-serif;
+              color: #002060;
+            "
+            >Local storage</span
+          ></b
+        >
+      </p>
       <p
         style="
           margin-top: 7.5pt;
           margin-right: 0in;
           margin-bottom: 7.5pt;
           margin-left: 0in;
-          line-height: 1.1;
+          line-height: normal;
+          background: #f2f2f2;
         "
       >
         <span
@@ -1390,17 +1472,48 @@
             font-family: 'Trebuchet MS', sans-serif;
             color: black;
           "
-          >Method of processing: electronically, in compliance with the
-          necessary security standards.
+        >
+          Local storage is a feature we utilize on our website to enhance your
+          user experience. It allows us to store your user preferences and
+          settings, such as volume/mute settings, and enables the smooth
+          functioning of animated content on our website. Additionally, we can
+          utilize local storage to remember the point at which you left off
+          while watching content. This means that if you navigate away from the
+          page or close your browser, you can easily resume viewing from where
+          you left off without any hassle. Rest assured that this information is
+          stored securely and can only be accessed by our website.
         </span>
       </p>
+
+      <p
+        style="
+          margin-top: 22.5pt;
+          margin-right: 7.5pt;
+          margin-bottom: 7.5pt;
+          margin-left: 7.5pt;
+          line-height: normal;
+          background: #f2f2f2;
+        "
+      >
+        <b
+          ><span
+            style="
+              font-size: 12.5pt;
+              font-family: 'Trebuchet MS', sans-serif;
+              color: #002060;
+            "
+            >Use of IP addresses and web logs</span
+          ></b
+        >
+      </p>
       <p
         style="
           margin-top: 7.5pt;
           margin-right: 0in;
           margin-bottom: 7.5pt;
           margin-left: 0in;
-          line-height: 1.1;
+          line-height: normal;
+          background: #f2f2f2;
         "
       >
         <span
@@ -1409,174 +1522,91 @@
             font-family: 'Trebuchet MS', sans-serif;
             color: black;
           "
-          >Data subjects' rights:
+        >
+          We may also use your IP address and browser type to help diagnose
+          problems with our server, to administer our Website and to improve the
+          services we offer to you. An IP address is a numeric code that
+          identifies your computer on the internet. Your IP address might also
+          be used to gather broad demographic information.<br />
+          We may perform IP lookups to determine which domain you are coming
+          from (e.g. google.com) to more accurately gauge our users'
+          demographics.
         </span>
       </p>
-      <ol style="margin-top: 0in" start="1" type="a">
-        <li style="color: black; margin-bottom: 0in; line-height: 1.1">
-          <span
-            style="font-size: 10.5pt; font-family: 'Trebuchet MS', sans-serif"
-            >The data subject has the right to withdraw consent to data
-            processing at any time. Withdrawal of consent does not affect the
-            lawfulness of the prior processing.</span
-          >
-        </li>
-        <li style="color: black; margin-bottom: 0in; line-height: 1.1">
-          <span
-            style="font-size: 10.5pt; font-family: 'Trebuchet MS', sans-serif"
-            >The data subject may also exercise his or her right of access to
-            his or her personal data (right to request information about the
-            processing), the right to rectification of his or her personal data
-            (e.g. if his or her e-mail address changes), the right to object to
-            processing, the right to restriction of processing (e.g. if he or
-            she does not wish to receive e-mails for a certain period of time),
-            the right to erasure or blocking of his or her data, and the right
-            to data portability.
-          </span>
-        </li>
-        <li style="color: black; margin-bottom: 0in; line-height: 1.1">
-          <span
-            style="font-size: 10.5pt; font-family: 'Trebuchet MS', sans-serif"
-            >If the data subject wishes to exercise his or her rights in
-            relation to the joint processing described in this paragraph, he or
-            she may do so by the means listed below:
-          </span>
-        </li>
-        <p
-          style="
-            margin-top: 22.5pt;
-            margin-right: 0in;
-            margin-bottom: 7.5pt;
-            margin-left: 0in;
-            line-height: 1.1;
-          "
-        >
-          <span
-            style="
-              font-size: 10.5pt;
-              font-family: 'Trebuchet MS', sans-serif;
-              color: black;
-            "
-            >Name: Hungarian Ice Hockey Federation (hereinafter referred to as
-            the "Controller")
-          </span>
-        </p>
-        <p
-          style="
-            margin-top: 7.5pt;
-            margin-right: 0in;
-            margin-bottom: 7.5pt;
-            margin-left: 0in;
-            line-height: 1.1;
-          "
-        >
-          <span
-            style="
-              font-size: 10.5pt;
-              font-family: 'Trebuchet MS', sans-serif;
-              color: black;
-            "
-            >Seat: H-1146 Budapest, Istvánmezei út 1-3.
-          </span>
-        </p>
-        <p
-          style="
-            margin-top: 7.5pt;
-            margin-right: 0in;
-            margin-bottom: 7.5pt;
-            margin-left: 0in;
-            line-height: 1.1;
-          "
-        >
-          <span
-            style="
-              font-size: 10.5pt;
-              font-family: 'Trebuchet MS', sans-serif;
-              color: black;
-            "
-            >Postal address: H-1146 Budapest, Istvánmezei út 1-3.
-          </span>
-        </p>
-        <p
-          style="
-            margin-top: 7.5pt;
-            margin-right: 0in;
-            margin-bottom: 7.5pt;
-            margin-left: 0in;
-            line-height: 1.1;
-          "
-        >
-          <span
+      <p
+        style="
+          margin-top: 22.5pt;
+          margin-right: 7.5pt;
+          margin-bottom: 7.5pt;
+          margin-left: 7.5pt;
+          line-height: normal;
+          background: #f2f2f2;
+        "
+      >
+        <b
+          ><span
             style="
-              font-size: 10.5pt;
+              font-size: 12.5pt;
               font-family: 'Trebuchet MS', sans-serif;
-              color: black;
+              color: #002060;
             "
-            >Represented by: Zsolt Levente Sipos, General Secretary
-          </span>
-        </p>
-        <p
-          style="
-            margin-top: 7.5pt;
-            margin-right: 0in;
-            margin-bottom: 7.5pt;
-            margin-left: 0in;
-            line-height: 1.1;
-          "
+            >Cookie Notice does not cover third party websites</span
+          ></b
         >
-          <span
-            style="
-              font-size: 10.5pt;
-              font-family: 'Trebuchet MS', sans-serif;
-              color: black;
-            "
-            >Phone: +36 1 460 6863
-          </span>
-        </p>
-        <p
+      </p>
+      <p
+        style="
+          margin-top: 7.5pt;
+          margin-right: 0in;
+          margin-bottom: 7.5pt;
+          margin-left: 0in;
+          line-height: normal;
+          background: #f2f2f2;
+        "
+      >
+        <span
           style="
-            margin-top: 7.5pt;
-            margin-right: 0in;
-            margin-bottom: 7.5pt;
-            margin-left: 0in;
-            line-height: 1.1;
+            font-size: 10.5pt;
+            font-family: 'Trebuchet MS', sans-serif;
+            color: black;
           "
         >
-          <span
+          Please note that this Cookie Notice does not apply to, and we are not
+          responsible for, the privacy practices of third-party websites which
+          may be linked to this Website.
+        </span>
+      </p>
+
+      <p
+        style="
+          margin-top: 22.5pt;
+          margin-right: 7.5pt;
+          margin-bottom: 7.5pt;
+          margin-left: 7.5pt;
+          line-height: normal;
+          background: #f2f2f2;
+        "
+      >
+        <b
+          ><span
             style="
-              font-size: 10.5pt;
+              font-size: 12.5pt;
               font-family: 'Trebuchet MS', sans-serif;
-              color: black;
+              color: #002060;
             "
-            >Fax: +36 1 460 6864
-          </span>
-        </p>
-        <p
-          style="
-            margin-top: 7.5pt;
-            margin-right: 0in;
-            margin-bottom: 7.5pt;
-            margin-left: 0in;
-            line-height: 1.1;
-          "
+            >Changes to the Cookie Notice</span
+          ></b
         >
-          <span
-            style="
-              font-size: 10.5pt;
-              font-family: 'Trebuchet MS', sans-serif;
-              color: black;
-            "
-            >E-mail: adatvedelem@icehockey.hu
-          </span>
-        </p>
-      </ol>
+      </p>
+
       <p
         style="
           margin-top: 7.5pt;
           margin-right: 0in;
           margin-bottom: 7.5pt;
           margin-left: 0in;
-          line-height: 1.1;
+          line-height: normal;
+          background: #f2f2f2;
         "
       >
         <span
@@ -1585,11 +1615,23 @@
             font-family: 'Trebuchet MS', sans-serif;
             color: black;
           "
-          >HIHF ERSTE LIGA TV Terms and Conditions of Use, including the Privacy
-          Statement, can be found at the following link:
-          "ersteligatv.hu/Felhasznalasi-feltetelek"
+        >
+          We may update this Cookie Notice and we would encourage you to review
+          the notice from time to time to stay informed of how we are using
+          cookies.
         </span>
       </p>
+
+      <p style="margin-bottom: 0in; line-height: normal; background: #f2f2f2">
+        <span
+          style="
+            font-size: 9pt;
+            font-family: 'Trebuchet MS', sans-serif;
+            color: black;
+          "
+          >© inSportsTV.com All right reserved.</span
+        >
+      </p>
     </div>
   </body>
 </html>

public/clients/insports/terms-and-conditions.html

@@ -102,7 +102,7 @@
             color: black;
           "
           ><b>inSports TV</b> also referred to as <b>"us", "we", "our"</b> or
-          <b>"the company"</b>; refers to inSports TV Limited.</span
+          <b>"the company"</b>; refers to inSport TV Limited.</span
         >
       </p>
       <p
@@ -4346,7 +4346,7 @@
         "
       >
         <span style="font-size: 10.5pt; font-family: 'Trebuchet MS', sans-serif"
-          >Anna Shadchinieva,<br />The contact address is:
+          >Lazar Andreevich Petrov,<br />The contact address is:
           <a href="mailto:support@insports.tv"
             ><span
               lang="EN-US"

public/clients/tunisia/favicon/browserconfig.xml

@@ -0,0 +1,12 @@
+<?xml version="1.0" encoding="utf-8"?>
+<browserconfig>
+    <msapplication>
+        <tile>
+            <square70x70logo src="/mstile-70x70.png"/>
+            <square144x144logo src="/mstile-144x144.png"/>
+            <square150x150logo src="/mstile-150x150.png"/>
+            <square310x310logo src="/mstile-310x310.png"/>
+            <TileColor>#da532c</TileColor>
+        </tile>
+    </msapplication>
+</browserconfig>

public/clients/tunisia/favicon/manifest.json

@@ -0,0 +1,19 @@
+{
+  "name": "",
+  "short_name": "",
+  "icons": [
+    {
+      "src": "/android-chrome-192x192.png",
+      "sizes": "192x192",
+      "type": "image/png"
+    },
+    {
+      "src": "/android-chrome-512x512.png",
+      "sizes": "512x512",
+      "type": "image/png"
+    }
+  ],
+  "theme_color": "#ffffff",
+  "background_color": "#ffffff",
+  "display": "standalone"
+}

public/clients/tunisia/favicon/safari-pinned-tab.svg

@@ -0,0 +1,18 @@
+<?xml version="1.0" standalone="no"?>
+<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 20010904//EN" "http://www.w3.org/TR/2001/REC-SVG-20010904/DTD/svg10.dtd">
+<svg version="1.0" xmlns="http://www.w3.org/2000/svg" width="700.000000pt" height="700.000000pt" viewBox="0 0 700.000000 700.000000" preserveAspectRatio="xMidYMid meet">
+  <metadata>
+Created by potrace 1.14, written by Peter Selinger 2001-2017
+</metadata>
+  <g transform="translate(0.000000,700.000000) scale(0.100000,-0.100000)" fill="#000000" stroke="none">
+    <path d="M1499 6996 c-2 -2 -59 -6 -125 -9 -247 -12 -462 -57 -614 -129 -64
+-30 -206 -123 -265 -173 -105 -89 -173 -164 -247 -270 -153 -219 -210 -411
+-235 -790 -11 -161 -10 -4130 0 -4270 12 -158 20 -222 43 -331 60 -297 246
+-573 515 -766 182 -130 345 -193 584 -225 22 -2 51 -6 65 -8 124 -17 518 -20
+2260 -20 1773 0 2220 4 2295 19 11 2 45 7 75 10 75 9 120 17 190 36 121 32
+186 61 300 129 87 53 77 46 155 109 140 114 277 283 353 437 83 166 119 330
+139 630 11 160 10 4107 0 4260 -29 420 -108 642 -311 880 -175 205 -390 346
+-626 412 -47 13 -107 26 -135 29 -27 4 -52 8 -55 9 -3 2 -44 6 -90 10 -47 4
+-96 9 -110 13 -26 6 -4154 14 -4161 8z" />
+  </g>
+</svg>

public/images/dollar-sign-grey.svg

@@ -1,3 +0,0 @@
-<svg width="6" height="13" viewBox="0 0 6 13" fill="none" xmlns="http://www.w3.org/2000/svg">
-<path d="M3.80998 0.90332V2.65527H2.90764V0.90332H3.80998ZM3.69865 10.4717V12.042H2.80217V10.4717H3.69865ZM4.58342 8.5791C4.58342 8.35254 4.53654 8.15527 4.44279 7.9873C4.35295 7.81543 4.20451 7.66113 3.99748 7.52441C3.79045 7.38379 3.51311 7.25293 3.16545 7.13184C2.66545 6.95605 2.22795 6.75879 1.85295 6.54004C1.48186 6.31738 1.19279 6.04395 0.985762 5.71973C0.782637 5.3916 0.681075 4.9834 0.681075 4.49512C0.681075 4.01465 0.79045 3.59863 1.0092 3.24707C1.23186 2.89551 1.54045 2.62402 1.93498 2.43262C2.32951 2.24121 2.79045 2.14551 3.31779 2.14551C3.72404 2.14551 4.08928 2.20605 4.4135 2.32715C4.74162 2.44824 5.02092 2.62598 5.25139 2.86035C5.48186 3.09473 5.65764 3.38379 5.77873 3.72754C5.90373 4.06738 5.96623 4.45801 5.96623 4.89941H4.55998C4.55998 4.64941 4.53068 4.42676 4.47209 4.23145C4.4174 4.03223 4.33537 3.86426 4.226 3.72754C4.11662 3.58691 3.98381 3.47949 3.82756 3.40527C3.67522 3.33105 3.50139 3.29395 3.30607 3.29395C3.02873 3.29395 2.80022 3.34668 2.62053 3.45215C2.44084 3.55371 2.30803 3.69434 2.22209 3.87402C2.14006 4.05371 2.09904 4.25879 2.09904 4.48926C2.09904 4.71191 2.14201 4.90723 2.22795 5.0752C2.31389 5.24316 2.46037 5.39551 2.6674 5.53223C2.87834 5.66504 3.1674 5.7998 3.53459 5.93652C4.0385 6.11621 4.47404 6.31738 4.84123 6.54004C5.21232 6.75879 5.49748 7.03027 5.6967 7.35449C5.89982 7.6748 6.00139 8.0791 6.00139 8.56738C6.00139 9.07129 5.8842 9.49902 5.64982 9.85059C5.41936 10.2021 5.09514 10.4697 4.67717 10.6533C4.26311 10.833 3.78068 10.9229 3.2299 10.9229C2.88225 10.9229 2.53654 10.8779 2.19279 10.7881C1.85295 10.6943 1.54436 10.542 1.26701 10.3311C0.989669 10.1201 0.768965 9.84082 0.604903 9.49316C0.44084 9.1416 0.358809 8.71191 0.358809 8.2041H1.77678C1.77678 8.50879 1.81779 8.7627 1.89982 8.96582C1.98186 9.16895 2.09318 9.3291 2.23381 9.44629C2.37443 9.56348 2.53068 9.64746 2.70256 9.69824C2.87834 9.74902 3.05412 9.77441 3.2299 9.77441C3.52287 9.77441 3.76897 9.72559 3.96818 9.62793C4.17131 9.52637 4.32365 9.38574 4.42522 9.20605C4.53068 9.02246 4.58342 8.81348 4.58342 8.5791Z" fill="white" fill-opacity="0.7"/>
-</svg>

public/images/dollar-sign.svg

@@ -1,3 +0,0 @@
-<svg width="12" height="23" viewBox="0 0 12 23" fill="none" xmlns="http://www.w3.org/2000/svg">
-<path d="M8.81201 15.5813C8.81201 14.9172 8.60107 14.3704 8.1792 13.9407C7.75732 13.5032 7.0542 13.1125 6.06982 12.7688C5.08545 12.4172 4.31982 12.093 3.77295 11.7961C1.95264 10.8196 1.04248 9.37427 1.04248 7.46021C1.04248 6.16333 1.43701 5.09692 2.22607 4.26099C3.01514 3.42505 4.08545 2.92896 5.43701 2.77271V0.218018H7.31201V2.79614C8.67139 2.99146 9.72217 3.56958 10.4644 4.53052C11.2065 5.48364 11.5776 6.72583 11.5776 8.25708H8.7417C8.7417 7.27271 8.51904 6.49927 8.07373 5.93677C7.63623 5.36646 7.03857 5.0813 6.28076 5.0813C5.53076 5.0813 4.94482 5.28442 4.52295 5.69067C4.10107 6.09692 3.89014 6.67896 3.89014 7.43677C3.89014 8.11646 4.09717 8.66333 4.51123 9.07739C4.93311 9.48364 5.64404 9.87036 6.64404 10.2375C7.64404 10.6047 8.4292 10.9446 8.99951 11.2571C9.56982 11.5696 10.0503 11.929 10.4409 12.3352C10.8315 12.7336 11.1323 13.1946 11.3433 13.718C11.5542 14.2415 11.6597 14.8547 11.6597 15.5579C11.6597 16.8782 11.2534 17.9485 10.4409 18.7688C9.63623 19.5891 8.51123 20.0735 7.06592 20.2219V22.5071H5.20264V20.2336C3.65576 20.0618 2.46436 19.5071 1.62842 18.5696C0.800293 17.6321 0.38623 16.3899 0.38623 14.843H3.23389C3.23389 15.8274 3.47998 16.5891 3.97217 17.1282C4.47217 17.6672 5.17529 17.9368 6.08154 17.9368C6.97217 17.9368 7.64795 17.7219 8.10889 17.2922C8.57764 16.8625 8.81201 16.2922 8.81201 15.5813Z" fill="#333333"/>
-</svg>

public/images/matchTabs/bets.svg

@@ -0,0 +1,3 @@
+<svg width="22" height="16" viewBox="0 0 22 16" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M20.75 6.5C20.9489 6.5 21.1397 6.42098 21.2803 6.28033C21.421 6.13968 21.5 5.94891 21.5 5.75V2C21.5 1.60218 21.342 1.22064 21.0607 0.93934C20.7794 0.658035 20.3978 0.5 20 0.5H2C1.60218 0.5 1.22064 0.658035 0.93934 0.93934C0.658035 1.22064 0.5 1.60218 0.5 2V5.75C0.5 5.94891 0.579018 6.13968 0.71967 6.28033C0.860322 6.42098 1.05109 6.5 1.25 6.5C1.64782 6.5 2.02936 6.65804 2.31066 6.93934C2.59196 7.22064 2.75 7.60218 2.75 8C2.75 8.39782 2.59196 8.77936 2.31066 9.06066C2.02936 9.34196 1.64782 9.5 1.25 9.5C1.05109 9.5 0.860322 9.57902 0.71967 9.71967C0.579018 9.86032 0.5 10.0511 0.5 10.25V14C0.5 14.3978 0.658035 14.7794 0.93934 15.0607C1.22064 15.342 1.60218 15.5 2 15.5H20C20.3978 15.5 20.7794 15.342 21.0607 15.0607C21.342 14.7794 21.5 14.3978 21.5 14V10.25C21.5 10.0511 21.421 9.86032 21.2803 9.71967C21.1397 9.57902 20.9489 9.5 20.75 9.5C20.3522 9.5 19.9706 9.34196 19.6893 9.06066C19.408 8.77936 19.25 8.39782 19.25 8C19.25 7.60218 19.408 7.22064 19.6893 6.93934C19.9706 6.65804 20.3522 6.5 20.75 6.5ZM20 10.9025V14H14.75V11.75H13.25V14H2V10.9025C2.642 10.7347 3.21025 10.3588 3.61582 9.8336C4.02139 9.3084 4.24139 8.66356 4.24139 8C4.24139 7.33644 4.02139 6.6916 3.61582 6.1664C3.21025 5.64121 2.642 5.2653 2 5.0975V2H13.25V4.25H14.75V2H20V5.0975C19.358 5.2653 18.7898 5.64121 18.3842 6.1664C17.9786 6.6916 17.7586 7.33644 17.7586 8C17.7586 8.66356 17.9786 9.3084 18.3842 9.8336C18.7898 10.3588 19.358 10.7347 20 10.9025Z" fill="white"/>
+</svg>

public/images/matchTabs/chat.svg

@@ -0,0 +1,3 @@
+<svg width="20" height="20" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M18 0H2C0.9 0 0 0.9 0 2V20L4 16H18C19.1 16 20 15.1 20 14V2C20 0.9 19.1 0 18 0ZM18 14H4L2 16V2H18V14Z" fill="white"/>
+</svg>

public/images/matchTabs/likes.svg

@@ -0,0 +1,4 @@
+<svg width="25" height="25" viewBox="0 0 25 25" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M12.9261 5.8212C12.9307 5.87963 12.9358 5.93231 12.9406 5.97754C12.9332 5.99732 12.9251 6.019 12.9163 6.04251C12.8651 6.17851 12.7898 6.37523 12.6939 6.61585C12.502 7.09769 12.229 7.75251 11.9041 8.44659C11.5783 9.14247 11.2053 9.86744 10.8143 10.4938C10.4154 11.1329 10.0302 11.616 9.69372 11.8772C9.66718 11.8978 9.64228 11.9205 9.61923 11.9449C9.18111 12.41 8.91275 12.9173 8.74763 13.3195L8.7475 13.3194L8.74278 13.3316C8.71208 13.4109 8.6845 13.4866 8.66007 13.556C8.58397 13.7007 8.41439 13.9457 8.03684 14.1757C7.79824 14.321 7.67921 14.6026 7.74121 14.875L9.45857 22.4214C9.51892 22.6866 9.738 22.8862 10.0077 22.9216L10.0924 22.2772C10.0077 22.9216 10.0077 22.9216 10.0078 22.9216L10.008 22.9217L10.0085 22.9217L10.0104 22.922L10.0169 22.9228L10.0413 22.9259L10.1335 22.9373C10.2137 22.9471 10.3304 22.9608 10.4785 22.977C10.7745 23.0094 11.1963 23.052 11.7023 23.0927C12.704 23.1733 14.0447 23.2476 15.3961 23.2207C16.4734 23.3062 17.6651 23.3176 18.6492 23.1041C20.351 22.7378 21.1491 21.9031 21.424 21.0082C21.5524 20.5903 21.5506 20.2065 21.5195 19.9324C21.5184 19.923 21.5173 19.9137 21.5162 19.9045C22.2578 19.2016 22.4576 18.4095 22.4234 17.7496C22.407 17.4337 22.3384 17.1612 22.268 16.9564C22.532 16.603 22.6944 16.243 22.7698 15.8841C22.869 15.4117 22.8081 14.9852 22.6891 14.6367C22.5848 14.3315 22.4352 14.0826 22.3041 13.9021C22.3596 13.7543 22.414 13.5732 22.4473 13.3692C22.5426 12.7857 22.4608 11.9957 21.7482 11.3383C21.301 10.9249 20.7077 10.7201 20.1465 10.6173C19.5762 10.5129 18.9701 10.5014 18.4303 10.5271C17.8871 10.553 17.3897 10.6177 17.0293 10.6755C16.8485 10.7044 16.7006 10.7319 16.5969 10.7524C16.545 10.7626 16.504 10.7711 16.4753 10.7772L16.4465 10.7835C16.2767 10.8127 16.1004 10.8472 15.9166 10.8879C15.9176 10.8109 15.9236 10.7124 15.9386 10.5884C15.9877 10.1833 16.1238 9.57481 16.4163 8.67814C17.0456 6.75441 16.9047 5.43702 16.2643 4.58987C15.6381 3.76143 14.6875 3.5895 14.1627 3.5895C13.6555 3.5895 13.3235 3.89075 13.149 4.21465C12.9929 4.50432 12.9404 4.83899 12.9208 5.09751C12.9001 5.36964 12.9113 5.63254 12.9261 5.8212Z" stroke="white" stroke-width="1.3" stroke-linejoin="round"/>
+<path d="M7.34175 23.2783C7.70504 23.2809 8.04815 23.132 8.27682 22.8488C8.50519 22.566 8.57817 22.2007 8.50503 21.8497C8.50503 21.8496 8.50503 21.8496 8.50503 21.8496L7.204 15.603L7.204 15.6029C7.06791 14.9497 6.44949 14.4357 5.77589 14.4357H3.29278C2.93392 14.4357 2.64296 14.7265 2.64278 15.0853L2.63906 22.6279C2.63898 22.8004 2.70742 22.9658 2.82933 23.0878C2.95124 23.2097 3.11662 23.2783 3.28906 23.2783H7.34175ZM7.34175 23.2783C7.34045 23.2783 7.33916 23.2782 7.33786 23.2782L7.34456 22.6283V23.2783H7.34175Z" stroke="white" stroke-width="1.3" stroke-linejoin="round"/>
+</svg>

public/images/matchTabs/players.svg

@@ -0,0 +1,6 @@
+<svg width="21" height="21" viewBox="0 0 21 21" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path fill-rule="evenodd" clip-rule="evenodd" d="M15.1862 14.29C15.1862 14.29 14.4125 13.347 13.7596 13.1778C11.7528 12.67 10.8824 12.0414 10.5681 11.6787C10.689 11.582 10.8099 11.4611 10.9308 11.3402C12.2606 9.84117 12.0672 7.32661 12.043 7.0123C11.8979 3.99001 9.6735 3.26466 8.36787 3.31301C7.06224 3.26466 4.83783 4.01418 4.69276 7.0123C4.66859 7.30244 4.47516 9.81698 5.80497 11.3402C5.92586 11.4853 6.07093 11.6304 6.216 11.7271C6.16764 11.7512 6.14346 11.7754 6.14346 11.7996C5.78079 12.1865 4.93455 12.7184 3.07282 13.2019C2.37164 13.3712 1.59794 14.5076 1.59794 14.5076C1.59794 14.5076 0.928283 15.9908 1.10911 16.1968C2.86924 18.199 5.44868 19.4641 8.31951 19.4641C11.3689 19.4641 14.0895 18.0368 15.8487 15.8148C15.6145 14.8567 15.1862 14.29 15.1862 14.29ZM3.41131 14.5801C2.90357 14.701 2.7585 15.3296 2.7585 15.8374C4.2092 17.1914 6.16764 18.0376 8.31951 18.0376C10.5681 18.0376 12.5991 17.1188 14.0981 15.6681C14.0503 14.7595 13.6004 14.6312 13.4268 14.5817L13.4211 14.5801C12.3331 14.3142 11.5111 13.9998 10.9066 13.6855C10.3021 14.4834 9.35918 14.967 8.34369 14.967C7.35238 14.967 6.4336 14.5076 5.82914 13.7339C5.22469 14.024 4.4268 14.3142 3.41131 14.5801ZM8.36787 10.9775C9.02068 10.9775 9.50425 10.7841 9.86692 10.3731C10.6648 9.47849 10.6648 7.73765 10.5923 7.13319V7.08483C10.5439 6.06934 10.1812 5.36817 9.52843 5.0055C9.02505 4.73093 8.50002 4.73784 8.38365 4.73938C8.37705 4.73946 8.37176 4.73953 8.36787 4.73953H8.27115C8.10191 4.73953 7.61834 4.73953 7.15895 5.0055C6.50614 5.36817 6.14346 6.06934 6.09511 7.08483V7.13319C6.02257 7.73765 6.04675 9.47849 6.84463 10.3731C7.20731 10.7599 7.69087 10.9775 8.34369 10.9775H8.36787ZM8.29533 12.4282C8.02937 12.4282 7.76341 12.4041 7.5458 12.3557C7.42491 12.525 7.25567 12.7426 7.03806 12.936C7.35238 13.3228 7.83594 13.5404 8.34369 13.5404C8.89979 13.5404 9.38336 13.2745 9.72185 12.8635C9.52843 12.67 9.38336 12.5008 9.28664 12.3315C9.02068 12.3799 8.75472 12.4282 8.4404 12.4282H8.29533Z" fill="white"/>
+<rect x="13.3672" y="4.10608" width="6.14323" height="1.53581" rx="0.767904" fill="white"/>
+<rect x="13.3672" y="6.40979" width="6.14323" height="1.53581" rx="0.767904" fill="white"/>
+<rect x="13.3672" y="8.7135" width="6.14323" height="1.53581" rx="0.767904" fill="white"/>
+</svg>

public/images/matchTabs/plays.svg

@@ -0,0 +1,4 @@
+<svg width="18" height="18" viewBox="0 0 18 18" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M8.9915 0.666626C4.3915 0.666626 0.666504 4.39996 0.666504 8.99996C0.666504 13.6 4.3915 17.3333 8.9915 17.3333C13.5998 17.3333 17.3332 13.6 17.3332 8.99996C17.3332 4.39996 13.5998 0.666626 8.9915 0.666626ZM8.99984 15.6666C5.3165 15.6666 2.33317 12.6833 2.33317 8.99996C2.33317 5.31663 5.3165 2.33329 8.99984 2.33329C12.6832 2.33329 15.6665 5.31663 15.6665 8.99996C15.6665 12.6833 12.6832 15.6666 8.99984 15.6666Z" fill="white"/>
+<path d="M9.4165 5.45829C9.4165 5.11311 9.13668 4.83329 8.7915 4.83329C8.44633 4.83329 8.1665 5.11311 8.1665 5.45829V9.2671C8.1665 9.61837 8.3508 9.94387 8.65201 10.1246L12.0317 12.1524C12.3139 12.3217 12.6797 12.2316 12.851 11.9507C13.0246 11.666 12.9321 11.2942 12.6453 11.1241L9.90623 9.49886C9.60263 9.31873 9.4165 8.99187 9.4165 8.63885V5.45829Z" fill="white"/>
+</svg>

public/images/matchTabs/stats.svg

@@ -0,0 +1,12 @@
+<svg width="22" height="18" viewBox="0 0 22 18" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M21.1 0H0.9C0.4 0 0 0.4 0 0.9V17.1C0 17.5 0.4 18 0.9 18H21.1C21.5 18 22 17.5 22 17.1V0.9C22 0.4 21.5 0 21.1 0ZM20 16H2V2H20V16Z" fill="white"/>
+<path d="M13.5 4H9C8.44772 4 8 4.44772 8 5C8 5.55228 8.44772 6 9 6H13.5C14.0523 6 14.5 5.55228 14.5 5C14.5 4.44772 14.0523 4 13.5 4Z" fill="white"/>
+<path d="M13.5 8H9C8.44772 8 8 8.44772 8 9C8 9.55228 8.44772 10 9 10H13.5C14.0523 10 14.5 9.55228 14.5 9C14.5 8.44772 14.0523 8 13.5 8Z" fill="white"/>
+<path d="M13.5 12H9C8.44772 12 8 12.4477 8 13C8 13.5523 8.44772 14 9 14H13.5C14.0523 14 14.5 13.5523 14.5 13C14.5 12.4477 14.0523 12 13.5 12Z" fill="white"/>
+<path d="M4 13C4 13.5523 4.44772 14 5 14C5.55228 14 6 13.5523 6 13C6 12.4477 5.55228 12 5 12C4.44772 12 4 12.4477 4 13Z" fill="white"/>
+<path d="M4 9C4 9.55228 4.44772 10 5 10C5.55228 10 6 9.55228 6 9C6 8.44772 5.55228 8 5 8C4.44772 8 4 8.44772 4 9Z" fill="white"/>
+<path d="M4 5C4 5.55228 4.44772 6 5 6C5.55228 6 6 5.55228 6 5C6 4.44772 5.55228 4 5 4C4.44772 4 4 4.44772 4 5Z" fill="white"/>
+<path d="M16.5 13C16.5 13.5523 16.9477 14 17.5 14C18.0523 14 18.5 13.5523 18.5 13C18.5 12.4477 18.0523 12 17.5 12C16.9477 12 16.5 12.4477 16.5 13Z" fill="white"/>
+<path d="M16.5 9C16.5 9.55228 16.9477 10 17.5 10C18.0523 10 18.5 9.55228 18.5 9C18.5 8.44772 18.0523 8 17.5 8C16.9477 8 16.5 8.44772 16.5 9Z" fill="white"/>
+<path d="M16.5 5C16.5 5.55228 16.9477 6 17.5 6C18.0523 6 18.5 5.55228 18.5 5C18.5 4.44772 18.0523 4 17.5 4C16.9477 4 16.5 4.44772 16.5 5Z" fill="white"/>
+</svg>

public/images/matchTabs/watch.svg

@@ -0,0 +1,3 @@
+<svg width="20" height="20" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M8 12.5C8 13.324 8.94076 13.7944 9.6 13.3L12.9333 10.8C13.4667 10.4 13.4667 9.6 12.9333 9.2L9.6 6.7C8.94076 6.20557 8 6.67595 8 7.5V12.5ZM10 0C4.48 0 0 4.48 0 10C0 15.52 4.48 20 10 20C15.52 20 20 15.52 20 10C20 4.48 15.52 0 10 0ZM10 18C5.59 18 2 14.41 2 10C2 5.59 5.59 2 10 2C14.41 2 18 5.59 18 10C18 14.41 14.41 18 10 18Z" fill="white"/>
+</svg>

public/images/score-switch-tunisia-off.svg

@@ -0,0 +1,22 @@
+<svg width="38" height="23" viewBox="0 0 38 23" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M31 18H11C7.1 18 4 14.9 4 11C4 7.1 7.1 4 11 4H31C34.9 4 38 7.1 38 11C38 14.9 34.9 18 31 18Z" fill="white" fill-opacity="0.4"/>
+<g filter="url(#filter0_dd_1_1015)">
+<path fill-rule="evenodd" clip-rule="evenodd" d="M11 21C16.5228 21 21 16.5228 21 11C21 5.47715 16.5228 1 11 1C5.47715 1 1 5.47715 1 11C1 16.5228 5.47715 21 11 21Z" fill="#E1E1E1"/>
+</g>
+<defs>
+<filter id="filter0_dd_1_1015" x="0" y="0" width="22" height="23" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB">
+<feFlood flood-opacity="0" result="BackgroundImageFix"/>
+<feColorMatrix in="SourceAlpha" type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0" result="hardAlpha"/>
+<feOffset dy="1"/>
+<feGaussianBlur stdDeviation="0.5"/>
+<feColorMatrix type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.237602 0"/>
+<feBlend mode="normal" in2="BackgroundImageFix" result="effect1_dropShadow_1_1015"/>
+<feColorMatrix in="SourceAlpha" type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0" result="hardAlpha"/>
+<feOffset/>
+<feGaussianBlur stdDeviation="0.5"/>
+<feColorMatrix type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.12 0"/>
+<feBlend mode="normal" in2="effect1_dropShadow_1_1015" result="effect2_dropShadow_1_1015"/>
+<feBlend mode="normal" in="SourceGraphic" in2="effect2_dropShadow_1_1015" result="shape"/>
+</filter>
+</defs>
+</svg>

public/images/score-switch-tunisia-on.svg

@@ -0,0 +1,29 @@
+<svg width="38" height="23" viewBox="0 0 38 23" fill="none" xmlns="http://www.w3.org/2000/svg">
+  <path
+    d="M7 4L27 4C30.9 4 34 7.1 34 11C34 14.9 30.9 18 27 18L7 18C3.1 18 2.71011e-07 14.9 6.11959e-07 11C9.52908e-07 7.1 3.1 4 7 4Z"
+    fill="#0E8F84" />
+  <g filter="url(#filter0_dd_1_1076)">
+    <path fill-rule="evenodd" clip-rule="evenodd"
+      d="M27 0.999999C21.4772 0.999999 17 5.47715 17 11C17 16.5228 21.4772 21 27 21C32.5228 21 37 16.5228 37 11C37 5.47715 32.5228 1 27 0.999999Z"
+      fill="#E1E1E1" />
+  </g>
+  <defs>
+    <filter id="filter0_dd_1_1076" x="16" y="0" width="22" height="23" filterUnits="userSpaceOnUse"
+      color-interpolation-filters="sRGB">
+      <feFlood flood-opacity="0" result="BackgroundImageFix" />
+      <feColorMatrix in="SourceAlpha" type="matrix"
+        values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0" result="hardAlpha" />
+      <feOffset dy="1" />
+      <feGaussianBlur stdDeviation="0.5" />
+      <feColorMatrix type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.237602 0" />
+      <feBlend mode="normal" in2="BackgroundImageFix" result="effect1_dropShadow_1_1076" />
+      <feColorMatrix in="SourceAlpha" type="matrix"
+        values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0" result="hardAlpha" />
+      <feOffset />
+      <feGaussianBlur stdDeviation="0.5" />
+      <feColorMatrix type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.12 0" />
+      <feBlend mode="normal" in2="effect1_dropShadow_1_1076" result="effect2_dropShadow_1_1076" />
+      <feBlend mode="normal" in="SourceGraphic" in2="effect2_dropShadow_1_1076" result="shape" />
+    </filter>
+  </defs>
+</svg>

public/images/sortUp.svg

@@ -0,0 +1,3 @@
+<svg width="7" height="6" viewBox="0 0 7 6" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M3.06699 0.75C3.25944 0.416667 3.74056 0.416667 3.93301 0.75L6.09808 4.5C6.29053 4.83333 6.04996 5.25 5.66506 5.25L1.33494 5.25C0.950036 5.25 0.709474 4.83333 0.901924 4.5L3.06699 0.75Z" fill="white" fill-opacity="0.7"/>
+</svg>

public/images/tunis-logo.svg

@@ -0,0 +1,29 @@
+<svg width="144" height="31" viewBox="0 0 144 31" fill="none" xmlns="http://www.w3.org/2000/svg">
+<g clip-path="url(#clip0_5_10489)">
+<path d="M134.436 0.0644531H61.5517C56.2735 0.0644531 51.9946 4.3433 51.9946 9.62152V21.1889C51.9946 26.4671 56.2735 30.7459 61.5517 30.7459H134.436C139.715 30.7459 143.994 26.4671 143.994 21.1889V9.62152C143.994 4.3433 139.715 0.0644531 134.436 0.0644531Z" fill="#0B2E4D"/>
+<path d="M65.5072 0H9.84982C4.40992 0 0 4.40992 0 9.84982V20.8967C0 26.3366 4.40992 30.7465 9.84982 30.7465H65.5072C70.9471 30.7465 75.357 26.3366 75.357 20.8967V9.84982C75.357 4.40992 70.9471 0 65.5072 0Z" fill="url(#paint0_linear_5_10489)"/>
+<path d="M90.2752 16.9092C90.2752 20.8777 88.4145 22.8685 84.6932 22.8685C81.2711 22.8685 79.5601 21.1185 79.5601 17.6118C79.5601 16.675 79.6967 15.6926 79.9699 14.6582L83.5026 14.0271C83.1513 15.1656 82.9756 16.2521 82.9756 17.2865C82.9756 19.2318 83.6197 20.2011 84.9144 20.2011C85.604 20.2011 86.0919 19.9864 86.3847 19.5506C86.6904 19.0886 86.8401 18.2884 86.8401 17.1434V10.2667H90.2687V16.9092H90.2752ZM83.3855 12.7715C83.0667 12.4527 82.9106 12.0689 82.9106 11.62C82.9106 11.171 83.0667 10.7872 83.3855 10.4684C83.6978 10.1561 84.0751 10 84.5305 10C84.9859 10 85.3633 10.1561 85.682 10.4684C86.0008 10.7872 86.157 11.171 86.157 11.62C86.157 12.0689 86.0008 12.4527 85.682 12.7715C85.3633 13.0838 84.9794 13.2399 84.5305 13.2399C84.0816 13.2399 83.6978 13.0838 83.3855 12.7715Z" fill="white"/>
+<path d="M92.5195 6.03809H95.9351V18.7245H92.5195V6.03809Z" fill="white"/>
+<path d="M97.939 23.0445L98.1146 20.3186C98.9409 20.4747 99.8452 20.5528 100.828 20.5528C102.578 20.5528 103.456 19.9477 103.456 18.7311V18.7116H102.63C99.3442 18.7116 97.6982 17.3389 97.6982 14.5934C97.6982 13.2858 98.0886 12.2188 98.8758 11.3926C99.7736 10.4557 101.075 9.9873 102.779 9.9873C104.347 9.9873 105.681 10.1955 106.767 10.6119V16.0507H108.205V18.7116H106.748C106.657 20.1364 106.104 21.2294 105.095 21.9971C104.041 22.8038 102.532 23.2071 100.561 23.2071C99.6955 23.2071 98.8172 23.1486 97.9325 23.0315L97.939 23.0445ZM103.456 12.8694C103.189 12.7263 102.857 12.6612 102.454 12.6612C102.018 12.6612 101.68 12.8238 101.426 13.1556C101.198 13.4614 101.081 13.8388 101.081 14.3007C101.081 15.4782 101.699 16.0637 102.935 16.0637H103.456V12.8759V12.8694Z" fill="white"/>
+<path d="M107.938 16.0635H111.699V18.7244H107.938V16.0635Z" fill="white"/>
+<path d="M111.334 16.0635H115.095V18.7244H111.334V16.0635Z" fill="white"/>
+<path d="M114.737 16.0635H118.497V18.7244H114.737V16.0635Z" fill="white"/>
+<path d="M118.133 16.0635H121.894V18.7244H118.133V16.0635Z" fill="white"/>
+<path d="M121.536 16.0633H124.593V10.2666H128.009V18.7242H121.536V16.0633ZM124.171 22.5561C123.871 22.8684 123.5 23.0245 123.065 23.0245C122.629 23.0245 122.271 22.8684 121.978 22.5561C121.685 22.2438 121.536 21.8665 121.536 21.4241C121.536 20.9817 121.679 20.6174 121.978 20.3116C122.277 19.9993 122.642 19.8432 123.065 19.8432C123.487 19.8432 123.871 19.9993 124.171 20.3116C124.463 20.6239 124.613 20.9947 124.613 21.4241C124.613 21.8535 124.463 22.2438 124.171 22.5561ZM127.625 22.5561C127.332 22.8684 126.968 23.0245 126.539 23.0245C126.109 23.0245 125.738 22.8684 125.439 22.5561C125.14 22.2438 124.99 21.8665 124.99 21.4241C124.99 20.9817 125.14 20.6174 125.439 20.3116C125.738 19.9993 126.103 19.8432 126.539 19.8432C126.975 19.8432 127.332 19.9993 127.625 20.3116C127.918 20.6239 128.068 20.9947 128.068 21.4241C128.068 21.8535 127.918 22.2438 127.625 22.5561Z" fill="white"/>
+<path d="M129.674 16.0636H134.372C134.28 15.1592 133.91 14.4046 133.266 13.7865C132.589 13.1359 131.678 12.7196 130.553 12.5309L131.346 9.71387C135.595 10.5661 137.716 13.0318 137.716 17.111V18.7244H129.674V16.0636Z" fill="white"/>
+<path d="M15.3145 22.2177C14.0849 23.2717 12.53 23.7986 10.6433 23.7986C9.11443 23.7986 7.81326 23.662 6.72679 23.3953L7.10413 19.2445C8.28819 19.7455 9.49827 19.9992 10.7344 19.9992C11.7493 19.9992 12.2567 19.6284 12.2567 18.8802C12.2567 18.3858 11.951 17.9824 11.3329 17.6766C11.1247 17.5725 10.8124 17.4359 10.3961 17.2733C9.8626 17.0846 9.49827 16.948 9.3096 16.8634C7.33834 16.0307 6.35596 14.5864 6.35596 12.524C6.35596 10.9366 6.93498 9.68098 8.08651 8.75715C9.26406 7.82682 10.8775 7.3584 12.9399 7.3584C13.9743 7.3584 14.9437 7.46249 15.848 7.66417L15.4836 11.431C14.5923 11.1188 13.688 10.9626 12.7837 10.9626C11.6322 10.9626 11.0532 11.3204 11.0532 12.0296C11.0532 12.4525 11.372 12.8168 12.003 13.1421C12.2112 13.2397 12.53 13.3828 12.9724 13.565L14.0914 14.0204C16.1212 14.9442 17.1361 16.369 17.1361 18.3012C17.1361 19.8756 16.5311 21.1768 15.3145 22.2177Z" fill="white"/>
+<path d="M28.4238 17.0324C27.2267 18.2229 25.5482 18.815 23.3883 18.815C23.1671 18.815 22.9719 18.8085 22.8028 18.7889V23.4796H18.4438V7.67049C20.0052 7.58591 21.7033 7.54688 23.5249 7.54688C27.8903 7.54688 30.0698 9.29694 30.0698 12.7971C30.0698 14.5276 29.5233 15.9394 28.4238 17.0324ZM23.4143 11.1186C23.2451 11.1186 23.0435 11.1251 22.8093 11.1446V15.1522C23.0305 15.1977 23.2907 15.2238 23.59 15.2238C24.9171 15.2238 25.5807 14.5341 25.5807 13.1614C25.5807 11.7887 24.8586 11.1251 23.4208 11.1251L23.4143 11.1186Z" fill="white"/>
+<path d="M43.8817 21.4829C42.3659 23.0378 40.4662 23.8185 38.1956 23.8185C35.7559 23.8185 33.9018 23.1158 32.6331 21.7041C31.4035 20.3378 30.792 18.3991 30.792 15.8944C30.792 13.3896 31.5792 11.2817 33.1471 9.66828C34.663 8.1199 36.5562 7.3457 38.8202 7.3457C41.2599 7.3457 43.1205 8.04833 44.3957 9.4601C45.6253 10.8198 46.2368 12.752 46.2368 15.2633C46.2368 17.7745 45.4496 19.8889 43.8817 21.4894V21.4829ZM38.5469 11.3208C37.5841 11.3208 36.8294 11.6786 36.2699 12.3942C35.7104 13.1294 35.4372 14.1508 35.4372 15.4715C35.4372 18.3536 36.4521 19.7979 38.4819 19.7979C39.4447 19.7979 40.1994 19.4465 40.7459 18.7439C41.3119 18.0218 41.5917 17.0004 41.5917 15.6797C41.5917 12.7716 40.5768 11.3208 38.5469 11.3208Z" fill="white"/>
+<path d="M55.1305 23.4862L52.2028 17.722H51.9946V23.4862H47.6357V7.67049C48.8653 7.58591 50.6675 7.54688 53.0486 7.54688C57.2383 7.54688 59.3332 9.19285 59.3332 12.4913C59.3332 13.4542 59.0795 14.3325 58.5785 15.1262C58.0581 15.9394 57.3685 16.5119 56.4967 16.8307C56.9651 17.5333 57.3424 18.1449 57.6417 18.6588L60.4327 23.4862H55.137H55.1305ZM52.8209 11.1381C52.4631 11.1381 52.1898 11.1511 51.9946 11.1836V14.5797C52.2158 14.6122 52.4566 14.6252 52.7168 14.6252C54.07 14.6252 54.7401 14.0202 54.7401 12.8166C54.7401 11.6976 54.1025 11.1316 52.8209 11.1316V11.1381Z" fill="white"/>
+<path d="M67.719 11.4186V23.4869H63.3601V11.4186H59.938V7.67773H71.141V11.4186H67.719Z" fill="white"/>
+</g>
+<defs>
+<linearGradient id="paint0_linear_5_10489" x1="0" y1="15.3733" x2="75.357" y2="15.3733" gradientUnits="userSpaceOnUse">
+<stop stop-color="#005D6B"/>
+<stop offset="1" stop-color="#1DB9AB"/>
+</linearGradient>
+<clipPath id="clip0_5_10489">
+<rect width="144" height="30.7465" fill="white"/>
+</clipPath>
+</defs>
+</svg>

public/images/tunis_auth_logo_mobile.svg

@@ -0,0 +1,29 @@
+<svg width="102" height="75" viewBox="0 0 102 75" fill="none" xmlns="http://www.w3.org/2000/svg">
+<g clip-path="url(#clip0_8_12573)">
+<path d="M87.7871 0H14.2129C6.36333 0 0 6.37899 0 14.2479V47.1045C0 54.9734 6.36333 61.3524 14.2129 61.3524H87.7871C95.6367 61.3524 102 54.9734 102 47.1045V14.2479C102 6.37899 95.6367 0 87.7871 0Z" fill="#0B2E4D"/>
+<path d="M88.6677 33.2715H13.3323C5.96907 33.2715 0 39.2553 0 46.6366V61.626C0 69.0074 5.96907 74.9911 13.3323 74.9911H88.6677C96.0309 74.9911 102 69.0074 102 61.626V46.6366C102 39.2553 96.0309 33.2715 88.6677 33.2715Z" fill="url(#paint0_linear_8_12573)"/>
+<path d="M26.3565 21.1689C26.3565 26.5538 23.838 29.2551 18.801 29.2551C14.169 29.2551 11.853 26.8805 11.853 22.1223C11.853 20.8511 12.038 19.5182 12.4078 18.1146L17.1895 17.2583C16.7139 18.8031 16.4762 20.2773 16.4762 21.681C16.4762 24.3204 17.348 25.6358 19.1004 25.6358C20.0338 25.6358 20.6943 25.3444 21.0905 24.753C21.5044 24.1262 21.707 23.0404 21.707 21.4867V12.1559H26.3477V21.1689H26.3565ZM17.031 15.5545C16.5995 15.122 16.3881 14.6011 16.3881 13.992C16.3881 13.3829 16.5995 12.8621 17.031 12.4295C17.4536 12.0058 17.9644 11.7939 18.5808 11.7939C19.1972 11.7939 19.708 12.0058 20.1395 12.4295C20.571 12.8621 20.7823 13.3829 20.7823 13.992C20.7823 14.6011 20.571 15.122 20.1395 15.5545C19.708 15.9783 19.1884 16.1901 18.5808 16.1901C17.9732 16.1901 17.4536 15.9783 17.031 15.5545Z" fill="white"/>
+<path d="M29.3945 6.42676H34.0177V23.6407H29.3945V6.42676Z" fill="white"/>
+<path d="M36.7301 29.5023L36.9679 25.8035C38.0862 26.0154 39.3103 26.1213 40.64 26.1213C43.0088 26.1213 44.1976 25.3003 44.1976 23.6496V23.6231H43.0792C38.6322 23.6231 36.4043 21.7604 36.4043 18.0352C36.4043 16.2608 36.9327 14.8131 37.9982 13.6919C39.2134 12.4207 40.9746 11.7852 43.2818 11.7852C45.404 11.7852 47.2093 12.0676 48.6799 12.6326V20.0126H50.626V23.6231H48.6535C48.5302 25.5563 47.7817 27.0394 46.4167 28.0811C44.9902 29.1757 42.9472 29.723 40.2789 29.723C39.1077 29.723 37.9189 29.6436 36.7213 29.4847L36.7301 29.5023ZM44.1976 15.6958C43.8366 15.5016 43.3875 15.4133 42.8415 15.4133C42.2515 15.4133 41.7936 15.634 41.4501 16.0842C41.1419 16.4991 40.9834 17.0111 40.9834 17.6379C40.9834 19.2357 41.82 20.0302 43.4931 20.0302H44.1976V15.7046V15.6958Z" fill="white"/>
+<path d="M50.2646 20.0303H55.3545V23.6408H50.2646V20.0303Z" fill="white"/>
+<path d="M54.8613 20.0303H59.9512V23.6408H54.8613V20.0303Z" fill="white"/>
+<path d="M59.4673 20.0303H64.5572V23.6408H59.4673V20.0303Z" fill="white"/>
+<path d="M64.0728 20.0303H69.1626V23.6408H64.0728V20.0303Z" fill="white"/>
+<path d="M68.6694 20.0305H72.8083V12.1562H77.4314V23.6322H68.6694V20.0217V20.0305ZM72.2359 28.8406C71.8308 29.2643 71.3288 29.4762 70.7388 29.4762C70.1488 29.4762 69.6645 29.2643 69.2682 28.8406C68.872 28.4168 68.6694 27.9048 68.6694 27.3046C68.6694 26.7043 68.8632 26.2099 69.2682 25.795C69.6733 25.3713 70.1665 25.1594 70.7388 25.1594C71.3112 25.1594 71.8308 25.3713 72.2359 25.795C72.6321 26.2187 72.8347 26.7219 72.8347 27.3046C72.8347 27.8872 72.6321 28.4168 72.2359 28.8406ZM76.9119 28.8406C76.5156 29.2643 76.0224 29.4762 75.4412 29.4762C74.8601 29.4762 74.3581 29.2643 73.953 28.8406C73.548 28.4168 73.3454 27.9048 73.3454 27.3046C73.3454 26.7043 73.548 26.2099 73.953 25.795C74.3581 25.3713 74.8512 25.1594 75.4412 25.1594C76.0313 25.1594 76.5156 25.3713 76.9119 25.795C77.3081 26.2187 77.5107 26.7219 77.5107 27.3046C77.5107 27.8872 77.3081 28.4168 76.9119 28.8406Z" fill="white"/>
+<path d="M79.6855 20.0299H86.0435C85.9202 18.8028 85.4183 17.7788 84.5465 16.9402C83.6306 16.0574 82.3978 15.4925 80.8744 15.2364L81.9487 11.4141C87.699 12.5705 90.5698 15.9162 90.5698 21.4511V23.6404H79.6855V20.0299Z" fill="white"/>
+<path d="M20.7294 63.4183C19.0651 64.8484 16.9604 65.5634 14.4067 65.5634C12.3373 65.5634 10.5761 65.378 9.10546 65.0161L9.61621 59.384C11.2189 60.0638 12.8568 60.408 14.53 60.408C15.9037 60.408 16.5906 59.9049 16.5906 58.8897C16.5906 58.2188 16.1767 57.6715 15.3401 57.2566C15.0583 57.1153 14.6356 56.9299 14.072 56.7092C13.35 56.4532 12.8568 56.2679 12.6014 56.1531C9.93322 55.0232 8.60352 53.0634 8.60352 50.265C8.60352 48.1111 9.38725 46.4073 10.9459 45.1538C12.5398 43.8915 14.7237 43.2559 17.5152 43.2559C18.9154 43.2559 20.2274 43.3971 21.4515 43.6708L20.9583 48.782C19.7519 48.3583 18.5279 48.1464 17.3039 48.1464C15.7452 48.1464 14.9615 48.6319 14.9615 49.5941C14.9615 50.1679 15.3929 50.6623 16.2471 51.1037C16.5289 51.2361 16.9604 51.4303 17.5592 51.6775L19.0739 52.2954C21.8213 53.5489 23.1951 55.4822 23.1951 58.104C23.1951 60.2403 22.3761 62.0059 20.7294 63.4183Z" fill="white"/>
+<path d="M38.4733 56.3913C36.853 58.0068 34.581 58.8101 31.6574 58.8101C31.358 58.8101 31.0938 58.8013 30.8649 58.7748V65.1395H24.9648V43.6794C27.0783 43.5647 29.3767 43.5117 31.8423 43.5117C37.7512 43.5117 40.7012 45.8864 40.7012 50.6357C40.7012 52.9838 39.9615 54.8994 38.4733 56.3825V56.3913ZM31.6926 48.3669C31.4637 48.3669 31.1907 48.3758 30.8737 48.4023V53.8401C31.1731 53.9019 31.5253 53.9372 31.9304 53.9372C33.7268 53.9372 34.625 53.0015 34.625 51.1388C34.625 49.2762 33.6476 48.3758 31.7014 48.3758L31.6926 48.3669Z" fill="white"/>
+<path d="M59.3964 62.4296C57.3446 64.5394 54.7732 65.5988 51.6999 65.5988C48.3977 65.5988 45.888 64.6454 44.1708 62.7298C42.5065 60.876 41.6787 58.2453 41.6787 54.8466C41.6787 51.448 42.7442 48.5878 44.8665 46.3986C46.9183 44.2976 49.4808 43.2471 52.5453 43.2471C55.8476 43.2471 58.3661 44.2005 60.0921 46.1161C61.7564 47.9611 62.5842 50.5829 62.5842 53.9904C62.5842 57.3978 61.5186 60.2668 59.3964 62.4385V62.4296ZM52.1755 48.6408C50.8722 48.6408 49.8507 49.1263 49.0934 50.0974C48.3361 51.0949 47.9662 52.4808 47.9662 54.2728C47.9662 58.1835 49.3399 60.1433 52.0874 60.1433C53.3907 60.1433 54.4122 59.6666 55.1519 58.7132C55.918 57.7333 56.2967 56.3474 56.2967 54.5553C56.2967 50.6094 54.9229 48.6408 52.1755 48.6408Z" fill="white"/>
+<path d="M74.6221 65.1395L70.6594 57.3182H70.3776V65.1395H64.4775V43.6794C66.1419 43.5647 68.5811 43.5117 71.8041 43.5117C77.4752 43.5117 80.3107 45.7451 80.3107 50.2208C80.3107 51.5273 79.9673 52.719 79.2892 53.796C78.5848 54.8994 77.6513 55.6763 76.4713 56.1088C77.1054 57.0622 77.6161 57.892 78.0212 58.5894L81.799 65.1395H74.6309H74.6221ZM71.4959 48.3846C71.0116 48.3846 70.6417 48.4023 70.3776 48.4464V53.0544C70.677 53.0986 71.0028 53.1162 71.355 53.1162C73.1867 53.1162 74.0937 52.2953 74.0937 50.6621C74.0937 49.1438 73.2307 48.3758 71.4959 48.3758V48.3846Z" fill="white"/>
+<path d="M91.6619 48.7644V65.1397H85.7618V48.7644H81.1299V43.6885H96.2938V48.7644H91.6619Z" fill="white"/>
+</g>
+<defs>
+<linearGradient id="paint0_linear_8_12573" x1="0" y1="54.1401" x2="102" y2="54.1401" gradientUnits="userSpaceOnUse">
+<stop stop-color="#005D6B"/>
+<stop offset="1" stop-color="#1DB9AB"/>
+</linearGradient>
+<clipPath id="clip0_8_12573">
+<rect width="102" height="75" fill="white"/>
+</clipPath>
+</defs>
+</svg>

public/index.html

@@ -42,6 +42,13 @@
           name="msapplication-config"
           content="%PUBLIC_URL%/clients/%REACT_APP_CLIENT%/favicon/browserconfig.xml" />
     <% } %>
+    <!-- Google Tag Manager -->
+    <script>(function(w,d,s,l,i){w[l]=w[l]||[];w[l].push({'gtm.start':
+              new Date().getTime(),event:'gtm.js'});var f=d.getElementsByTagName(s)[0],
+            j=d.createElement(s),dl=l!='dataLayer'?'&l='+l:'';j.async=true;j.src=
+            'https://www.googletagmanager.com/gtm.js?id='+i+dl;f.parentNode.insertBefore(j,f);
+    })(window,document,'script','dataLayer','GTM-5K7GHJB');</script>
+    <!-- End Google Tag Manager -->
   </head>
   <body>
     <noscript>You need to enable JavaScript to run this app.</noscript>
@@ -59,5 +66,11 @@
     <!-- Start of ChromeCast script -->
     <script src="//www.gstatic.com/cv/js/sender/v1/cast_sender.js?loadCastFramework=1"></script>
     <!-- End of ChromeCast script -->
+    <!-- Google Tag Manager (noscript) -->
+    <noscript>
+      <iframe src="https://www.googletagmanager.com/ns.html?id=GTM-5K7GHJB"
+                      height="0" width="0" style="display:none;visibility:hidden"></iframe>
+    </noscript>
+    <!-- End Google Tag Manager (noscript) -->
   </body>
 </html>

public/silent-refresh.html

@@ -1,15 +1,28 @@
 <!DOCTYPE html>
 <html lang="en">
+
 <head>
   <title></title>
 </head>
+
 <body>
-  <script src="https://cdnjs.cloudflare.com/ajax/libs/oidc-client/1.11.5/oidc-client.min.js" integrity="sha512-pGtU1n/6GJ8fu6bjYVGIOT9Dphaw5IWPwVlqkpvVgqBxFkvdNbytUh0H8AP15NYF777P4D3XEeA/uDWFCpSQ1g==" crossorigin="anonymous" referrerpolicy="no-referrer"></script>
+  <script src="https://cdnjs.cloudflare.com/ajax/libs/oidc-client/1.11.5/oidc-client.min.js"
+    integrity="sha512-pGtU1n/6GJ8fu6bjYVGIOT9Dphaw5IWPwVlqkpvVgqBxFkvdNbytUh0H8AP15NYF777P4D3XEeA/uDWFCpSQ1g=="
+    crossorigin="anonymous" referrerpolicy="no-referrer"></script>
   <script>
     new Oidc.UserManager().signinSilentCallback()
-        .catch((err) => {
-            console.error('OIDC: silent refresh callback error', err);
-        });
+      // обновляем рефреш токен в локалсторадже
+      // так как safari не дает доступ к кукам
+      .then(() => {
+        const refreshToken = localStorage.getItem('refresh_token');
+        if (refreshToken) {
+          localStorage.setItem('refresh_token', new URLSearchParams(document.location.search).get('refresh_token'));
+        }
+      })
+      .catch((err) => {
+        console.error('OIDC: silent refresh callback error', err);
+      });
   </script>
 </body>
-</html>
+
+</html>

run.sh

@@ -1,9 +0,0 @@
-#!/bin/bash
-
-branch=$1
-composefile=$2
-
-cd /home/ubuntu/ott-auth
-docker-compose -f $composefile down
-docker-compose -f $composefile up -d
-echo "[>] Deployment done."

src/components/AccessTimer/index.tsx

@@ -0,0 +1,128 @@
+import {
+  useEffect,
+  useState,
+  RefObject,
+} from 'react'
+
+import { T9n } from 'features/T9n'
+import { Icon } from 'features/Icon'
+import { useAuthStore } from 'features/AuthStore'
+
+import {
+  AccessTimerContainer,
+  PreviewInfo,
+  SignInBtn,
+  SignText,
+  Timer,
+  TimerContainer,
+} from './styled'
+
+import { SimplePopup } from '../SimplePopup'
+import { secondsToHms } from '../../helpers'
+import { getViewMatchDuration } from '../../requests/getViewMatchDuration'
+import { usePageParams } from '../../hooks'
+import { getUserInfo } from '../../requests'
+
+type AccessTimerType = {
+  access: boolean,
+  isFullscreen: boolean,
+  onFullscreenClick: () => void,
+  playing: boolean,
+  videoRef?: RefObject<HTMLVideoElement> | null,
+}
+
+const ACCESS_TIME = 60
+
+export const AccessTimer = ({
+  access,
+  isFullscreen,
+  onFullscreenClick,
+  playing,
+  videoRef,
+}: AccessTimerType) => {
+  const {
+    logout,
+    setUserInfo,
+    userInfo,
+  } = useAuthStore()
+
+  const { profileId, sportType } = usePageParams()
+
+  const [timeIsFinished, setTimeIsFinished] = useState(true)
+  const [time, setTime] = useState(ACCESS_TIME)
+  const isTimeExpired = time <= 0 || !access
+
+  useEffect(() => {
+    if (isTimeExpired) {
+      document.pictureInPictureEnabled && document.exitPictureInPicture()
+      setTimeIsFinished(true)
+      videoRef?.current?.pause()
+      setTime(0)
+      if (isFullscreen) onFullscreenClick()
+    }
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+  }, [access, playing, profileId])
+
+  useEffect(() => {
+    let stopWatch: ReturnType<typeof setInterval> | null = null
+    if (playing) {
+      stopWatch = setInterval(() => {
+        setTime((prev) => prev - 1)
+      }, 1000)
+    } else {
+      stopWatch && clearInterval(stopWatch)
+    }
+    return () => {
+      stopWatch && clearInterval(stopWatch)
+    }
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+  }, [playing, profileId])
+
+  useEffect(() => {
+    (async () => {
+      setTime(ACCESS_TIME)
+      const updatedUserInfo = await getUserInfo()
+      setUserInfo(updatedUserInfo)
+      const timeViewed = await getViewMatchDuration({
+        matchId: profileId,
+        sportType,
+        userId: Number(updatedUserInfo?.email),
+      })
+      setTime(isTimeExpired ? 0 : (ACCESS_TIME - Number(timeViewed.duration)))
+    })()
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+  }, [profileId])
+
+  return (
+    <>
+      {(!userInfo || Number(userInfo?.email) < 0) && access && time > 0
+        ? (
+          <AccessTimerContainer isFullscreen={isFullscreen}>
+            <TimerContainer>
+              <PreviewInfo>
+                <Timer>{secondsToHms(time)}&nbsp;</Timer>
+                <T9n t='game_preview' className='gamePreview' />
+              </PreviewInfo>
+              <SignText>
+                <T9n t='sign_in_full_game' />
+              </SignText>
+            </TimerContainer>
+            <SignInBtn onClick={() => logout('saveToken')} id='match_register'>
+              <T9n t='sign_in' />
+            </SignInBtn>
+          </AccessTimerContainer>
+        )
+        : (
+          <SimplePopup
+            isModalOpen={timeIsFinished}
+            withCloseButton={false}
+            headerName='sec_60'
+            mainText='continue_watching'
+            buttonName='sign_in'
+            onHandle={() => logout('saveToken')}
+            icon={<Icon refIcon='ExclamationPoint' />}
+          />
+        )}
+    </>
+  )
+}

src/components/AccessTimer/styled.tsx

@@ -0,0 +1,124 @@
+import styled, { css } from 'styled-components/macro'
+
+import { isMobileDevice } from 'config'
+
+import { ButtonSolid } from 'features/Common'
+
+export const AccessTimerContainer = styled.div<{isFullscreen?: boolean}>`
+  display: flex;
+  align-items: center;
+  
+  position: absolute;
+  left: 50%;
+  bottom: 5.7rem;
+  transform: translateX(-50%);
+  background-color: #333333;
+  border-radius: 5px;
+  padding: 20px 50px;
+  
+  gap: 40px;
+
+  ${isMobileDevice
+    ? css`
+        padding: 9px 7px 9px 15px;
+         bottom: 6.5rem;
+
+        @media screen and (orientation: landscape) {
+          max-width: 95%;
+          bottom: 4rem;
+        }
+      `
+    : ''};
+  
+  ${({ isFullscreen }) => isFullscreen && css`
+    ${isMobileDevice
+    ? css`
+        padding: 9px 7px 9px 15px;
+         bottom: 12rem;
+
+        @media screen and (orientation: landscape) {
+          max-width: 95%;
+          bottom: 6rem;
+        }
+      `
+    : ''};
+  `}
+`
+
+export const SignInBtn = styled(ButtonSolid)`
+  width: 246px;
+  border-radius: 5px;
+  height: 50px;
+  font-weight: 600;
+  font-size: 20px;
+  white-space: nowrap;
+  padding: 0 35px;
+
+  ${isMobileDevice
+    ? css`
+      font-size: 12px;
+      white-space: nowrap;
+      padding: 0px 16px;
+      width: 140px;
+      height: 30px;
+
+            @media screen and (orientation: landscape) {
+              font-size: 12px;
+              padding: 0px 8px;
+            }
+      `
+    : ''};
+
+`
+
+export const TimerContainer = styled.div`
+  color: white;
+  font-weight: 700;
+  font-size: 20px;
+  line-height: 24px;
+  white-space: nowrap;
+  max-width: 215px;
+
+  ${isMobileDevice
+    ? css`
+      font-size: 12px;
+            line-height: 28px;
+      `
+    : ''};
+`
+
+export const PreviewInfo = styled.div`
+  display: flex;
+  line-height: 24px;
+
+  ${isMobileDevice
+    ? css`
+       line-height: 14px;
+      `
+    : ''};
+`
+
+export const Timer = styled.div`
+  min-width: 67px;
+
+  ${isMobileDevice
+    ? css`
+       min-width: 40px;
+      `
+    : ''};
+`
+
+export const SignText = styled.span`
+  display: block;
+  font-size: 16px;
+  line-height: 20px;
+  font-weight: 400;
+  white-space: break-spaces;
+
+  ${isMobileDevice
+    ? css`
+      font-size: 9px;
+      line-height: 14px
+      `
+    : ''};
+`

src/components/Ads/components/AdComponent/hooks.tsx

@@ -0,0 +1,163 @@
+import { useEffect, useState } from 'react'
+
+import ReactGA from 'react-ga'
+
+import { updateAdsView } from 'requests'
+
+import { useToggle } from 'hooks'
+
+import { getLocalStorageItem, isMatchPage } from 'helpers'
+
+import {
+  device,
+  COUNTRY,
+} from 'config'
+
+import { useMatchPageStore } from 'features/MatchPage/store'
+
+import type { AdComponentType } from './index'
+
+import { checkVideo } from '../../helpers'
+import {
+  adsViews,
+  EventGA,
+  ViewsType,
+} from '../../types'
+
+const countryCode = getLocalStorageItem(COUNTRY)
+
+export const useAd = ({ ad }: AdComponentType) => {
+  const isMatch = isMatchPage()
+
+  const [isOpenAd, setIsOpenAd] = useState(isMatch)
+  const [isNeedToShow, setIsNeedToShow] = useState(isMatch)
+  const [shownTime, setShownTime] = useState(0)
+
+  const { isFullscreen } = useMatchPageStore()
+
+  const views = getLocalStorageItem(adsViews) as ViewsType
+  const {
+    duration,
+    frequency,
+    id,
+    media,
+    name,
+    time_close,
+  } = ad
+
+  const {
+    close,
+    isOpen: isOpenCloseBtn,
+    open: showCloseBtn,
+  } = useToggle()
+
+  const isNeedBanner = Number(views?.HOME) % frequency === 0
+  const isVideo = checkVideo(media.url)
+  const currentAdsTime = duration - shownTime
+
+  useEffect(() => {
+    if (!isFullscreen) {
+      if (currentAdsTime === 0) {
+        setShownTime(0)
+      } else {
+        const stopWatch = setInterval(() => {
+          setShownTime((prev) => prev + 1)
+        }, 1000)
+        return () => clearInterval(stopWatch)
+      }
+    }
+    return undefined
+  }, [
+    isFullscreen,
+    currentAdsTime,
+  ])
+
+  const handleClose = () => {
+    setIsOpenAd(false)
+    isMatch && setIsNeedToShow(false)
+    sendBannerClickEvent(EventGA.CLOSE)
+  }
+
+  const sendBannerClickEvent = (event: EventGA) => {
+    ReactGA.initialize('Advertisement')
+    ReactGA.event({
+      action: event,
+      category: 'Advertisement',
+      label: `${name}_${countryCode ?? ''}_${device}`,
+      value: id,
+    })
+  }
+
+  useEffect(() => {
+    setShownTime(0)
+
+    if (isMatch) {
+      const interval = setInterval(() => {
+        setIsNeedToShow(true)
+        setIsOpenAd(true)
+      }, frequency * 1000)
+
+      return () => clearInterval(interval)
+    }
+
+    setIsNeedToShow(isNeedBanner)
+    return setIsOpenAd(isNeedBanner)
+  }, [
+    frequency,
+    isNeedToShow,
+    views?.HOME,
+    isNeedBanner,
+    isMatch,
+  ])
+
+  useEffect(() => {
+    if (isFullscreen || !isOpenAd) return undefined
+
+    const timeoutCloseAd = setTimeout(handleClose, currentAdsTime * 1000)
+    return () => {
+      clearTimeout(timeoutCloseAd)
+    }
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+  }, [
+    isNeedToShow,
+    isOpenAd,
+    isFullscreen,
+    currentAdsTime,
+  ])
+
+  useEffect(() => {
+    close()
+    const timeoutCloseBtn = time_close && setTimeout(showCloseBtn, time_close * 1000)
+    return () => {
+      time_close && clearTimeout(timeoutCloseBtn)
+    }
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+  }, [
+    isNeedToShow,
+    isOpenAd,
+    views?.HOME,
+  ])
+
+  useEffect(() => {
+    if (!isNeedToShow || (!isMatch && !isNeedBanner)) return
+
+    (async () => {
+      await updateAdsView({ adv_id: id })
+    })()
+    sendBannerClickEvent(EventGA.DISPLAY)
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+  }, [
+    id,
+    isNeedToShow,
+    isMatch,
+  ])
+
+  return {
+    handleClose,
+    isNeedToShow,
+    isOpenAd,
+    isOpenCloseBtn,
+    isVideo,
+    sendBannerClickEvent,
+  }
+}

src/components/Ads/components/AdComponent/index.tsx

@@ -0,0 +1,91 @@
+import type { MouseEvent } from 'react'
+import { memo } from 'react'
+
+import type { AdType } from 'requests'
+
+import { useLexicsStore } from 'features/LexicsStore'
+
+import { useAd } from './hooks'
+
+import { EventGA } from '../../types'
+
+import {
+  AdImg,
+  AdVideo,
+  AdWrapper,
+  LinkWrapper,
+  AdsCloseButton,
+} from './styled'
+
+export type AdComponentType = {
+  ad: AdType,
+}
+export const AdComponent = memo(({ ad }: AdComponentType) => {
+  const {
+    link,
+    media,
+    position,
+  } = ad
+
+  const {
+    handleClose,
+    isNeedToShow,
+    isOpenAd,
+    isOpenCloseBtn,
+    isVideo,
+    sendBannerClickEvent,
+  } = useAd({ ad })
+
+  const { suffix } = useLexicsStore()
+
+  const close = (e: MouseEvent<HTMLButtonElement>) => {
+    e.stopPropagation()
+    handleClose()
+  }
+
+  const onLinkClick = () => {
+    link && sendBannerClickEvent(EventGA.CLICK)
+  }
+
+  return (
+    position && isOpenAd && isNeedToShow
+      ? (
+        <AdWrapper
+          position={position.id}
+          isOpenAd={isOpenAd}
+        >
+          {isOpenCloseBtn && (
+            <AdsCloseButton
+              onClick={close}
+              size={12}
+              position={position.id}
+            />
+          )}
+          <LinkWrapper
+            href={link}
+            target='_blank'
+            rel='noreferrer'
+            onClick={onLinkClick}
+          >
+            {isVideo
+              ? (
+                <AdVideo
+                  muted={isVideo}
+                  autoPlay={isVideo}
+                  loop={isVideo}
+                  src={media.url}
+                  position={position.id}
+                />
+              )
+              : (
+                <AdImg
+                  src={media.url}
+                  position={position.id}
+                  alt={`name_${suffix}`}
+                />
+              )}
+          </LinkWrapper>
+        </AdWrapper>
+      ) : null
+  )
+})

src/components/Ads/components/AdComponent/styled.tsx

@@ -0,0 +1,109 @@
+import styled, { css } from 'styled-components/macro'
+
+import includes from 'lodash/includes'
+
+import { CloseButton } from 'features/PopupComponents'
+
+import {
+  MATCH_ADS,
+  PLAYER_ADS,
+  VIEW_ADS,
+} from '../../types'
+
+type Props = {
+  position: number,
+}
+
+const header = [7, 8, 9]
+
+const chooseStyle = (type: number) => {
+  switch (true) {
+    case VIEW_ADS.COLUMN === type:
+      return 'grid-row: 1 / 3; img {max-height: none;}'
+    case VIEW_ADS.ROW === type:
+      return 'grid-column: 1 / 3'
+    case VIEW_ADS.SQUARE === type:
+      return 'grid-row: 1 / 3; grid-column: 1 / 3; img {max-height: none;}'
+    case VIEW_ADS.SECOND_COLUMN === type:
+      return 'grid-column: 2 / 3; grid-row: 1 / 1'
+    case VIEW_ADS.SECOND_ROW === type:
+      return 'grid-column: 1 / 2; grid-row: 2 / 3;'
+    case MATCH_ADS.PLAYS_TOP === type:
+      return 'margin-left: 14px; height: 48px'
+    case MATCH_ADS.PLAYS_BOTTOM === type:
+      return 'grid-row: 4; margin-bottom: 12px; height: 48px;'
+    case PLAYER_ADS.LEFT_BOTTOM === type:
+      return css`
+        height: auto; 
+        width: 42.4%; 
+        bottom: 100px; 
+        left: 20px; 
+      `
+    case PLAYER_ADS.CENTER_BOTTOM === type:
+      return css`
+        height: 18.3%; 
+        width: 81.3%; 
+        bottom: 100px; 
+        left: 50%; 
+        transform: translateX(-50%);
+      `
+    case PLAYER_ADS.RIGHT === type:
+      return css`
+        height: 87.2%; 
+        width: 18.3%; 
+        bottom: 90px; 
+        right: 18px;
+      `
+    case PLAYER_ADS.FULL_SCREEN === type:
+      return 'bottom: 0; left: 0;'
+    default:
+      return ''
+  }
+}
+
+export const AdImg = styled.img<Props>`
+  width: 100%;
+  min-height: ${({ position }) => (!includes(header, position) && '100%')};
+  max-height: ${({ position }) => (includes(header, position) ? '13rem' : '100%')};
+  cursor: pointer;
+  border-radius: 3px;
+`
+
+export const AdVideo = styled.video<Props>`
+  object-fit: contain;
+  width: 100%;
+  cursor: pointer;
+  max-height: ${({ position }) => (includes(header, position) ? '283px' : '100%')};
+  background-color: black;
+  border-radius: 3px;
+`
+
+export const AdWrapper = styled.div<Props & {isOpenAd: boolean}>`
+  position: ${({ position }) => (includes(PLAYER_ADS, position) ? 'absolute' : 'relative')};
+  width: 100%;
+  height: 100%;
+  z-index: 1;
+  
+  ${({ position }) => chooseStyle(position)};
+  
+  display: ${({ isOpenAd }) => (isOpenAd ? '' : 'none')};
+`
+
+export const AdsCloseButton = styled(CloseButton)<Props>`
+  position: absolute;
+  right: ${({ position }) => (position === PLAYER_ADS.FULL_SCREEN ? '10px' : '0')};
+  top: ${({ position }) => (position === PLAYER_ADS.FULL_SCREEN ? '10px' : '0')};
+  background: none;
+  border-radius: 0;
+  z-index: 2;
+  cursor: pointer;
+  color: #9B9B9B;
+  width: 28px;
+  height: 28px;
+  
+  :hover {
+    background: none;
+  }
+`
+
+export const LinkWrapper = styled.a``

src/components/Ads/components/MobileAd/index.tsx

@@ -0,0 +1,79 @@
+import type { MouseEvent } from 'react'
+
+import includes from 'lodash/includes'
+
+import type { AdType } from 'requests'
+
+import { useLexicsStore } from 'features/LexicsStore'
+
+import { useAd } from '../AdComponent/hooks'
+import { EventGA, PLAYER_MOBILE_FULL_SCREEN } from '../../types'
+
+import {
+  AdsCloseButton,
+  Img,
+  MobileAdWrapper,
+  Video,
+} from './styled'
+
+type MobileAdTypes = {
+  ad: AdType,
+}
+
+export const MobileAd = ({ ad }: MobileAdTypes) => {
+  const {
+    link,
+    media,
+    position,
+  } = ad
+
+  const { suffix } = useLexicsStore()
+
+  const {
+    handleClose,
+    isNeedToShow,
+    isOpenAd,
+    isOpenCloseBtn,
+    isVideo,
+    sendBannerClickEvent,
+  } = useAd({ ad })
+
+  const close = (e: MouseEvent<HTMLButtonElement>) => {
+    e.stopPropagation()
+    handleClose()
+  }
+
+  const onLinkClick = () => {
+    if (link) {
+      sendBannerClickEvent(EventGA.CLICK)
+      window.open(link, '_blank')
+    }
+  }
+
+  return (
+    position && isOpenAd && isNeedToShow ? (
+      <MobileAdWrapper
+        position={position.id}
+        onClick={onLinkClick}
+      >
+        {isOpenCloseBtn
+            && (
+              <AdsCloseButton
+                position={position.id}
+                onClick={close}
+                size={includes(PLAYER_MOBILE_FULL_SCREEN, position.id) ? 12 : 8}
+              />
+            )}
+        {isVideo
+          ? <Video position={position.id} src={media.url} />
+          : (
+            <Img
+              position={position.id}
+              src={media.url}
+              alt={`name_${suffix}`}
+            />
+          )}
+      </MobileAdWrapper>
+    ) : null
+  )
+}

src/components/Ads/components/MobileAd/styled.tsx

@@ -0,0 +1,115 @@
+import styled, { css } from 'styled-components/macro'
+
+import includes from 'lodash/includes'
+
+import { CloseButton } from 'features/PopupComponents'
+
+import {
+  MATCH_ADS,
+  PLAYER_MOBILE_FULL_SCREEN,
+  PLAYER_MOBILE_ADS,
+  MATCH_PAGE_MOBILE_ADS,
+  VIEW_ADS,
+} from '../../types'
+
+type Props = {
+  position: number,
+}
+
+const chooseStyle = (type: number) => {
+  switch (type) {
+    case MATCH_ADS.PLAYS_BOTTOM_MOBILE:
+      return css`
+        grid-row: 4; 
+        margin-bottom: 12px; 
+        height: 48px;
+      `
+    case PLAYER_MOBILE_ADS:
+      return css`
+        position: absolute;
+        width: 92%; 
+        bottom: 50px; 
+        left: 15px;
+      `
+    case PLAYER_MOBILE_FULL_SCREEN.VERTICAL_FULL_SCREEN:
+    case PLAYER_MOBILE_FULL_SCREEN.HORIZONTAL_FULL_SCREEN:
+      return css`
+        position: absolute;
+        top: 0;
+        left: 0;
+        height: 100%;
+        padding: 5px; 
+        background-color: rgba(0, 0, 0, 0.7);
+      `
+    case VIEW_ADS.MOBILE_IN_COLLAPSE_FOOTER:
+    case VIEW_ADS.MOBILE_IN_COLLAPSE_HEADER:
+      return 'margin-top: 6px'
+    default:
+      return ''
+  }
+}
+
+export const MobileAdWrapper = styled.div<Props>`
+  position: relative;
+  width: 100%;
+  z-index: ${({ position }) => (includes(PLAYER_MOBILE_FULL_SCREEN, position) ? '101' : '4')};
+  
+  ${({ position }) => chooseStyle(position)};
+`
+
+export const AdsCloseButton = styled(CloseButton)<Props>`
+  position: absolute;
+  right: ${({ position }) => (includes(PLAYER_MOBILE_FULL_SCREEN, position) ? '-5px' : '-10px')};
+  top: ${({ position }) => (includes(PLAYER_MOBILE_FULL_SCREEN, position) ? '15px' : '10px')};
+  background: none;
+  border-radius: 0;
+  transform: translate(-50%, -50%);
+  z-index: 2;
+  color: #9B9B9B;
+`
+
+export const Img = styled.img<Props>`
+  border-radius: 2px;
+  width: 100%;
+
+  object-fit: ${({ position }) => {
+    switch (true) {
+      case position === PLAYER_MOBILE_FULL_SCREEN.VERTICAL_FULL_SCREEN:
+        return 'fill'
+      case position === MATCH_ADS.PLAYS_TOP_MOBILE:
+        return 'contain'
+      default:
+        return 'cover'
+    }
+  }};
+
+  height: ${({ position }) => {
+    switch (true) {
+      case position === 10:
+        return '50px'
+      case includes(MATCH_PAGE_MOBILE_ADS, position):
+        return '100%'
+      default:
+        return '75px'
+    }
+  }}
+`
+
+export const Video = styled.video<Props>`
+  max-height: 100%;
+  object-fit: cover;
+  min-width: 100%;
+  height: ${({ position }) => (position === 10 ? '50px' : '75px')};
+  border-radius: 2px;
+
+  height: ${({ position }) => {
+    switch (true) {
+      case position === 10:
+        return '50px'
+      case position === MATCH_ADS.PLAYS_TOP_MOBILE:
+        return '48px'
+      default:
+        return '75px'
+    }
+  }}
+`

src/components/Ads/helpers/calcMaxDurationAds.tsx

@@ -0,0 +1,16 @@
+import type { AdResponse, AdsListType } from 'requests'
+
+export const calcMaxAdDurationAds = (advertisements: AdResponse) => {
+  const allAds = Object.values(advertisements)
+
+  const combineAds = allAds.reduce((result, currentAd) => {
+    result.push(...currentAd)
+
+    return result
+  }, [] as AdsListType)
+
+  const maxDuration = combineAds
+    .reduce((result, { duration }) => Math.max(result, duration), 0)
+
+  return maxDuration
+}

src/components/Ads/helpers/index.tsx

@@ -0,0 +1 @@
+export * from './isVideo'

src/components/Ads/helpers/isVideo.tsx

@@ -0,0 +1,2 @@
+const regexp = /^https?:\/\/\S+(?:mp4)$/
+export const checkVideo = (url: string) => regexp.test(url)

src/components/Ads/hooks.tsx

@@ -0,0 +1,65 @@
+import { useMemo } from 'react'
+
+import { useQuery } from 'react-query'
+
+import { useRecoilState } from 'recoil'
+
+import { isMobileDevice, querieKeys } from 'config'
+
+import { getAds } from 'requests'
+
+import { isMatchPage } from 'helpers/isMatchPage'
+import { useLang } from 'features/LexicsStore/hooks/useLang'
+import { useAuthStore } from 'features/AuthStore'
+
+import {
+  DeviceType,
+  PageType,
+} from './types'
+import { calcMaxAdDurationAds } from './helpers/calcMaxDurationAds'
+import { adsStore } from '../../pages/HighlightsPage/storeHighlightsAtoms'
+
+type Props = {
+  matchId?: number,
+  sportType?: number,
+  tournamentId?: number,
+}
+
+export const useAds = ({
+  matchId,
+  sportType,
+  tournamentId,
+}: Props) => {
+  const [ads, setAds] = useRecoilState(adsStore)
+  const { lang } = useLang()
+  const { user } = useAuthStore()
+
+  useQuery({
+    enabled: isMatchPage() ? (!!user && !!tournamentId) : !!user,
+    queryFn: async () => {
+      const adsList = await getAds({
+        client_type: isMobileDevice ? DeviceType.MOBILE : DeviceType.WEB,
+        language: lang,
+        type_id: isMatchPage() ? PageType.MATCH : PageType.HOME,
+        ...isMatchPage() && {
+          matches: [{
+            match_id: matchId,
+            sport_id: sportType,
+          }],
+          tournaments: [{
+            sport_id: sportType,
+            tournament_id: tournamentId,
+          }],
+        },
+      })
+      adsList && setAds(adsList)
+      return adsList
+    },
+    queryKey: [querieKeys.ads, matchId],
+    staleTime: useMemo(() => Math.max(calcMaxAdDurationAds(ads), 60 * 1000), [ads]),
+  })
+
+  return {
+    ads,
+  }
+}

src/components/Ads/index.tsx

@@ -0,0 +1,31 @@
+import type { AdType } from 'requests'
+
+import { isMobileDevice } from 'config'
+
+import type { AdsPropsType } from './types'
+import { AdComponent } from './components/AdComponent'
+import { MobileAd } from './components/MobileAd'
+
+import {
+  HeaderWrapAd,
+} from './styled'
+
+export const HeaderAds = ({ ads }: AdsPropsType) => (
+  ads?.length ? (
+    <HeaderWrapAd column={ads?.length}>
+      {ads.map((ad: AdType) => (
+        !isMobileDevice ? (
+          <AdComponent
+            ad={ad}
+            key={ad.id}
+          />
+        ) : (
+          <MobileAd
+            ad={ad}
+            key={ad.id}
+          />
+        )
+      ))}
+    </HeaderWrapAd>
+  ) : null
+)

src/components/Ads/styled.tsx

@@ -0,0 +1,16 @@
+import styled, { css } from 'styled-components/macro'
+
+import { isMobileDevice } from 'config'
+
+export const HeaderWrapAd = styled.div<{column: number}>`
+  width: 100%;
+  margin-bottom: 0.7rem;
+  display: grid;
+  grid-column-gap: 0.9rem;
+  grid-template-columns: ${({ column }) => (column > 1 ? `repeat(${column},${16.3 * 6 / column}%)` : 'repeat(1, 98.7%)')};
+  
+  ${isMobileDevice && css`
+    padding: 0 0.71rem;
+    grid-template-columns: none;
+  `}}
+`

src/components/Ads/types.tsx

@@ -0,0 +1,59 @@
+import type { AdsListType } from 'requests'
+
+export enum PageType {
+  HOME = 1,
+  MATCH = 2,
+}
+
+export enum DeviceType {
+  MOBILE = 'mobile',
+  WEB = 'web'
+}
+
+export type ViewsType = Partial<Record<keyof typeof PageType, number>>
+
+export enum EventGA {
+  CLICK = 'banner_click',
+  CLOSE = 'banner_close',
+  DISPLAY = 'banner_display'
+}
+
+export enum VIEW_ADS {
+  ROW = 4,
+  COLUMN = 5,
+  SQUARE = 6,
+  SECOND_COLUMN = 2,
+  SECOND_ROW = 3,
+  MOBILE_IN_COLLAPSE_HEADER = 12,
+  MOBILE_IN_COLLAPSE_FOOTER = 25
+}
+
+export const HEADER_MOBILE_ADS = [10, 11]
+
+export enum MATCH_ADS {
+  WATCH_TOP = 13,
+  PLAYS_TOP = 14,
+  PLAYS_BOTTOM = 15,
+  PLAYS_TOP_MOBILE = 16,
+  PLAYS_BOTTOM_MOBILE = 17,
+}
+
+export enum PLAYER_ADS {
+  LEFT_BOTTOM = 18,
+  CENTER_BOTTOM = 19,
+  RIGHT = 20,
+  FULL_SCREEN = 21,
+}
+
+export const PLAYER_MOBILE_ADS = 22
+
+export enum PLAYER_MOBILE_FULL_SCREEN {
+  VERTICAL_FULL_SCREEN = 23,
+  HORIZONTAL_FULL_SCREEN = 24,
+}
+
+export const MATCH_PAGE_MOBILE_ADS = [16, 17, 22, 23, 24]
+
+export type AdsPropsType = Record<'ads', AdsListType | undefined>
+
+export const adsViews = 'adsViews'