fix(2263): fix logic for set color in ProfileHeader component

src/features/ProfileHeader/hooks.tsx

@@ -3,7 +3,10 @@ import { useEffect, useState } from 'react'
 import { getProfileColor } from 'requests/getProfileColor'
 
 import { usePageParams } from 'hooks/usePageParams'
+import { getColor } from 'helpers/getColor'
 
+import { SportTypes } from 'config'
+import { client } from 'config/clients'
 import { DEFAULT_HEADER_COLOR } from './styled'
 
 export const useProfileColor = (profileId?: number) => {
@@ -27,5 +30,16 @@ export const useProfileColor = (profileId?: number) => {
     sportType,
   ])
 
+  // TODO remove this logic when backend will return the correct colors
+  const prifileWithConfifColor = [
+    227, 946, 3067, 5665, 23, 2719, 528, 17018, 567, 16306, 1189, 480, 16920, 6032, 17624, 114440,
+  ]
+  if (
+    client.name === 'facr'
+    && sportType === SportTypes.FOOTBALL && profileId && prifileWithConfifColor.includes(profileId)
+  ) {
+    return getColor(profileId)
+  }
+
   return color
 }

src/features/ProfileHeader/index.tsx

@@ -11,7 +11,8 @@ import { Search } from 'features/Search'
 import { ScoreSwitch } from 'features/MatchSwitches'
 
 import { isMatchPage } from 'helpers/isMatchPage'
-import { getColor } from 'helpers/getColor'
+
+import { useProfileColor } from './hooks'
 
 import {
   HeaderStyled,
@@ -35,7 +36,7 @@ export const ProfileHeader = ({
   height,
   profileId,
 }: Props) => {
-  const color = getColor(profileId)
+  const color = useProfileColor(profileId)
   return (
     <Fragment>
       <HeaderStyled

src/helpers/getColor/index.ts

@@ -1,6 +1,12 @@
-const DEFAULT_COLOR = 'linear-gradient(83.42deg, #00257A 53.04%, rgba(0, 0, 0, 0) 94.83%), #000000'
-export const getColor = (id: number | undefined):string => {
-  if (!id) return DEFAULT_COLOR
+import { client } from 'config/clients'
+
+const DEFAULT_FACR_COLOR = 'linear-gradient(83.42deg, #00257A 53.04%, rgba(0, 0, 0, 0) 94.83%), #000000'
+const DEFAULT_INSTAT_COLOR = 'linear-gradient( 187deg, rgba(53,96,225,0.56) -4.49%, #000000 68.29%), #000000'
+
+export const getColor = (id: number | undefined): string => {
+  const currentDefaultColor = client.name === 'facr' ? DEFAULT_FACR_COLOR : DEFAULT_INSTAT_COLOR
+
+  if (!id) return currentDefaultColor
   switch (id) {
     case 227:
       return 'linear-gradient(83.42deg, #A3C05B 53.04%, #37411C 94.83%), #000000'
@@ -8,7 +14,21 @@ export const getColor = (id: number | undefined):string => {
       return 'linear-gradient(83.42deg, #000000 53.04%, #000000 94.83%), #000000'
     case 3067:
       return 'linear-gradient(83.42deg, #007179 53.04%, #007179 94.83%), #000000'
-    default:
+    case 5665:
+    case 23:
+    case 2719:
+    case 528:
+    case 17018:
+    case 567:
+    case 16306:
+    case 1189:
+    case 480:
+    case 16920:
+    case 6032:
+    case 17624:
+    case 114440:
       return 'linear-gradient(83.42deg, #01257B 53.04%, #0144B5 94.83%), #000000'
+    default:
+      return currentDefaultColor
   }
 }