fix(#713): rustat client

public/images/logo-rustat.svg

@@ -0,0 +1,16 @@
+<svg width="154" height="40" viewBox="0 0 154 40" fill="none" xmlns="http://www.w3.org/2000/svg">
+<g clip-path="url(#clip0_4_13767)">
+<path d="M23.5999 23.48C25.4899 24.44 27.2599 25.57 28.8899 26.85C29.2799 31.37 28.6899 35.84 27.2699 40H10.0099C8.56987 40 7.29987 39.08 6.85987 37.71L6.14987 35.53C12.5699 32.89 17.9999 28.35 21.7399 22.61C22.3599 22.88 22.9799 23.17 23.5899 23.48H23.5999ZM31.6999 40C33.1399 40 34.4099 39.08 34.8499 37.71L35.8999 34.48C34.4099 32.21 32.6499 30.15 30.6299 28.33C30.7799 32.33 30.2099 36.28 29.0099 40H31.6999ZM18.9099 0.63L16.7399 2.21C19.8999 4.52 22.6899 7.38 24.9199 10.71C25.4099 8.36 25.6299 5.95 25.5899 3.49C25.5899 3.2 25.5699 2.91 25.5599 2.63L22.8099 0.63C21.6499 -0.21 20.0799 -0.21 18.9199 0.63H18.9099ZM16.5499 26.5C17.9099 25.09 19.1199 23.57 20.1899 21.98C16.5699 20.63 12.7799 19.94 8.95987 19.94C6.42987 19.94 3.87987 20.24 1.37987 20.85L5.63987 33.96C9.69987 32.28 13.4099 29.76 16.5499 26.5ZM25.4699 14.92C24.7299 17.11 23.7699 19.21 22.6199 21.18C23.1999 21.44 23.7799 21.71 24.3499 22C25.8399 22.76 27.2599 23.62 28.6099 24.57C28.3499 22.92 27.9599 21.26 27.4199 19.62C26.8899 17.98 26.2299 16.41 25.4699 14.92ZM26.1399 12.68C27.2899 14.68 28.2499 16.83 28.9899 19.11C29.7299 21.39 30.2199 23.7 30.4599 26C32.7699 27.89 34.8099 30.07 36.5399 32.48L41.5399 17.08C41.9799 15.72 41.4999 14.22 40.3399 13.38L27.2399 3.85C27.2599 6.9 26.8799 9.86 26.1399 12.68ZM15.3199 3.24L1.36987 13.38C0.209872 14.22 -0.280128 15.72 0.169872 17.08L0.879872 19.27C7.62987 17.61 14.6399 18.06 21.0999 20.55C22.5199 18.16 23.6199 15.61 24.3699 12.94C22.0299 9.05 18.9299 5.77 15.3299 3.23L15.3199 3.24Z" fill="white"/>
+<path d="M66.5501 15.84C63.8001 15.94 61.7301 16.42 60.2801 16.94V24.15H64.1001V27.58H54.1401V24.15H56.5701V15.71H54.1401V12.28H60.2801V13.93C61.8001 12.83 63.9001 12.02 66.5501 12.02V15.84Z" fill="white"/>
+<path d="M88.2201 27.58H82.0101V26.32C80.6801 27.42 79.1301 28.07 77.2901 28.07C73.2801 28.07 70.6001 25.16 70.6001 20.73V15.72H68.1401V12.29H74.3201V20.5C74.3201 23.15 75.7401 24.67 78.0701 24.67C79.4001 24.67 80.8501 23.89 82.0201 22.44V15.71H79.5901V12.28H85.7301V24.15H88.2201V27.58Z" fill="white"/>
+<path d="M119.26 27.42C117.58 27.94 116.77 28.07 115.44 28.07C111.82 28.07 109.52 25.64 109.52 21.7V15.72H105.77V12.29H109.52V7.54004H113.24V12.29H118.64V15.72H113.24V21.7C113.24 23.74 114.34 24.61 116.18 24.61C117.02 24.61 117.96 24.45 118.74 24.22L119.26 27.42Z" fill="white"/>
+<path d="M136.3 24.15H138.76V27.58H132.58V26.51C131.32 27.42 129.73 27.93 127.89 27.93C123.62 27.93 120.19 24.37 120.19 19.94C120.19 15.51 123.62 11.92 127.89 11.92C129.73 11.92 131.32 12.44 132.58 13.34V12.27H138.76V15.7H136.3V24.14V24.15ZM132.58 22.92V16.94C131.25 15.65 129.9 15.16 128.44 15.16C125.82 15.16 123.91 17.39 123.91 19.95C123.91 22.51 125.82 24.7 128.44 24.7C129.9 24.7 131.25 24.21 132.58 22.92Z" fill="white"/>
+<path d="M153.82 27.42C152.14 27.94 151.33 28.07 150 28.07C146.38 28.07 144.08 25.64 144.08 21.7V15.72H140.33V12.29H144.08V7.54004H147.8V12.29H153.2V15.72H147.8V21.7C147.8 23.74 148.9 24.61 150.74 24.61C151.58 24.61 152.52 24.45 153.29 24.22L153.81 27.42H153.82Z" fill="white"/>
+<path d="M99.7301 18.52L96.6601 18C94.8801 17.68 94.3301 17.03 94.3301 16.22C94.3301 15.41 95.0101 14.64 96.7201 14.64C98.6301 14.64 99.5701 15.55 100.83 16.94H104.19V12.28H100.83V13.22C99.8901 12.31 98.5301 11.8 96.6601 11.8C93.1001 11.8 90.4201 13.42 90.4201 16.49C90.4201 19.34 92.7501 20.73 96.0501 21.31L98.8301 21.76C100.22 22.02 100.8 22.67 100.8 23.51C100.8 24.35 100.25 25.16 98.2801 25.16C95.9401 25.16 94.6101 23.95 93.2701 22.35H89.8101V27.58H93.2101V26.19C94.4101 27.19 96.2201 28.07 98.7101 28.07C102.43 28.07 104.6 26.16 104.6 23.28C104.6 20.24 102.17 18.95 99.7501 18.53L99.7301 18.52Z" fill="white"/>
+</g>
+<defs>
+<clipPath id="clip0_4_13767">
+<rect width="153.82" height="40" fill="white"/>
+</clipPath>
+</defs>
+</svg>

src/config/clients/index.tsx

@@ -7,6 +7,7 @@ import { insports } from './insports'
 import { india } from './india'
 import { tunisia } from './tunisia'
 import { fqtv } from './fqtv'
+import { rustat } from './rustat'
 
 export const currentClient = process.env.REACT_APP_CLIENT || 'insports'
 
@@ -17,6 +18,7 @@ export const isFacrClient = currentClient === 'facr'
 export const isIndiaClient = currentClient === 'india'
 export const isTunisClient = currentClient === 'tunisia'
 export const isFqtvClient = currentClient === 'fqtv'
+export const isRustatClient = currentClient === 'rustat'
 
 const clients = {
   facr,
@@ -25,6 +27,7 @@ const clients = {
   insports,
   instat,
   lff,
+  rustat,
   tunisia,
 }
 

src/config/clients/rustat.tsx

@@ -0,0 +1,53 @@
+import { css } from 'styled-components/macro'
+import {
+  ClientConfig,
+  ClientIds,
+  ClientNames,
+} from './types'
+
+export const rustat: ClientConfig = {
+  auth: {
+    clientId: ClientIds.Rustat,
+  },
+  currencyBadge: {
+    color: '#333333',
+    secondColor: 'rgba(255, 255, 255, 0.7)',
+    sign: 'Dollar',
+  },
+  defaultLanguage: 'en',
+  description: 'Live sports streaming platform. Football, basketball, ice hockey and more. Access to various player playlists and game highlights. Multiple subscription options. Available across all devices.',
+  disabledPreferences: true,
+  host: 'insports.tv',
+  name: ClientNames.Rustat,
+  privacyLink: '',
+  showSearch: true,
+  showSmartBanner: true,
+  styles: {
+    background: 'background-image: url(/images/Checker.png);',
+    homePageHeader: css`
+      background: #0B456E;
+    `,
+    logo: 'logo-rustat.svg',
+    logoHeight: 2.465,
+    logoLeft: 1.7,
+    logoTop: 1.5,
+    logoWidth: 6.37,
+    matchLogoHeight: 2.465,
+    matchLogoWidth: 6.37,
+    matchPageMobileHeaderLogo: css`
+      width: 90px;
+      height: 27px;
+      top: 0;
+    `,
+    mobileHeaderLogo: css`
+      width: 77px;
+      height: 24px;
+    `,
+    userAccountLogo: css`
+      width: 6.37rem;
+      height: 2.465rem;
+    `,
+  },
+  termsLink: '',
+  title: 'InSports TV - The Home of Sports Streaming',
+}

src/config/clients/types.tsx

@@ -12,7 +12,8 @@ export enum ClientIds {
   Insports = 'insports-ott-web',
   Instat = 'ott-web',
   Lff = 'lff-ott-web',
-  Tunisia = 'tunisia-ott-web',
+  Rustat = 'rustat-ott-web',
+  Tunisia = 'tunisia-ott-web'
 }
 
 export enum ClientNames {
@@ -23,6 +24,7 @@ export enum ClientNames {
   Insports = 'insports', // Глобал
   Instat = 'instat', // Глобал
   Lff = 'lff', // Латвия
+  Rustat = 'rustat', // Неизвесно
   Tunisia = 'tunisia' // Тунис
 }
 

src/config/payments.tsx

@@ -26,4 +26,5 @@ export const payments: PaymentsType = {
   [ClientNames.Facr]: PaymentSystem.Stripe,
   [ClientNames.Lff]: PaymentSystem.Stripe,
   [ClientNames.Fqtv]: PaymentSystem.Stripe,
+  [ClientNames.Rustat]: PaymentSystem.Stripe,
 }

src/features/AuthServiceApp/config/clients/index.tsx

@@ -7,6 +7,7 @@ import { lff } from './lff'
 import { india } from './india'
 import { tunisia } from './tunisia'
 import { fqtv } from './fqtv'
+import { rustat } from './rustat'
 
 export const clients = {
   [ClientIds.Facr]: facr,
@@ -16,6 +17,7 @@ export const clients = {
   [ClientIds.Insports]: insports,
   [ClientIds.India]: india,
   [ClientIds.Tunisia]: tunisia,
+  [ClientIds.Rustat]: rustat,
 }
 
 const params = new URLSearchParams(window.location.search)

src/features/AuthServiceApp/config/clients/rustat.tsx

@@ -0,0 +1,42 @@
+import { css } from 'styled-components'
+
+import { rustat as platformRustat } from 'config/clients/rustat'
+import { isMobileDevice } from 'config/userAgent'
+
+import { Background } from 'features/Background'
+
+import type { ClientConfig } from './types'
+
+export const rustat: ClientConfig = {
+  ...platformRustat,
+  background: Background,
+  styles: {
+    centerBlock: css`
+      margin-top: 9.15rem;
+      ${isMobileDevice ? css`
+        margin-top: 107px;
+        @media screen and (orientation: landscape) {
+          width: 290px;
+          margin: auto;
+        }
+      ` : ''};
+    `,
+    logo: css`
+      background-image: url(/images/logo-rustat.svg);
+      background-position: center;
+      height: 85px;
+      width: 275px;
+      margin-bottom: 1.82rem;
+
+      ${isMobileDevice ? css`
+          margin-bottom: 15px;
+          width: 165px;
+          height: 50px;
+          @media screen and (orientation: landscape){
+            width: 92px;
+            height: 22px;
+          }
+        ` : ''}
+    `,
+  },
+}

src/features/AuthStore/helpers.tsx

@@ -33,6 +33,8 @@ export const getClientNameByRedirectUri = () => {
       return ClientNames.Facr
     case ClientNames.Instat:
       return ClientNames.Instat
+    case ClientNames.Rustat:
+      return 'tv.rustatsport.ru'
     default:
       return ClientNames.Insports
   }
@@ -43,6 +45,7 @@ const clientsForRedirect = {
   fqtv: ClientNames.Fqtv,
   india: ClientNames.India,
   lff: ClientNames.Lff,
+  rustat: ClientNames.Rustat,
   tunisia: ClientNames.Tunisia,
 }
 

src/features/HeaderMobile/styled.tsx

@@ -21,6 +21,7 @@ export const defaultHeaderStyles = (
     ClientNames.Tunisia,
     ClientNames.Facr,
     ClientNames.Fqtv,
+    ClientNames.Rustat,
   ].includes(client.name)) {
     return client.styles.homePageHeader
   }

src/features/ProfileHeader/styled.tsx

@@ -22,6 +22,7 @@ export const defaultHeaderStyles = (
     ClientNames.Tunisia,
     ClientNames.Facr,
     ClientNames.Fqtv,
+    ClientNames.Rustat,
   ].includes(client.name)
     && !isMatchPage()) {
     return client.styles.homePageHeader
@@ -76,6 +77,7 @@ export const HeaderStyled = styled.header<HeaderProps>`
     client.name === ClientNames.Lff
     || client.name === ClientNames.Facr
     || client.name === ClientNames.Fqtv
+    || client.name === ClientNames.Rustat
     || client.name === ClientNames.Tunisia
       ? css`
            background: linear-gradient(187deg, ${color} -4.49%, #000000 68.29%), #000000; 

src/features/Theme/config.tsx

@@ -133,6 +133,16 @@ export const fqtvTheme: CustomTheme = {
   name: 'fqtv',
 }
 
-type Name = 'light' | 'dark' | 'lff' | 'facr' | 'tunisia' | 'fqtv'
+export const rustatTheme: CustomTheme = {
+  ...defaultTheme,
+  colors: {
+    ...defaultTheme.colors,
+    matchCardBackground: 'linear-gradient(180deg, #31BAB1 0%, #3F3F3F 50%)',
+    matchHeaderBackground: '#0B456E',
+  },
+  name: 'rustat',
+}
+
+type Name = 'light' | 'dark' | 'lff' | 'facr' | 'tunisia' | 'fqtv' | 'rustat'
 
 export type CustomTheme = typeof defaultTheme

src/features/Theme/index.tsx

@@ -18,6 +18,7 @@ import {
   facrTheme,
   fqtvTheme,
   lffTheme,
+  rustatTheme,
   tunisTheme,
 } from './config'
 
@@ -61,6 +62,9 @@ export const Theme = ({ children }: Props) => {
       case ClientNames.Fqtv:
         setTheme(fqtvTheme)
         break
+      case ClientNames.Rustat:
+        setTheme(rustatTheme)
+        break
       default:
         setTheme(defaultTheme)
         break

src/features/UserAccount/components/PersonalInfoForm/index.tsx

@@ -1,6 +1,6 @@
-import { client } from 'config/clients'
+// import { client } from 'config/clients'
 import { formIds } from 'config/form'
-import { AUTH_SERVICE_OLD } from 'config/routes'
+// import { AUTH_SERVICE_OLD } from 'config/routes'
 
 import { Combobox } from 'features/Combobox'
 import { Input } from 'features/Common'
@@ -15,8 +15,8 @@ import { OutlineButton, SolidButton } from '../../styled'
 import {
   Form,
   ButtonWrapper,
-  PrivacyPolicyLink,
+  // PrivacyPolicyLink,
-  PrivacyWrapper,
+  // PrivacyWrapper,
 } from './styled'
 
 const labelWidth = 4.75
@@ -116,7 +116,7 @@ export const PersonalInfoForm = (props: Props) => {
         </OutlineButton>
         <Error t={readFormError(formError) || ''} />
       </ButtonWrapper>
-      <PrivacyWrapper>
+      {/* <PrivacyWrapper>
         <PrivacyPolicyLink
           target='_blank'
           href={`${AUTH_SERVICE_OLD}${client.termsLink}`}
@@ -131,7 +131,7 @@ export const PersonalInfoForm = (props: Props) => {
         >
           <T9n t='privacy_policy_and_statement' />
         </PrivacyPolicyLink>
-      </PrivacyWrapper>
+      </PrivacyWrapper> */}
     </Form>
   )
 }

src/features/UserAccount/index.tsx

@@ -16,8 +16,8 @@ import { T9n } from 'features/T9n'
 import {
   client,
   isFacrClient,
-  isInSportsClient,
+  // isInSportsClient,
-  isInstatClient,
+  // isInstatClient,
   isLffClient,
 } from 'config/clients'
 
@@ -35,8 +35,8 @@ import {
   StyledLink,
   UserAccountWrapper,
 } from './styled'
-import { CompanyInfo } from '../CompanyInfo'
+// import { CompanyInfo } from '../CompanyInfo'
-import { PoweredByInsports } from './components/PoweredByInsports/PoweredByInsports'
+// import { PoweredByInsports } from './components/PoweredByInsports/PoweredByInsports'
 
 const UserAccount = () => {
   const { user } = useAuthStore()
@@ -116,10 +116,10 @@ const UserAccount = () => {
           <Route path={`${PAGES.useraccount}/payment-history`}>
             <PagePaymentsHistory />
           </Route>
-          <CompanyInfo clientName={client.name} textAlign='left' />
+          {/* <CompanyInfo clientName={client.name} textAlign='left' /> */}
         </ContentWrapper>
       </Body>
-      {!isInstatClient && !isInSportsClient && <PoweredByInsports />}
+      {/* {!isInstatClient && !isInSportsClient && <PoweredByInsports />} */}
     </UserAccountWrapper>
   )
 }

src/react-app-env.d.ts

@@ -3,7 +3,7 @@
 
 declare namespace NodeJS {
   export interface ProcessEnv {
-    REACT_APP_CLIENT: 'instat' | 'facr' | 'lff' | 'insports' | 'india' | 'tunisia' | 'fqtv',
+    REACT_APP_CLIENT: 'instat' | 'facr' | 'lff' | 'insports' | 'india' | 'tunisia' | 'fqtv' | 'rustat',
     REACT_APP_ENV: 'production' | 'preproduction' | 'staging',
     REACT_APP_STAGE: 'staging' | 'test-a' | 'test-b' | 'test-c' | 'test-d' | 'test-e' | 'test-f' | 'test-g' | 'test-h' | 'test-i' | 'test-j' | 'test',
     REACT_APP_TYPE: 'auth-service' | 'ott',