From dca47f25b9ea7744b5fa233deaa03e7775f4e4c6 Mon Sep 17 00:00:00 2001
From: Armen <35077035+Armen9393@users.noreply.github.com>
Date: Tue, 1 Sep 2020 14:26:17 +0300
Subject: [PATCH] feat(ott-350): redirect to matches page (#117)

---
 src/features/MatchCard/CardFinished/index.tsx | 12 ++++++++--
 .../MatchCard/CardFinishedHover/index.tsx     | 14 ++++++++++--
 src/features/MatchCard/CardLive/index.tsx     | 11 ++++++++--
 .../MatchCard/CardLiveHover/index.tsx         | 22 +++++++++++++++----
 4 files changed, 49 insertions(+), 10 deletions(-)

diff --git a/src/features/MatchCard/CardFinished/index.tsx b/src/features/MatchCard/CardFinished/index.tsx
index f6ded47a..dd77f780 100644
--- a/src/features/MatchCard/CardFinished/index.tsx
+++ b/src/features/MatchCard/CardFinished/index.tsx
@@ -33,7 +33,7 @@ type CardFinishedProps = {
 
 export const CardFinished = ({
   match: {
-    date,
+    id,
     preview,
     sportName,
     sportType,
@@ -52,7 +52,15 @@ export const CardFinished = ({
     showScore,
   } = useCard()
 
-  if (isOpen) return <CardFinishedHover onClose={close} />
+  if (isOpen) {
+    return (
+      <CardFinishedHover
+        id={id}
+        sportName={sportName}
+        onClose={close}
+      />
+    )
+  }
 
   return (
     <CardWrapper
diff --git a/src/features/MatchCard/CardFinishedHover/index.tsx b/src/features/MatchCard/CardFinishedHover/index.tsx
index c0897401..6460b3db 100644
--- a/src/features/MatchCard/CardFinishedHover/index.tsx
+++ b/src/features/MatchCard/CardFinishedHover/index.tsx
@@ -1,5 +1,7 @@
 import React from 'react'
 
+import { Link } from 'react-router-dom'
+
 import { CloseButton } from 'features/Common'
 
 import {
@@ -12,17 +14,25 @@ import {
 } from '../styled'
 
 type CardFinishedHoverProps = {
+  id: number,
   onClose: () => void,
+  sportName: string,
 }
 
-export const CardFinishedHover = ({ onClose }: CardFinishedHoverProps) => (
+export const CardFinishedHover = ({
+  id,
+  onClose,
+  sportName,
+}: CardFinishedHoverProps) => (
   <CardHoverWrapper>
     <CardHoverInner>
       <CloseButton onClick={onClose} />
       <CardHoverTitle t='match_video' />
       <Rows>
         <Row>
-          <MoreVideo t='full_game' />
+          <Link to={`${sportName}/matches/${id}`}>
+            <MoreVideo t='full_game' />
+          </Link>
           <MoreVideo t='game_time' />
         </Row>
 
diff --git a/src/features/MatchCard/CardLive/index.tsx b/src/features/MatchCard/CardLive/index.tsx
index 9c086aaa..deb61471 100644
--- a/src/features/MatchCard/CardLive/index.tsx
+++ b/src/features/MatchCard/CardLive/index.tsx
@@ -33,7 +33,6 @@ type CardLiveProps = {
 
 export const CardLive = ({
   match: {
-    date,
     id,
     preview,
     sportName,
@@ -53,7 +52,15 @@ export const CardLive = ({
     showScore,
   } = useCard()
 
-  if (isOpen) return <CardLiveHover onClose={close} />
+  if (isOpen) {
+    return (
+      <CardLiveHover
+        id={id}
+        sportName={sportName}
+        onClose={close}
+      />
+    )
+  }
 
   return (
     <CardWrapper
diff --git a/src/features/MatchCard/CardLiveHover/index.tsx b/src/features/MatchCard/CardLiveHover/index.tsx
index 981821f1..512a9d0a 100644
--- a/src/features/MatchCard/CardLiveHover/index.tsx
+++ b/src/features/MatchCard/CardLiveHover/index.tsx
@@ -1,6 +1,8 @@
 import React from 'react'
 import type { MouseEvent } from 'react'
 
+import { Link } from 'react-router-dom'
+
 import { CloseButton } from 'features/Common'
 
 import {
@@ -13,26 +15,38 @@ import {
 } from '../styled'
 
 type CardLiveHoverProps = {
+  id: number,
   onClose: () => void,
+  sportName: string,
 }
 
 const stopProp = (e: MouseEvent<HTMLDivElement>) => {
   e.stopPropagation()
 }
 
-export const CardLiveHover = ({ onClose }: CardLiveHoverProps) => (
+export const CardLiveHover = ({
+  id,
+  onClose,
+  sportName,
+}: CardLiveHoverProps) => (
   <CardHoverWrapper onClick={onClose}>
     <CardHoverInner>
       <CloseButton onClick={onClose} />
       <CardHoverTitle t='match_video' />
       <Rows onClick={stopProp}>
         <Row>
-          <MoreVideo t='watch_now' />
-          <MoreVideo t='watch_from_beginning' />
+          <Link to={`${sportName}/matches/${id}`}>
+            <MoreVideo t='watch_now' />
+          </Link>
+          <Link to={`${sportName}/matches/${id}`}>
+            <MoreVideo t='watch_from_beginning' />
+          </Link>
         </Row>
 
         <Row>
-          <MoreVideo t='watch_from_last_pause' />
+          <Link to={`${sportName}/matches/${id}`}>
+            <MoreVideo t='watch_from_last_pause' />
+          </Link>
         </Row>
       </Rows>
     </CardHoverInner>