From 5439eabdf3845f236950ebd26a1c5b56b3926cb4 Mon Sep 17 00:00:00 2001
From: nklhrstv <me@nikolahristov.com>
Date: Mon, 6 Apr 2020 17:28:10 +0300
Subject: [PATCH] deep links integrated in video

---
 .../MetaDetails/VideosList/Video/Video.js     | 22 ++++++++++++++++---
 src/routes/MetaDetails/useMetaDetails.js      |  8 +++++--
 2 files changed, 25 insertions(+), 5 deletions(-)

diff --git a/src/routes/MetaDetails/VideosList/Video/Video.js b/src/routes/MetaDetails/VideosList/Video/Video.js
index 18aeb3d76..90ff9f651 100644
--- a/src/routes/MetaDetails/VideosList/Video/Video.js
+++ b/src/routes/MetaDetails/VideosList/Video/Video.js
@@ -6,9 +6,21 @@ const { Button, Image } = require('stremio/common');
 const VideoPlaceholder = require('./VideoPlaceholder');
 const styles = require('./styles');
 
-const Video = ({ className, id, title, thumbnail, episode, released, upcoming, watched, progress, ...props }) => {
+const Video = ({ className, id, title, thumbnail, episode, released, upcoming, watched, progress, deepLinks, ...props }) => {
+    const href = React.useMemo(() => {
+        return deepLinks ?
+            typeof deepLinks.player === 'string' ?
+                deepLinks.player
+                :
+                typeof deepLinks.meta_details_streams === 'string' ?
+                    deepLinks.meta_details_streams
+                    :
+                    null
+            :
+            null;
+    }, [deepLinks]);
     return (
-        <Button {...props} className={classnames(className, styles['video-container'])} title={title}>
+        <Button href={href} {...props} className={classnames(className, styles['video-container'])} title={title}>
             {
                 typeof thumbnail === 'string' && thumbnail.length > 0 ?
                     <div className={styles['thumbnail-container']}>
@@ -84,7 +96,11 @@ Video.propTypes = {
     released: PropTypes.instanceOf(Date),
     upcoming: PropTypes.bool,
     watched: PropTypes.bool,
-    progress: PropTypes.number
+    progress: PropTypes.number,
+    deepLinks: PropTypes.shape({
+        meta_details_streams: PropTypes.string,
+        player: PropTypes.string
+    })
 };
 
 module.exports = Video;
diff --git a/src/routes/MetaDetails/useMetaDetails.js b/src/routes/MetaDetails/useMetaDetails.js
index 5e973c41d..db4fc6b0b 100644
--- a/src/routes/MetaDetails/useMetaDetails.js
+++ b/src/routes/MetaDetails/useMetaDetails.js
@@ -1,5 +1,5 @@
 const React = require('react');
-const { useModelState } = require('stremio/common');
+const { deepLinking, useModelState } = require('stremio/common');
 
 const initMetaDetailsState = () => ({
     selected: null,
@@ -32,7 +32,11 @@ const mapMetaDetailsState = (meta_details) => {
                                     NaN
                             ),
                             // TODO add watched and progress
-                            href: `#/metadetails/${meta_resource.content.content.type}/${meta_resource.content.content.id}/${video.id}`
+                            deepLinks: deepLinking.withVideo({
+                                video,
+                                metaTransportUrl: meta_resource.request.base,
+                                metaItem: meta_resource.content.content
+                            })
                         }))
                     }
                 }