From 11ebfae7474c257562841a01ec5e3f30b369600b Mon Sep 17 00:00:00 2001
From: nklhrstv <me@nikolahristov.com>
Date: Mon, 30 Mar 2020 17:51:30 +0300
Subject: [PATCH] change meta preview name and description when selecting video

---
 src/routes/MetaDetails/MetaDetails.js | 25 ++++++++++++++++++++-----
 1 file changed, 20 insertions(+), 5 deletions(-)

diff --git a/src/routes/MetaDetails/MetaDetails.js b/src/routes/MetaDetails/MetaDetails.js
index cd0c82700..9245672e9 100644
--- a/src/routes/MetaDetails/MetaDetails.js
+++ b/src/routes/MetaDetails/MetaDetails.js
@@ -15,9 +15,19 @@ const MetaDetails = ({ urlParams }) => {
     );
     const streamsResourceRef = metaDetails.selected !== null ? metaDetails.selected.streams_resource_ref : null;
     const streamsResources = metaDetails.streams_resources;
-    const [inLibrary, toggleInLibrary] = useInLibrary(
-        selectedMetaResource !== null ? selectedMetaResource.content.content : null
-    );
+    const selectedVideo = React.useMemo(() => {
+        return streamsResourceRef !== null && selectedMetaResource !== null ?
+            selectedMetaResource.content.content.videos.reduce((result, video) => {
+                if (video.id === streamsResourceRef.id) {
+                    return video;
+                }
+
+                return result;
+            }, null)
+            :
+            null;
+    }, [selectedMetaResource, streamsResourceRef]);
+    const [inLibrary, toggleInLibrary] = useInLibrary(selectedMetaResource !== null ? selectedMetaResource.content.content : null);
     return (
         <div className={styles['metadetails-container']}>
             <HorizontalNavBar
@@ -62,12 +72,17 @@ const MetaDetails = ({ urlParams }) => {
                                         }
                                         <MetaPreview
                                             className={styles['meta-preview']}
-                                            name={selectedMetaResource.content.content.name}
+                                            name={selectedMetaResource.content.content.name + (selectedVideo !== null && typeof selectedVideo.title === 'string' ? ` - ${selectedVideo.title}` : '')}
                                             logo={selectedMetaResource.content.content.logo}
                                             runtime={selectedMetaResource.content.content.runtime}
                                             releaseInfo={selectedMetaResource.content.content.releaseInfo}
                                             released={selectedMetaResource.content.content.released}
-                                            description={selectedMetaResource.content.content.description}
+                                            description={
+                                                selectedVideo !== null && typeof selectedVideo.overview === 'string' && selectedVideo.overview.length > 0 ?
+                                                    selectedVideo.overview
+                                                    :
+                                                    selectedMetaResource.content.content.description
+                                            }
                                             links={selectedMetaResource.content.content.links}
                                             trailer={selectedMetaResource.content.content.trailer}
                                             inLibrary={inLibrary}