refactor(2051): show match status from proc ott_match_popup

src/features/MatchPage/components/MatchProfileCard/helpers.tsx

@@ -1,23 +0,0 @@
-import { SportTypes } from 'config'
-
-import type { Event } from 'requests'
-
-// Здесь в дальнейшем будет расширена логика получения статуса матча
-// для каждого вида спорта, как только решат как это сделать на бэке
-
-const getBasketballStatus = (event: Event) => `Q${event.h} ${event.c}`
-const getFootballStatus = (event: Event) => `H${event.h} ${event.c}`
-const getHockeyStatus = (event: Event) => `P${event.h} ${event.c}`
-
-export const getMatchStatus = (sportType: SportTypes, lastEvent: Event) => {
-  switch (sportType) {
-    case SportTypes.BASKETBALL:
-      return getBasketballStatus(lastEvent)
-    case SportTypes.FOOTBALL:
-      return getFootballStatus(lastEvent)
-    case SportTypes.HOCKEY:
-      return getHockeyStatus(lastEvent)
-    default:
-      return ''
-  }
-}

src/features/MatchPage/components/MatchProfileCard/index.tsx

@@ -1,18 +1,13 @@
-import isEmpty from 'lodash/isEmpty'
-import last from 'lodash/last'
-
-import type { Events } from 'requests/getMatchEvents'
 import type { MatchInfo } from 'requests/getMatchInfo'
 
 import { ProfileTypes } from 'config'
 
 import { useMatchSwitchesStore } from 'features/MatchSwitches'
 import { Name } from 'features/Name'
-import { T9n } from 'features/T9n'
+import { useMatchPopupStore } from 'features/MatchPopup'
 
 import { usePageParams } from 'hooks/usePageParams'
 
-import { getMatchStatus } from './helpers'
 import {
   Wrapper,
   Team,
@@ -24,14 +19,13 @@ import {
 } from './styled'
 
 type Props = {
-  events: Events,
   profile: MatchInfo,
 }
 
-export const MatchProfileCard = ({ events, profile }: Props) => {
+export const MatchProfileCard = ({ profile }: Props) => {
   const { sportType } = usePageParams()
   const { isScoreHidden } = useMatchSwitchesStore()
-  const lastEvent = last(events)
+  const { matchPlaylists } = useMatchPopupStore()
 
   if (!profile) return <Wrapper />
 
@@ -58,20 +52,16 @@ export const MatchProfileCard = ({ events, profile }: Props) => {
         </StyledLink>
       </Team>
       <ScoreWrapper>
-        {
-          isScoreHidden
-            ? '-'
-            : (
-              <Score>
-                {team1.score} - {team2.score}
-              </Score>
-            )
-        }
-        {live && (
+        <Score>
+          {
+            isScoreHidden
+              ? '-'
+              : `${team1.score} - ${team2.score}`
+          }
+        </Score>
+        {live && matchPlaylists.state && (
           <MatchStatus>
-            {isEmpty(events) || !lastEvent
-              ? <T9n t='live' />
-              : getMatchStatus(sportType, lastEvent)}
+            {matchPlaylists.state}
           </MatchStatus>
         )}
       </ScoreWrapper>

src/features/MatchPage/helpers/buildPlaylists.tsx

@@ -27,8 +27,8 @@ const getMatchPlaylists = (matchPlaylists: MatchPlaylists | null): MatchPlaylist
     const playlist = matchPlaylists[key]
     const lexic = matchPlaylists.lexics[key]
     return {
-      data: sortBy(playlist.data, ['h', 's']),
-      duration: playlist.dur,
+      data: sortBy(playlist?.data, ['h', 's']),
+      duration: playlist?.dur,
       id: key,
       lexic,
       type: PlaylistTypes.MATCH,
@@ -54,6 +54,7 @@ export const buildPlaylists = (matchPlaylists: MatchPlaylists | null) => {
     },
     score1: matchPlaylists?.score1 || 0,
     score2: matchPlaylists?.score2 || 0,
+    state: matchPlaylists?.state,
   }
   return playlists
 }

src/features/MatchPage/index.tsx

@@ -24,7 +24,7 @@ const MatchPage = () => {
   return (
     <PageWrapper>
       <ProfileHeader color='rgb(0,0,0)' height={4.5}>
-        <MatchProfileCard events={events} profile={profile} />
+        <MatchProfileCard profile={profile} />
       </ProfileHeader>
       <Main>
         <UserFavorites />

src/features/MatchPage/types.tsx

@@ -62,4 +62,5 @@ export type Playlists = {
   },
   score1: number,
   score2: number,
+  state?: string,
 }

src/requests/getMatchPlaylists.tsx

@@ -58,17 +58,16 @@ export type Lexics = {
 }
 
 export type MatchPlaylists = {
-  ball_in_play: PlaylistWithDuration,
-  color1?: string,
-  color2?: string,
-  full_game: PlaylistWithDuration,
-  goals: PlaylistWithDuration,
-  highlights: PlaylistWithDuration,
+  ball_in_play?: PlaylistWithDuration,
+  full_game?: PlaylistWithDuration,
+  goals?: PlaylistWithDuration,
+  highlights?: PlaylistWithDuration,
   lexics: Lexics,
   players1: Players,
   players2: Players,
   score1: number,
   score2: number,
+  state?: string,
 }
 
 type Response = {