From 01ac7a883684b12e12051acb2e63257c88c41b96 Mon Sep 17 00:00:00 2001
From: nklhrstv <me@nikolahristov.com>
Date: Wed, 8 Apr 2020 17:08:10 +0300
Subject: [PATCH 01/36] stream title format fixed

---
 src/routes/MetaDetails/StreamsList/Stream/styles.less | 1 +
 1 file changed, 1 insertion(+)

diff --git a/src/routes/MetaDetails/StreamsList/Stream/styles.less b/src/routes/MetaDetails/StreamsList/Stream/styles.less
index fe0e6aec6..3b2126558 100644
--- a/src/routes/MetaDetails/StreamsList/Stream/styles.less
+++ b/src/routes/MetaDetails/StreamsList/Stream/styles.less
@@ -63,6 +63,7 @@
         flex: 1;
         max-height: 3.6em;
         margin: 0.5rem 1rem;
+        white-space: pre;
         color: @color-surface-light5-90;
     }
 

From e9c451a41a78ba7a91109cd0a773e81692c699f3 Mon Sep 17 00:00:00 2001
From: nklhrstv <me@nikolahristov.com>
Date: Thu, 9 Apr 2020 12:47:03 +0300
Subject: [PATCH 02/36] replace init fb sdk script with javscript code

---
 src/routes/Intro/Intro.js | 21 +++++++++------------
 1 file changed, 9 insertions(+), 12 deletions(-)

diff --git a/src/routes/Intro/Intro.js b/src/routes/Intro/Intro.js
index b9fd84185..3296b6a97 100644
--- a/src/routes/Intro/Intro.js
+++ b/src/routes/Intro/Intro.js
@@ -277,23 +277,20 @@ const Intro = ({ queryParams }) => {
         };
     }, [routeFocused]);
     React.useEffect(() => {
-        var initScriptElement = document.createElement('script');
-        var sdkScriptElement = document.createElement('script');
-        initScriptElement.innerHTML = `window.fbAsyncInit = function() {
-                FB.init({
-                    appId: '1537119779906825',
-                    autoLogAppEvents: false,
-                    xfbml: false,
-                    version: 'v2.5'
-                });
-            };`;
+        window.fbAsyncInit = function() {
+            FB.init({
+                appId: '1537119779906825',
+                autoLogAppEvents: false,
+                xfbml: false,
+                version: 'v2.5'
+            });
+        };
+        const sdkScriptElement = document.createElement('script');
         sdkScriptElement.src = 'https://connect.facebook.net/en_US/sdk.js';
         sdkScriptElement.async = true;
         sdkScriptElement.defer = true;
-        document.body.appendChild(initScriptElement);
         document.body.appendChild(sdkScriptElement);
         return () => {
-            document.body.removeChild(initScriptElement);
             document.body.removeChild(sdkScriptElement);
         };
     }, []);

From e1533fbf2a512ac9a4b82837b93db90ba480923f Mon Sep 17 00:00:00 2001
From: svetlagasheva <svetulka_24@mail.bg>
Date: Mon, 27 Apr 2020 12:46:30 +0300
Subject: [PATCH 03/36] META_LINK_CATEGORY constant added

---
 src/common/CONSTANTS.js | 2 ++
 1 file changed, 2 insertions(+)

diff --git a/src/common/CONSTANTS.js b/src/common/CONSTANTS.js
index cc16a76ce..42a7e9f7f 100644
--- a/src/common/CONSTANTS.js
+++ b/src/common/CONSTANTS.js
@@ -6,6 +6,7 @@ const CATALOG_PREVIEW_SIZE = 10;
 const CATALOG_PAGE_SIZE = 100;
 const NONE_EXTRA_VALUE = 'None';
 const SKIP_EXTRA_NAME = 'skip';
+const META_LINK_CATEGORY = 'meta';
 const IMDB_LINK_CATEGORY = 'imdb';
 const SHARE_LINK_CATEGORY = 'share';
 const TYPE_PRIORITIES = {
@@ -29,6 +30,7 @@ module.exports = {
     CATALOG_PAGE_SIZE,
     NONE_EXTRA_VALUE,
     SKIP_EXTRA_NAME,
+    META_LINK_CATEGORY,
     IMDB_LINK_CATEGORY,
     SHARE_LINK_CATEGORY,
     TYPE_PRIORITIES

From 7fbb445b5345574b32c58ed9438c552f39ebf2e9 Mon Sep 17 00:00:00 2001
From: svetlagasheva <svetulka_24@mail.bg>
Date: Mon, 27 Apr 2020 12:56:20 +0300
Subject: [PATCH 04/36] metaTransportUrl query param for video removed

---
 src/common/deepLinking.js | 3 +--
 1 file changed, 1 insertion(+), 2 deletions(-)

diff --git a/src/common/deepLinking.js b/src/common/deepLinking.js
index f90bc1436..49885808c 100644
--- a/src/common/deepLinking.js
+++ b/src/common/deepLinking.js
@@ -60,13 +60,12 @@ const withLibItem = ({ libItem, streams = {} }) => {
 };
 
 const withVideo = ({ video, metaTransportUrl, metaItem, streams = {} }) => {
-    const queryParams = new URLSearchParams([['metaTransportUrl', metaTransportUrl]]);
     const [stream, streamTransportUrl] = typeof streams[`${encodeURIComponent(metaItem.id)}/${encodeURIComponent(video.id)}`] === 'object' ?
         streams[`${encodeURIComponent(metaItem.id)}/${encodeURIComponent(video.id)}`]
         :
         [];
     return {
-        meta_details_streams: `#/metadetails/${encodeURIComponent(metaItem.type)}/${encodeURIComponent(metaItem.id)}/${encodeURIComponent(video.id)}?${queryParams.toString()}`,
+        meta_details_streams: `#/metadetails/${encodeURIComponent(metaItem.type)}/${encodeURIComponent(metaItem.id)}/${encodeURIComponent(video.id)}`,
         // TODO check if stream is external
         player: typeof stream === 'object' && typeof streamTransportUrl === 'string' ?
             `#/player/${encodeURIComponent(serializeStream(stream))}/${encodeURIComponent(streamTransportUrl)}/${encodeURIComponent(metaTransportUrl)}/${encodeURIComponent(metaItem.type)}/${encodeURIComponent(metaItem.id)}/${encodeURIComponent(video.id)}`

From 9e701f0cc9a386361b8d4cefefad1c886c852a66 Mon Sep 17 00:00:00 2001
From: svetlagasheva <svetulka_24@mail.bg>
Date: Mon, 27 Apr 2020 12:59:14 +0300
Subject: [PATCH 05/36] map metaExtension in meta_resources in useMetaDetails

---
 src/routes/MetaDetails/useMetaDetails.js | 59 +++++++++++++-----------
 1 file changed, 33 insertions(+), 26 deletions(-)

diff --git a/src/routes/MetaDetails/useMetaDetails.js b/src/routes/MetaDetails/useMetaDetails.js
index 6f2a6722c..0bc4c679f 100644
--- a/src/routes/MetaDetails/useMetaDetails.js
+++ b/src/routes/MetaDetails/useMetaDetails.js
@@ -1,7 +1,7 @@
 // Copyright (C) 2017-2020 Smart code 203358507
 
 const React = require('react');
-const { deepLinking, useModelState } = require('stremio/common');
+const { CONSTANTS, deepLinking, useModelState } = require('stremio/common');
 
 const initMetaDetailsState = () => ({
     selected: null,
@@ -12,10 +12,10 @@ const initMetaDetailsState = () => ({
 const mapMetaDetailsStateWithCtx = (meta_details, ctx) => {
     const selected = meta_details.selected;
     const meta_resources = meta_details.meta_resources.map((meta_resource) => {
-        return {
-            request: meta_resource.request,
-            content: meta_resource.content.type === 'Ready' ?
-                {
+        return meta_resource.content.type === 'Ready' ?
+            {
+                request: meta_resource.request,
+                content: {
                     type: 'Ready',
                     content: {
                         ...meta_resource.content.content,
@@ -39,28 +39,35 @@ const mapMetaDetailsStateWithCtx = (meta_details, ctx) => {
                                 metaTransportUrl: meta_resource.request.base,
                                 metaItem: meta_resource.content.content
                             })
-                        }))
-                    }
-                }
-                :
-                meta_resource.content,
-            deepLinks: meta_details.selected !== null ?
-                deepLinking.withMetaResource({
-                    metaResource: meta_resource,
-                    type: meta_details.selected.meta_resource_ref.type_name,
-                    id: meta_details.selected.meta_resource_ref.id,
-                    videoId: meta_details.selected.streams_resource_ref !== null ? meta_details.selected.streams_resource_ref.id : null
-                })
-                :
-                null,
-            addon: ctx.profile.addons.reduce((result, addon) => {
-                if (addon.transportUrl === meta_resource.request.base) {
-                    return addon;
-                }
+                        })),
+                        metaExtension: meta_resource.content.content.links.reduceRight((result, link) => {
+                            if (link.category === CONSTANTS.META_LINK_CATEGORY) {
+                                return link;
+                            }
 
-                return result;
-            }, null)
-        };
+                            return result;
+                        }, null)
+                    }
+                },
+                deepLinks: meta_details.selected !== null ?
+                    deepLinking.withMetaResource({
+                        metaResource: meta_resource,
+                        type: meta_details.selected.meta_resource_ref.type_name,
+                        id: meta_details.selected.meta_resource_ref.id,
+                        videoId: meta_details.selected.streams_resource_ref !== null ? meta_details.selected.streams_resource_ref.id : null
+                    })
+                    :
+                    null,
+                addon: ctx.profile.addons.reduce((result, addon) => {
+                    if (addon.transportUrl === meta_resource.request.base) {
+                        return addon;
+                    }
+
+                    return result;
+                }, null)
+            }
+            :
+            meta_resource;
     });
     const streams_resources = meta_details.streams_resources.map((stream_resource) => {
         return stream_resource.content.type === 'Ready' ?

From 6d5ca95d63727c8366f76b6e58acf8e7cb526f95 Mon Sep 17 00:00:00 2001
From: svetlagasheva <svetulka_24@mail.bg>
Date: Mon, 27 Apr 2020 13:26:22 +0300
Subject: [PATCH 06/36] ModalDialog with iframe used for selected addon in
 MetaDetails

---
 src/routes/MetaDetails/MetaDetails.js | 39 ++++++++++++++++++++++-----
 src/routes/MetaDetails/styles.less    | 21 +++++++++++++++
 2 files changed, 54 insertions(+), 6 deletions(-)

diff --git a/src/routes/MetaDetails/MetaDetails.js b/src/routes/MetaDetails/MetaDetails.js
index 5c8c25789..95a4461fb 100644
--- a/src/routes/MetaDetails/MetaDetails.js
+++ b/src/routes/MetaDetails/MetaDetails.js
@@ -2,7 +2,7 @@
 
 const React = require('react');
 const PropTypes = require('prop-types');
-const { VerticalNavBar, HorizontalNavBar, MetaPreview, Image, useInLibrary } = require('stremio/common');
+const { VerticalNavBar, HorizontalNavBar, MetaPreview, ModalDialog, Image, useInLibrary } = require('stremio/common');
 const StreamsList = require('./StreamsList');
 const VideosList = require('./VideosList');
 const useMetaDetails = require('./useMetaDetails');
@@ -14,14 +14,22 @@ const MetaDetails = ({ urlParams, queryParams }) => {
         return metaDetails.selected !== null ? metaDetails.selected.meta_resources_ref : null;
     }, [metaDetails.selected]);
     const selectedAddon = queryParams.get('metaTransportUrl');
+    const metaResourcesReady = metaDetails.meta_resources.filter((metaResource) => metaResource.content.type === 'Ready' && metaResource.content.content.metaExtension !== null);
     const selectedMetaResource = React.useMemo(() => {
         return metaDetails.meta_resources.reduceRight((result, metaResource) => {
+            if (metaResource.content.type === 'Ready') {
+                return metaResource;
+            }
+
+            return result;
+        }, null);
+    }, [metaDetails, selectedAddon]);
+    const selectedMetaResourceRef = React.useMemo(() => {
+        return metaDetails.meta_resources.reduce((result, metaResource) => {
             if (typeof selectedAddon === 'string') {
                 if (metaResource.request.base === selectedAddon) {
                     return metaResource;
                 }
-            } else if (metaResource.content.type === 'Ready') {
-                return metaResource;
             }
 
             return result;
@@ -42,7 +50,7 @@ const MetaDetails = ({ urlParams, queryParams }) => {
             null;
     }, [selectedMetaResource, streamsResourceRef]);
     const tabs = React.useMemo(() => {
-        return metaDetails.meta_resources.map((metaResource) => ({
+        return metaResourcesReady.map((metaResource) => ({
             id: metaResource.addon.transportUrl,
             label: metaResource.addon.manifest.name,
             logo: metaResource.addon.manifest.logo,
@@ -50,6 +58,10 @@ const MetaDetails = ({ urlParams, queryParams }) => {
             href: metaResource.deepLinks.meta_details_streams !== null ? metaResource.deepLinks.meta_details_streams : metaResource.deepLinks.meta_details_videos
         }));
     }, [metaDetails]);
+    const clearSelectedAddon = React.useCallback(() => {
+        queryParams.delete('metaTransportUrl');
+        window.location.replace(`#${urlParams.path}`);
+    }, [queryParams]);
     const [inLibrary, toggleInLibrary] = useInLibrary(selectedMetaResource !== null && selectedMetaResource.content.type === 'Ready' ? selectedMetaResource.content.content : null);
     return (
         <div className={styles['metadetails-container']}>
@@ -60,11 +72,11 @@ const MetaDetails = ({ urlParams, queryParams }) => {
             />
             <div className={styles['metadetails-content']}>
                 {
-                    metaDetails.meta_resources.length > 0 ?
+                    metaResourcesReady.length > 0 ?
                         <VerticalNavBar
                             className={styles['vertical-nav-bar']}
                             tabs={tabs}
-                            selected={selectedMetaResource !== null ? selectedMetaResource.request.base : null}
+                            selected={typeof selectedAddon === 'string' ? selectedAddon : null}
                         />
                         :
                         null
@@ -142,12 +154,27 @@ const MetaDetails = ({ urlParams, queryParams }) => {
                             null
                 }
             </div>
+            {
+                typeof selectedAddon === 'string' ?
+                    <ModalDialog
+                        className={styles['addon-modal-container']}
+                        title={selectedMetaResourceRef !== null && selectedMetaResourceRef.content.type === 'Ready' ? selectedMetaResourceRef.content.content.metaExtension.name : null}
+                        onCloseRequest={clearSelectedAddon}>
+                        <iframe
+                            className={styles['addon-modal-iframe']}
+                            src={selectedMetaResourceRef !== null && selectedMetaResourceRef.content.type === 'Ready' ? selectedMetaResourceRef.content.content.metaExtension.url : null}
+                        />
+                    </ModalDialog>
+                    :
+                    null
+            }
         </div>
     );
 };
 
 MetaDetails.propTypes = {
     urlParams: PropTypes.shape({
+        path: PropTypes.string,
         type: PropTypes.string,
         id: PropTypes.string,
         videoId: PropTypes.string
diff --git a/src/routes/MetaDetails/styles.less b/src/routes/MetaDetails/styles.less
index 295166dde..941018b4f 100644
--- a/src/routes/MetaDetails/styles.less
+++ b/src/routes/MetaDetails/styles.less
@@ -7,6 +7,11 @@
     meta-info-container: meta-info-container;
 }
 
+:import('~stremio/common/ModalDialog/styles.less') {
+    modal-dialog-container: modal-dialog-container;
+    title-modal-container: title-container;
+}
+
 .metadetails-container {
     display: flex;
     flex-direction: column;
@@ -104,4 +109,20 @@
             background-color: @color-background-dark5-70;
         }
     }
+}
+
+.addon-modal-container {
+    .modal-dialog-container {
+        width: 80%;
+        height: 80%;
+
+        .title-modal-container {
+            max-height: 1.2em;
+        }
+
+        .addon-modal-iframe {
+            width: 100%;
+            height: 100%;
+        }
+    }
 }
\ No newline at end of file

From 4105e7eeb55c2f03cae48e595aebbea86f6512ed Mon Sep 17 00:00:00 2001
From: svetlagasheva <svetulka_24@mail.bg>
Date: Mon, 27 Apr 2020 16:44:22 +0300
Subject: [PATCH 07/36] function for navigation from iframe added

---
 src/routes/MetaDetails/MetaDetails.js | 11 +++++++++++
 1 file changed, 11 insertions(+)

diff --git a/src/routes/MetaDetails/MetaDetails.js b/src/routes/MetaDetails/MetaDetails.js
index 95a4461fb..47dddbebe 100644
--- a/src/routes/MetaDetails/MetaDetails.js
+++ b/src/routes/MetaDetails/MetaDetails.js
@@ -2,6 +2,7 @@
 
 const React = require('react');
 const PropTypes = require('prop-types');
+const UrlUtils = require('url');
 const { VerticalNavBar, HorizontalNavBar, MetaPreview, ModalDialog, Image, useInLibrary } = require('stremio/common');
 const StreamsList = require('./StreamsList');
 const VideosList = require('./VideosList');
@@ -62,6 +63,15 @@ const MetaDetails = ({ urlParams, queryParams }) => {
         queryParams.delete('metaTransportUrl');
         window.location.replace(`#${urlParams.path}`);
     }, [queryParams]);
+    const receiveMessage = React.useCallback((event) => {
+        const { protocol, path } = UrlUtils.parse(event.data);
+        if (event.data.startsWith(protocol)) {
+            window.location.replace(`#${path}`);
+        }
+    }, []);
+    React.useEffect(() => {
+        window.addEventListener('message', receiveMessage, false);
+    }, []);
     const [inLibrary, toggleInLibrary] = useInLibrary(selectedMetaResource !== null && selectedMetaResource.content.type === 'Ready' ? selectedMetaResource.content.content : null);
     return (
         <div className={styles['metadetails-container']}>
@@ -162,6 +172,7 @@ const MetaDetails = ({ urlParams, queryParams }) => {
                         onCloseRequest={clearSelectedAddon}>
                         <iframe
                             className={styles['addon-modal-iframe']}
+                            sandbox={'allow-forms allow-scripts'}
                             src={selectedMetaResourceRef !== null && selectedMetaResourceRef.content.type === 'Ready' ? selectedMetaResourceRef.content.content.metaExtension.url : null}
                         />
                     </ModalDialog>

From 2487133b7839954602017f7f7eedcbaea83a4280 Mon Sep 17 00:00:00 2001
From: svetlagasheva <svetulka_24@mail.bg>
Date: Mon, 27 Apr 2020 18:37:46 +0300
Subject: [PATCH 08/36] select the last season in videos list if there is no
 selected season

---
 src/routes/MetaDetails/VideosList/useSelectableSeasons.js | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/routes/MetaDetails/VideosList/useSelectableSeasons.js b/src/routes/MetaDetails/VideosList/useSelectableSeasons.js
index 295611022..980625ee1 100644
--- a/src/routes/MetaDetails/VideosList/useSelectableSeasons.js
+++ b/src/routes/MetaDetails/VideosList/useSelectableSeasons.js
@@ -18,7 +18,7 @@ const reducer = (state, action) => {
                 state.selectedSeason
                 :
                 seasons.length > 0 ?
-                    seasons[0]
+                    seasons[seasons.length - 1]
                     :
                     null;
             return {

From 937d034fa2a5568daf661987d7e541b22aebefe1 Mon Sep 17 00:00:00 2001
From: svetlagasheva <svetulka_24@mail.bg>
Date: Mon, 27 Apr 2020 18:43:59 +0300
Subject: [PATCH 09/36] test for selected season fixed

---
 tests/hooks.spec.js | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/tests/hooks.spec.js b/tests/hooks.spec.js
index 916402c56..7a68de98e 100644
--- a/tests/hooks.spec.js
+++ b/tests/hooks.spec.js
@@ -7,10 +7,10 @@ const videos = [{ 'season': 4 }, { 'season': 5 }, { 'season': 4 }, { 'season': 7
 
 describe('hooks tests', () => {
     describe('useSelectableSeasons hook', () => {
-        it('match 4', async () => {
+        it('match 7', async () => {
             const { result } = renderHook(() => useSelectableSeasons(videos));
             const [, selectedSeason] = result.current;
-            expect(selectedSeason).toBe(4);
+            expect(selectedSeason).toBe(7);
         });
 
         it('match 5', async () => {

From 042e8b7ddb2ed5fea6dcd249a6898ea827640e94 Mon Sep 17 00:00:00 2001
From: svetlagasheva <svetulka_24@mail.bg>
Date: Tue, 28 Apr 2020 11:06:10 +0300
Subject: [PATCH 10/36] upcoming episodes shown in videos list

---
 src/routes/MetaDetails/VideosList/VideosList.js | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/routes/MetaDetails/VideosList/VideosList.js b/src/routes/MetaDetails/VideosList/VideosList.js
index 5ea7e8b5c..cd0c93450 100644
--- a/src/routes/MetaDetails/VideosList/VideosList.js
+++ b/src/routes/MetaDetails/VideosList/VideosList.js
@@ -76,7 +76,7 @@ const VideosList = ({ className, metaResource }) => {
                                                 );
                                         })
                                         .map((video, index) => (
-                                            <Video {...video} key={index} />
+                                            <Video {...video} upcoming={video.released.getTime() > (new Date).getTime()} key={index} />
                                         ))
                                 }
                             </div>

From 050324e750aca021cd49d86de3422e099e5eff2d Mon Sep 17 00:00:00 2001
From: svetlagasheva <svetulka_24@mail.bg>
Date: Tue, 28 Apr 2020 16:33:37 +0300
Subject: [PATCH 11/36] prevent rendering of invalid link urls

---
 src/common/MetaPreview/MetaPreview.js | 12 +++++++++---
 1 file changed, 9 insertions(+), 3 deletions(-)

diff --git a/src/common/MetaPreview/MetaPreview.js b/src/common/MetaPreview/MetaPreview.js
index a1cae3a77..e484b97ab 100644
--- a/src/common/MetaPreview/MetaPreview.js
+++ b/src/common/MetaPreview/MetaPreview.js
@@ -23,13 +23,19 @@ const ALLOWED_LINK_REDIRECTS = [
     routesRegexp.discover.regexp,
     routesRegexp.metadetails.regexp
 ];
+const PROTOCOLS = ['https:', 'http:'];
 
 const MetaPreview = ({ className, compact, name, logo, background, runtime, releaseInfo, released, description, links, trailer, inLibrary, toggleInLibrary }) => {
     const [shareModalOpen, openShareModal, closeShareModal] = useBinaryState(false);
     const linksGroups = React.useMemo(() => {
         return Array.isArray(links) ?
             links
-                .filter((link) => link && typeof link.category === 'string' && typeof link.url === 'string')
+                .filter((link) => {
+                    if (link && typeof link.category === 'string' && typeof link.url === 'string') {
+                        const { protocol, host } = UrlUtils.parse(link.url);
+                        return protocol === 'stremio:' || (PROTOCOLS.includes(protocol) && typeof host === 'string' && host.length > 0);
+                    }
+                })
                 .reduce((linksGroups, { category, name, url }) => {
                     if (category === CONSTANTS.IMDB_LINK_CATEGORY) {
                         linksGroups[category] = {
@@ -42,7 +48,7 @@ const MetaPreview = ({ className, compact, name, logo, background, runtime, rele
                             href: url
                         };
                     } else {
-                        const { protocol, host, path, pathname } = UrlUtils.parse(url);
+                        const { protocol, path, pathname } = UrlUtils.parse(url);
                         if (protocol === 'stremio:') {
                             if (ALLOWED_LINK_REDIRECTS.some((regexp) => pathname.match(regexp))) {
                                 linksGroups[category] = linksGroups[category] || [];
@@ -51,7 +57,7 @@ const MetaPreview = ({ className, compact, name, logo, background, runtime, rele
                                     href: `#${path}`
                                 });
                             }
-                        } else if (typeof host === 'string' && host.length > 0) {
+                        } else {
                             linksGroups[category] = linksGroups[category] || [];
                             linksGroups[category].push({
                                 label: name,

From 063908f1238abf950c3017fc4a3cb2eca26e253d Mon Sep 17 00:00:00 2001
From: svetlagasheva <svetulka_24@mail.bg>
Date: Tue, 28 Apr 2020 17:11:52 +0300
Subject: [PATCH 12/36] map upcoming in meta_resources in useMetaDetails hook

---
 src/routes/MetaDetails/VideosList/VideosList.js | 2 +-
 src/routes/MetaDetails/useMetaDetails.js        | 1 +
 2 files changed, 2 insertions(+), 1 deletion(-)

diff --git a/src/routes/MetaDetails/VideosList/VideosList.js b/src/routes/MetaDetails/VideosList/VideosList.js
index cd0c93450..5ea7e8b5c 100644
--- a/src/routes/MetaDetails/VideosList/VideosList.js
+++ b/src/routes/MetaDetails/VideosList/VideosList.js
@@ -76,7 +76,7 @@ const VideosList = ({ className, metaResource }) => {
                                                 );
                                         })
                                         .map((video, index) => (
-                                            <Video {...video} upcoming={video.released.getTime() > (new Date).getTime()} key={index} />
+                                            <Video {...video} key={index} />
                                         ))
                                 }
                             </div>
diff --git a/src/routes/MetaDetails/useMetaDetails.js b/src/routes/MetaDetails/useMetaDetails.js
index 6f2a6722c..1bf262262 100644
--- a/src/routes/MetaDetails/useMetaDetails.js
+++ b/src/routes/MetaDetails/useMetaDetails.js
@@ -33,6 +33,7 @@ const mapMetaDetailsStateWithCtx = (meta_details, ctx) => {
                                     :
                                     NaN
                             ),
+                            upcoming: new Date(video.released).getTime() > (new Date).getTime(),
                             // TODO add watched and progress
                             deepLinks: deepLinking.withVideo({
                                 video,

From 0c0e34f0b550260e70c5b86c02e0f00b9aa9a765 Mon Sep 17 00:00:00 2001
From: svetlagasheva <svetulka_24@mail.bg>
Date: Tue, 28 Apr 2020 17:18:40 +0300
Subject: [PATCH 13/36] typo fixed

---
 src/routes/MetaDetails/useMetaDetails.js | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/routes/MetaDetails/useMetaDetails.js b/src/routes/MetaDetails/useMetaDetails.js
index 1bf262262..16d73360f 100644
--- a/src/routes/MetaDetails/useMetaDetails.js
+++ b/src/routes/MetaDetails/useMetaDetails.js
@@ -33,7 +33,7 @@ const mapMetaDetailsStateWithCtx = (meta_details, ctx) => {
                                     :
                                     NaN
                             ),
-                            upcoming: new Date(video.released).getTime() > (new Date).getTime(),
+                            upcoming: new Date(video.released).getTime() > new Date().getTime(),
                             // TODO add watched and progress
                             deepLinks: deepLinking.withVideo({
                                 video,

From a4887ce89ddc98434d59f093d76439fe8e9f76aa Mon Sep 17 00:00:00 2001
From: svetlagasheva <svetulka_24@mail.bg>
Date: Tue, 28 Apr 2020 18:53:30 +0300
Subject: [PATCH 14/36] detach receiveMessage handler

---
 src/routes/MetaDetails/MetaDetails.js | 3 +++
 1 file changed, 3 insertions(+)

diff --git a/src/routes/MetaDetails/MetaDetails.js b/src/routes/MetaDetails/MetaDetails.js
index 47dddbebe..d7c31d856 100644
--- a/src/routes/MetaDetails/MetaDetails.js
+++ b/src/routes/MetaDetails/MetaDetails.js
@@ -71,6 +71,9 @@ const MetaDetails = ({ urlParams, queryParams }) => {
     }, []);
     React.useEffect(() => {
         window.addEventListener('message', receiveMessage, false);
+        return () => {
+            window.removeEventListener('message', receiveMessage);
+        };
     }, []);
     const [inLibrary, toggleInLibrary] = useInLibrary(selectedMetaResource !== null && selectedMetaResource.content.type === 'Ready' ? selectedMetaResource.content.content : null);
     return (

From 7be118242d7ac5468d5a4ade772e482e3dac2a0f Mon Sep 17 00:00:00 2001
From: svetlagasheva <svetulka_24@mail.bg>
Date: Tue, 28 Apr 2020 19:19:51 +0300
Subject: [PATCH 15/36] check for metaResource addon added

---
 src/routes/MetaDetails/MetaDetails.js | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/routes/MetaDetails/MetaDetails.js b/src/routes/MetaDetails/MetaDetails.js
index d7c31d856..090d652f9 100644
--- a/src/routes/MetaDetails/MetaDetails.js
+++ b/src/routes/MetaDetails/MetaDetails.js
@@ -15,7 +15,7 @@ const MetaDetails = ({ urlParams, queryParams }) => {
         return metaDetails.selected !== null ? metaDetails.selected.meta_resources_ref : null;
     }, [metaDetails.selected]);
     const selectedAddon = queryParams.get('metaTransportUrl');
-    const metaResourcesReady = metaDetails.meta_resources.filter((metaResource) => metaResource.content.type === 'Ready' && metaResource.content.content.metaExtension !== null);
+    const metaResourcesReady = metaDetails.meta_resources.filter((metaResource) => metaResource.content.type === 'Ready' && metaResource.content.content.metaExtension !== null && metaResource.addon !== null);
     const selectedMetaResource = React.useMemo(() => {
         return metaDetails.meta_resources.reduceRight((result, metaResource) => {
             if (metaResource.content.type === 'Ready') {

From c8b83e72c2c7b2f3374c1a32d1be203cb9a543d3 Mon Sep 17 00:00:00 2001
From: svetlagasheva <svetulka_24@mail.bg>
Date: Wed, 29 Apr 2020 11:57:56 +0300
Subject: [PATCH 16/36] useMetaExtensions hook implemented

---
 src/routes/MetaDetails/useMetaExtensions.js | 21 +++++++++++++++++++++
 1 file changed, 21 insertions(+)
 create mode 100644 src/routes/MetaDetails/useMetaExtensions.js

diff --git a/src/routes/MetaDetails/useMetaExtensions.js b/src/routes/MetaDetails/useMetaExtensions.js
new file mode 100644
index 000000000..54654e754
--- /dev/null
+++ b/src/routes/MetaDetails/useMetaExtensions.js
@@ -0,0 +1,21 @@
+// Copyright (C) 2017-2020 Smart code 203358507
+
+const React = require('react');
+
+const useMetaExtensions = (metaResources) => {
+    const tabs = metaResources.filter((metaResource) => metaResource.content.type === 'Ready' && metaResource.content.content.metaExtension !== null && metaResource.addon !== null)
+        .map((metaResource) => ({
+            id: metaResource.addon.transportUrl,
+            label: metaResource.addon.manifest.name,
+            logo: metaResource.addon.manifest.logo,
+            icon: 'ic_addons',
+            onClick: () => { setSelected(metaResource); }
+        }));
+    const [selected, setSelected] = React.useState(null);
+    const closeSelected = React.useCallback(() => {
+        setSelected(null);
+    }, []);
+    return { tabs, selected, closeSelected };
+};
+
+module.exports = useMetaExtensions;

From 76a3c2c03bce62dd493f4e5276b678df444a0745 Mon Sep 17 00:00:00 2001
From: svetlagasheva <svetulka_24@mail.bg>
Date: Wed, 29 Apr 2020 12:55:35 +0300
Subject: [PATCH 17/36] useMetaExtensions hook used in MetaDetails

---
 src/routes/MetaDetails/MetaDetails.js | 54 ++++++++-------------------
 1 file changed, 15 insertions(+), 39 deletions(-)

diff --git a/src/routes/MetaDetails/MetaDetails.js b/src/routes/MetaDetails/MetaDetails.js
index 090d652f9..05482e10d 100644
--- a/src/routes/MetaDetails/MetaDetails.js
+++ b/src/routes/MetaDetails/MetaDetails.js
@@ -7,15 +7,15 @@ const { VerticalNavBar, HorizontalNavBar, MetaPreview, ModalDialog, Image, useIn
 const StreamsList = require('./StreamsList');
 const VideosList = require('./VideosList');
 const useMetaDetails = require('./useMetaDetails');
+const useMetaExtensions = require('./useMetaExtensions');
 const styles = require('./styles');
 
-const MetaDetails = ({ urlParams, queryParams }) => {
+const MetaDetails = ({ urlParams }) => {
     const metaDetails = useMetaDetails(urlParams);
+    const { tabs, selected, closeSelected } = useMetaExtensions(metaDetails.meta_resources);
     const metaResourceRef = React.useMemo(() => {
         return metaDetails.selected !== null ? metaDetails.selected.meta_resources_ref : null;
     }, [metaDetails.selected]);
-    const selectedAddon = queryParams.get('metaTransportUrl');
-    const metaResourcesReady = metaDetails.meta_resources.filter((metaResource) => metaResource.content.type === 'Ready' && metaResource.content.content.metaExtension !== null && metaResource.addon !== null);
     const selectedMetaResource = React.useMemo(() => {
         return metaDetails.meta_resources.reduceRight((result, metaResource) => {
             if (metaResource.content.type === 'Ready') {
@@ -24,22 +24,11 @@ const MetaDetails = ({ urlParams, queryParams }) => {
 
             return result;
         }, null);
-    }, [metaDetails, selectedAddon]);
-    const selectedMetaResourceRef = React.useMemo(() => {
-        return metaDetails.meta_resources.reduce((result, metaResource) => {
-            if (typeof selectedAddon === 'string') {
-                if (metaResource.request.base === selectedAddon) {
-                    return metaResource;
-                }
-            }
-
-            return result;
-        }, null);
-    }, [metaDetails, selectedAddon]);
+    }, [metaDetails]);
     const streamsResourceRef = metaDetails.selected !== null ? metaDetails.selected.streams_resource_ref : null;
     const streamsResources = metaDetails.streams_resources;
     const selectedVideo = React.useMemo(() => {
-        return streamsResourceRef !== null && selectedMetaResource !== null && selectedMetaResource.content.type === 'Ready' ?
+        return streamsResourceRef !== null && selectedMetaResource !== null ?
             selectedMetaResource.content.content.videos.reduce((result, video) => {
                 if (video.id === streamsResourceRef.id) {
                     return video;
@@ -50,19 +39,6 @@ const MetaDetails = ({ urlParams, queryParams }) => {
             :
             null;
     }, [selectedMetaResource, streamsResourceRef]);
-    const tabs = React.useMemo(() => {
-        return metaResourcesReady.map((metaResource) => ({
-            id: metaResource.addon.transportUrl,
-            label: metaResource.addon.manifest.name,
-            logo: metaResource.addon.manifest.logo,
-            icon: 'ic_addons',
-            href: metaResource.deepLinks.meta_details_streams !== null ? metaResource.deepLinks.meta_details_streams : metaResource.deepLinks.meta_details_videos
-        }));
-    }, [metaDetails]);
-    const clearSelectedAddon = React.useCallback(() => {
-        queryParams.delete('metaTransportUrl');
-        window.location.replace(`#${urlParams.path}`);
-    }, [queryParams]);
     const receiveMessage = React.useCallback((event) => {
         const { protocol, path } = UrlUtils.parse(event.data);
         if (event.data.startsWith(protocol)) {
@@ -75,21 +51,21 @@ const MetaDetails = ({ urlParams, queryParams }) => {
             window.removeEventListener('message', receiveMessage);
         };
     }, []);
-    const [inLibrary, toggleInLibrary] = useInLibrary(selectedMetaResource !== null && selectedMetaResource.content.type === 'Ready' ? selectedMetaResource.content.content : null);
+    const [inLibrary, toggleInLibrary] = useInLibrary(selectedMetaResource !== null ? selectedMetaResource.content.content : null);
     return (
         <div className={styles['metadetails-container']}>
             <HorizontalNavBar
                 className={styles['nav-bar']}
                 backButton={true}
-                title={selectedMetaResource !== null && selectedMetaResource.content.type === 'Ready' ? selectedMetaResource.content.content.name : null}
+                title={selectedMetaResource !== null ? selectedMetaResource.content.content.name : null}
             />
             <div className={styles['metadetails-content']}>
                 {
-                    metaResourcesReady.length > 0 ?
+                    tabs.length > 0 ?
                         <VerticalNavBar
                             className={styles['vertical-nav-bar']}
                             tabs={tabs}
-                            selected={typeof selectedAddon === 'string' ? selectedAddon : null}
+                            selected={selected !== null ? selected.request.base : null}
                         />
                         :
                         null
@@ -113,7 +89,7 @@ const MetaDetails = ({ urlParams, queryParams }) => {
                                     <div className={styles['message-label']}>No metadata was found!</div>
                                 </div>
                                 :
-                                selectedMetaResource !== null && selectedMetaResource.content.type === 'Ready' ?
+                                selectedMetaResource !== null ?
                                     <React.Fragment>
                                         {
                                             typeof selectedMetaResource.content.content.background === 'string' &&
@@ -168,15 +144,15 @@ const MetaDetails = ({ urlParams, queryParams }) => {
                 }
             </div>
             {
-                typeof selectedAddon === 'string' ?
+                selected !== null ?
                     <ModalDialog
                         className={styles['addon-modal-container']}
-                        title={selectedMetaResourceRef !== null && selectedMetaResourceRef.content.type === 'Ready' ? selectedMetaResourceRef.content.content.metaExtension.name : null}
-                        onCloseRequest={clearSelectedAddon}>
+                        title={selected.content.content.metaExtension.name}
+                        onCloseRequest={closeSelected}>
                         <iframe
                             className={styles['addon-modal-iframe']}
-                            sandbox={'allow-forms allow-scripts'}
-                            src={selectedMetaResourceRef !== null && selectedMetaResourceRef.content.type === 'Ready' ? selectedMetaResourceRef.content.content.metaExtension.url : null}
+                            sandbox={'allow-forms allow-scripts allow-same-origin'}
+                            src={selected.content.content.metaExtension.url}
                         />
                     </ModalDialog>
                     :

From b135d311fc21b7679ec043679d22ba04e23449a3 Mon Sep 17 00:00:00 2001
From: svetlagasheva <svetulka_24@mail.bg>
Date: Wed, 29 Apr 2020 18:29:38 +0300
Subject: [PATCH 18/36] support for multiple metaExtensions implemented

---
 src/routes/MetaDetails/MetaDetails.js       |  6 +++---
 src/routes/MetaDetails/useMetaDetails.js    |  8 +------
 src/routes/MetaDetails/useMetaExtensions.js | 24 ++++++++++++++-------
 3 files changed, 20 insertions(+), 18 deletions(-)

diff --git a/src/routes/MetaDetails/MetaDetails.js b/src/routes/MetaDetails/MetaDetails.js
index 05482e10d..c9f86ae2e 100644
--- a/src/routes/MetaDetails/MetaDetails.js
+++ b/src/routes/MetaDetails/MetaDetails.js
@@ -65,7 +65,7 @@ const MetaDetails = ({ urlParams }) => {
                         <VerticalNavBar
                             className={styles['vertical-nav-bar']}
                             tabs={tabs}
-                            selected={selected !== null ? selected.request.base : null}
+                            selected={selected !== null ? selected.metaExtension.url : null}
                         />
                         :
                         null
@@ -147,12 +147,12 @@ const MetaDetails = ({ urlParams }) => {
                 selected !== null ?
                     <ModalDialog
                         className={styles['addon-modal-container']}
-                        title={selected.content.content.metaExtension.name}
+                        title={selected.metaExtension.name}
                         onCloseRequest={closeSelected}>
                         <iframe
                             className={styles['addon-modal-iframe']}
                             sandbox={'allow-forms allow-scripts allow-same-origin'}
-                            src={selected.content.content.metaExtension.url}
+                            src={selected.metaExtension.url}
                         />
                     </ModalDialog>
                     :
diff --git a/src/routes/MetaDetails/useMetaDetails.js b/src/routes/MetaDetails/useMetaDetails.js
index 0bc4c679f..fa0bccfea 100644
--- a/src/routes/MetaDetails/useMetaDetails.js
+++ b/src/routes/MetaDetails/useMetaDetails.js
@@ -40,13 +40,7 @@ const mapMetaDetailsStateWithCtx = (meta_details, ctx) => {
                                 metaItem: meta_resource.content.content
                             })
                         })),
-                        metaExtension: meta_resource.content.content.links.reduceRight((result, link) => {
-                            if (link.category === CONSTANTS.META_LINK_CATEGORY) {
-                                return link;
-                            }
-
-                            return result;
-                        }, null)
+                        metaExtensions: meta_resource.content.content.links.filter((link) => link.category === CONSTANTS.META_LINK_CATEGORY)
                     }
                 },
                 deepLinks: meta_details.selected !== null ?
diff --git a/src/routes/MetaDetails/useMetaExtensions.js b/src/routes/MetaDetails/useMetaExtensions.js
index 54654e754..159543b62 100644
--- a/src/routes/MetaDetails/useMetaExtensions.js
+++ b/src/routes/MetaDetails/useMetaExtensions.js
@@ -3,14 +3,22 @@
 const React = require('react');
 
 const useMetaExtensions = (metaResources) => {
-    const tabs = metaResources.filter((metaResource) => metaResource.content.type === 'Ready' && metaResource.content.content.metaExtension !== null && metaResource.addon !== null)
-        .map((metaResource) => ({
-            id: metaResource.addon.transportUrl,
-            label: metaResource.addon.manifest.name,
-            logo: metaResource.addon.manifest.logo,
-            icon: 'ic_addons',
-            onClick: () => { setSelected(metaResource); }
-        }));
+    const tabs = metaResources.filter((metaResource) => metaResource.content.type === 'Ready' && metaResource.content.content.metaExtensions.length > 0 && metaResource.addon !== null)
+        .map((metaResource) => {
+            return metaResource.content.content.metaExtensions.map((metaExtension) => {
+                const tab = {
+                    id: metaExtension.url,
+                    label: metaResource.addon.manifest.name,
+                    logo: metaResource.addon.manifest.logo,
+                    icon: 'ic_addons',
+                    metaExtension: metaExtension,
+                    onClick: () => { setSelected(tab); }
+                };
+                return tab;
+            });
+        })
+        .flat(2)
+        .filter((tab, index, tabs) => tabs.findIndex((_tab) => _tab.id === tab.id) === index);
     const [selected, setSelected] = React.useState(null);
     const closeSelected = React.useCallback(() => {
         setSelected(null);

From 94cfa4574f2025d5a0939889b1a56837ef308f46 Mon Sep 17 00:00:00 2001
From: svetlagasheva <svetulka_24@mail.bg>
Date: Thu, 30 Apr 2020 11:44:05 +0300
Subject: [PATCH 19/36] closeSelected renamed to clearSelected

---
 src/routes/MetaDetails/MetaDetails.js       | 4 ++--
 src/routes/MetaDetails/useMetaExtensions.js | 4 ++--
 2 files changed, 4 insertions(+), 4 deletions(-)

diff --git a/src/routes/MetaDetails/MetaDetails.js b/src/routes/MetaDetails/MetaDetails.js
index c9f86ae2e..bac0980c5 100644
--- a/src/routes/MetaDetails/MetaDetails.js
+++ b/src/routes/MetaDetails/MetaDetails.js
@@ -12,7 +12,7 @@ const styles = require('./styles');
 
 const MetaDetails = ({ urlParams }) => {
     const metaDetails = useMetaDetails(urlParams);
-    const { tabs, selected, closeSelected } = useMetaExtensions(metaDetails.meta_resources);
+    const { tabs, selected, clearSelected } = useMetaExtensions(metaDetails.meta_resources);
     const metaResourceRef = React.useMemo(() => {
         return metaDetails.selected !== null ? metaDetails.selected.meta_resources_ref : null;
     }, [metaDetails.selected]);
@@ -148,7 +148,7 @@ const MetaDetails = ({ urlParams }) => {
                     <ModalDialog
                         className={styles['addon-modal-container']}
                         title={selected.metaExtension.name}
-                        onCloseRequest={closeSelected}>
+                        onCloseRequest={clearSelected}>
                         <iframe
                             className={styles['addon-modal-iframe']}
                             sandbox={'allow-forms allow-scripts allow-same-origin'}
diff --git a/src/routes/MetaDetails/useMetaExtensions.js b/src/routes/MetaDetails/useMetaExtensions.js
index 159543b62..50435a19c 100644
--- a/src/routes/MetaDetails/useMetaExtensions.js
+++ b/src/routes/MetaDetails/useMetaExtensions.js
@@ -20,10 +20,10 @@ const useMetaExtensions = (metaResources) => {
         .flat(2)
         .filter((tab, index, tabs) => tabs.findIndex((_tab) => _tab.id === tab.id) === index);
     const [selected, setSelected] = React.useState(null);
-    const closeSelected = React.useCallback(() => {
+    const clearSelected = React.useCallback(() => {
         setSelected(null);
     }, []);
-    return { tabs, selected, closeSelected };
+    return { tabs, selected, clearSelected };
 };
 
 module.exports = useMetaExtensions;

From 99fdd38e169660e1f8ab6973262254ac4cf73116 Mon Sep 17 00:00:00 2001
From: svetlagasheva <svetulka_24@mail.bg>
Date: Thu, 30 Apr 2020 15:38:00 +0300
Subject: [PATCH 20/36] linksGroups use Map instead of object

---
 src/common/MetaPreview/MetaPreview.js | 40 +++++++++++++--------------
 1 file changed, 19 insertions(+), 21 deletions(-)

diff --git a/src/common/MetaPreview/MetaPreview.js b/src/common/MetaPreview/MetaPreview.js
index e484b97ab..99409302c 100644
--- a/src/common/MetaPreview/MetaPreview.js
+++ b/src/common/MetaPreview/MetaPreview.js
@@ -23,43 +23,41 @@ const ALLOWED_LINK_REDIRECTS = [
     routesRegexp.discover.regexp,
     routesRegexp.metadetails.regexp
 ];
-const PROTOCOLS = ['https:', 'http:'];
 
 const MetaPreview = ({ className, compact, name, logo, background, runtime, releaseInfo, released, description, links, trailer, inLibrary, toggleInLibrary }) => {
     const [shareModalOpen, openShareModal, closeShareModal] = useBinaryState(false);
     const linksGroups = React.useMemo(() => {
         return Array.isArray(links) ?
             links
-                .filter((link) => {
-                    if (link && typeof link.category === 'string' && typeof link.url === 'string') {
-                        const { protocol, host } = UrlUtils.parse(link.url);
-                        return protocol === 'stremio:' || (PROTOCOLS.includes(protocol) && typeof host === 'string' && host.length > 0);
-                    }
-                })
+                .filter((link) => link && typeof link.category === 'string' && typeof link.url === 'string')
                 .reduce((linksGroups, { category, name, url }) => {
                     if (category === CONSTANTS.IMDB_LINK_CATEGORY) {
-                        linksGroups[category] = {
+                        linksGroups.set(category, {
                             label: name,
                             href: `https://www.stremio.com/warning#${encodeURIComponent(`https://www.imdb.com/title/${encodeURIComponent(url)}`)}`
-                        };
+                        });
                     } else if (category === CONSTANTS.SHARE_LINK_CATEGORY) {
-                        linksGroups[category] = {
+                        linksGroups.set(category, {
                             label: name,
                             href: url
-                        };
+                        });
                     } else {
-                        const { protocol, path, pathname } = UrlUtils.parse(url);
+                        const { protocol, host, path, pathname } = UrlUtils.parse(url);
                         if (protocol === 'stremio:') {
-                            if (ALLOWED_LINK_REDIRECTS.some((regexp) => pathname.match(regexp))) {
-                                linksGroups[category] = linksGroups[category] || [];
-                                linksGroups[category].push({
+                            if (pathname !== null && ALLOWED_LINK_REDIRECTS.some((regexp) => pathname.match(regexp))) {
+                                if (!linksGroups.has(category)) {
+                                    linksGroups.set(category, []);
+                                }
+                                linksGroups.get(category).push({
                                     label: name,
                                     href: `#${path}`
                                 });
                             }
-                        } else {
-                            linksGroups[category] = linksGroups[category] || [];
-                            linksGroups[category].push({
+                        } else if (typeof host === 'string' && host.length > 0) {
+                            if (!linksGroups.has(category)) {
+                                linksGroups.set(category, []);
+                            }
+                            linksGroups.get(category).push({
                                 label: name,
                                 href: `https://www.stremio.com/warning#${encodeURIComponent(url)}`
                             });
@@ -67,7 +65,7 @@ const MetaPreview = ({ className, compact, name, logo, background, runtime, rele
                     }
 
                     return linksGroups;
-                }, {})
+                }, new Map())
             :
             [];
     }, [links]);
@@ -156,7 +154,7 @@ const MetaPreview = ({ className, compact, name, logo, background, runtime, rele
                         null
                 }
                 {
-                    Object.keys(linksGroups)
+                    Array.from(linksGroups.keys())
                         .filter((category) => {
                             return category !== CONSTANTS.IMDB_LINK_CATEGORY &&
                                 category !== CONSTANTS.SHARE_LINK_CATEGORY;
@@ -166,7 +164,7 @@ const MetaPreview = ({ className, compact, name, logo, background, runtime, rele
                                 key={index}
                                 className={styles['meta-links']}
                                 label={category}
-                                links={linksGroups[category]}
+                                links={linksGroups.get(category)}
                             />
                         ))
                 }

From 60d9f5266c679b7bcc758e4b7336aee7948caebb Mon Sep 17 00:00:00 2001
From: svetlagasheva <svetulka_24@mail.bg>
Date: Thu, 30 Apr 2020 15:55:28 +0300
Subject: [PATCH 21/36] Date.now() instead of new Date().getTime() used

---
 src/routes/MetaDetails/useMetaDetails.js | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/routes/MetaDetails/useMetaDetails.js b/src/routes/MetaDetails/useMetaDetails.js
index 16d73360f..11f83d5ad 100644
--- a/src/routes/MetaDetails/useMetaDetails.js
+++ b/src/routes/MetaDetails/useMetaDetails.js
@@ -33,7 +33,7 @@ const mapMetaDetailsStateWithCtx = (meta_details, ctx) => {
                                     :
                                     NaN
                             ),
-                            upcoming: new Date(video.released).getTime() > new Date().getTime(),
+                            upcoming: Date.parse(video.released) > Date.now(),
                             // TODO add watched and progress
                             deepLinks: deepLinking.withVideo({
                                 video,

From a4ade4663cceed9cdfe69a97f77da419189a9451 Mon Sep 17 00:00:00 2001
From: svetlagasheva <svetulka_24@mail.bg>
Date: Thu, 30 Apr 2020 16:41:48 +0300
Subject: [PATCH 22/36] linksGroups rewritten with Map

---
 src/common/MetaPreview/MetaPreview.js | 14 +++++++-------
 1 file changed, 7 insertions(+), 7 deletions(-)

diff --git a/src/common/MetaPreview/MetaPreview.js b/src/common/MetaPreview/MetaPreview.js
index 99409302c..fd29e69ef 100644
--- a/src/common/MetaPreview/MetaPreview.js
+++ b/src/common/MetaPreview/MetaPreview.js
@@ -103,7 +103,7 @@ const MetaPreview = ({ className, compact, name, logo, background, runtime, rele
                         null
                 }
                 {
-                    (typeof releaseInfo === 'string' && releaseInfo.length > 0) || (released instanceof Date && !isNaN(released.getTime())) || (typeof runtime === 'string' && runtime.length > 0) || typeof linksGroups[CONSTANTS.IMDB_LINK_CATEGORY] === 'object' ?
+                    (typeof releaseInfo === 'string' && releaseInfo.length > 0) || (released instanceof Date && !isNaN(released.getTime())) || (typeof runtime === 'string' && runtime.length > 0) || typeof linksGroups.get(CONSTANTS.IMDB_LINK_CATEGORY) === 'object' ?
                         <div className={styles['runtime-release-info-container']}>
                             {
                                 typeof runtime === 'string' && runtime.length > 0 ?
@@ -121,16 +121,16 @@ const MetaPreview = ({ className, compact, name, logo, background, runtime, rele
                                         null
                             }
                             {
-                                typeof linksGroups[CONSTANTS.IMDB_LINK_CATEGORY] === 'object' ?
+                                typeof linksGroups.get(CONSTANTS.IMDB_LINK_CATEGORY) === 'object' ?
                                     <Button
                                         className={styles['imdb-button-container']}
-                                        title={linksGroups[CONSTANTS.IMDB_LINK_CATEGORY].label}
-                                        href={linksGroups[CONSTANTS.IMDB_LINK_CATEGORY].href}
+                                        title={linksGroups.get(CONSTANTS.IMDB_LINK_CATEGORY).label}
+                                        href={linksGroups.get(CONSTANTS.IMDB_LINK_CATEGORY).href}
                                         target={'_blank'}
                                         {...(compact ? { tabIndex: -1 } : null)}
                                     >
                                         <Icon className={styles['icon']} icon={'ic_imdbnoframe'} />
-                                        <div className={styles['label']}>{linksGroups[CONSTANTS.IMDB_LINK_CATEGORY].label}</div>
+                                        <div className={styles['label']}>{linksGroups.get(CONSTANTS.IMDB_LINK_CATEGORY).label}</div>
                                     </Button>
                                     :
                                     null
@@ -195,7 +195,7 @@ const MetaPreview = ({ className, compact, name, logo, background, runtime, rele
                         null
                 }
                 {
-                    typeof linksGroups[CONSTANTS.SHARE_LINK_CATEGORY] === 'object' ?
+                    typeof linksGroups.get(CONSTANTS.SHARE_LINK_CATEGORY) === 'object' ?
                         <React.Fragment>
                             <ActionButton
                                 className={styles['action-button']}
@@ -209,7 +209,7 @@ const MetaPreview = ({ className, compact, name, logo, background, runtime, rele
                                     <ModalDialog title={'Share'} onCloseRequest={closeShareModal}>
                                         <SharePrompt
                                             className={styles['share-prompt']}
-                                            url={linksGroups[CONSTANTS.SHARE_LINK_CATEGORY].href}
+                                            url={linksGroups.get(CONSTANTS.SHARE_LINK_CATEGORY).href}
                                         />
                                     </ModalDialog>
                                     :

From 8726d4e07ba21e3529b4f63b281f45ce6a1878c3 Mon Sep 17 00:00:00 2001
From: svetlagasheva <svetulka_24@mail.bg>
Date: Thu, 30 Apr 2020 17:33:32 +0300
Subject: [PATCH 23/36] linksGroups.has() instead of check for typeof used

---
 src/common/MetaPreview/MetaPreview.js | 6 +++---
 1 file changed, 3 insertions(+), 3 deletions(-)

diff --git a/src/common/MetaPreview/MetaPreview.js b/src/common/MetaPreview/MetaPreview.js
index fd29e69ef..f971cb58b 100644
--- a/src/common/MetaPreview/MetaPreview.js
+++ b/src/common/MetaPreview/MetaPreview.js
@@ -103,7 +103,7 @@ const MetaPreview = ({ className, compact, name, logo, background, runtime, rele
                         null
                 }
                 {
-                    (typeof releaseInfo === 'string' && releaseInfo.length > 0) || (released instanceof Date && !isNaN(released.getTime())) || (typeof runtime === 'string' && runtime.length > 0) || typeof linksGroups.get(CONSTANTS.IMDB_LINK_CATEGORY) === 'object' ?
+                    (typeof releaseInfo === 'string' && releaseInfo.length > 0) || (released instanceof Date && !isNaN(released.getTime())) || (typeof runtime === 'string' && runtime.length > 0) || linksGroups.has(CONSTANTS.IMDB_LINK_CATEGORY) ?
                         <div className={styles['runtime-release-info-container']}>
                             {
                                 typeof runtime === 'string' && runtime.length > 0 ?
@@ -121,7 +121,7 @@ const MetaPreview = ({ className, compact, name, logo, background, runtime, rele
                                         null
                             }
                             {
-                                typeof linksGroups.get(CONSTANTS.IMDB_LINK_CATEGORY) === 'object' ?
+                                linksGroups.has(CONSTANTS.IMDB_LINK_CATEGORY) ?
                                     <Button
                                         className={styles['imdb-button-container']}
                                         title={linksGroups.get(CONSTANTS.IMDB_LINK_CATEGORY).label}
@@ -195,7 +195,7 @@ const MetaPreview = ({ className, compact, name, logo, background, runtime, rele
                         null
                 }
                 {
-                    typeof linksGroups.get(CONSTANTS.SHARE_LINK_CATEGORY) === 'object' ?
+                    linksGroups.has(CONSTANTS.SHARE_LINK_CATEGORY) ?
                         <React.Fragment>
                             <ActionButton
                                 className={styles['action-button']}

From 2d58eb026e1e26040909161a8d3e3a9cb4768825 Mon Sep 17 00:00:00 2001
From: svetlagasheva <svetulka_24@mail.bg>
Date: Thu, 30 Apr 2020 18:01:46 +0300
Subject: [PATCH 24/36] check for links removed

---
 src/common/MetaPreview/MetaPreview.js | 61 +++++++++++++--------------
 1 file changed, 29 insertions(+), 32 deletions(-)

diff --git a/src/common/MetaPreview/MetaPreview.js b/src/common/MetaPreview/MetaPreview.js
index f971cb58b..b5f96c0a5 100644
--- a/src/common/MetaPreview/MetaPreview.js
+++ b/src/common/MetaPreview/MetaPreview.js
@@ -27,47 +27,44 @@ const ALLOWED_LINK_REDIRECTS = [
 const MetaPreview = ({ className, compact, name, logo, background, runtime, releaseInfo, released, description, links, trailer, inLibrary, toggleInLibrary }) => {
     const [shareModalOpen, openShareModal, closeShareModal] = useBinaryState(false);
     const linksGroups = React.useMemo(() => {
-        return Array.isArray(links) ?
-            links
-                .filter((link) => link && typeof link.category === 'string' && typeof link.url === 'string')
-                .reduce((linksGroups, { category, name, url }) => {
-                    if (category === CONSTANTS.IMDB_LINK_CATEGORY) {
-                        linksGroups.set(category, {
-                            label: name,
-                            href: `https://www.stremio.com/warning#${encodeURIComponent(`https://www.imdb.com/title/${encodeURIComponent(url)}`)}`
-                        });
-                    } else if (category === CONSTANTS.SHARE_LINK_CATEGORY) {
-                        linksGroups.set(category, {
-                            label: name,
-                            href: url
-                        });
-                    } else {
-                        const { protocol, host, path, pathname } = UrlUtils.parse(url);
-                        if (protocol === 'stremio:') {
-                            if (pathname !== null && ALLOWED_LINK_REDIRECTS.some((regexp) => pathname.match(regexp))) {
-                                if (!linksGroups.has(category)) {
-                                    linksGroups.set(category, []);
-                                }
-                                linksGroups.get(category).push({
-                                    label: name,
-                                    href: `#${path}`
-                                });
-                            }
-                        } else if (typeof host === 'string' && host.length > 0) {
+        return links
+            .filter((link) => link && typeof link.category === 'string' && typeof link.url === 'string')
+            .reduce((linksGroups, { category, name, url }) => {
+                if (category === CONSTANTS.IMDB_LINK_CATEGORY) {
+                    linksGroups.set(category, {
+                        label: name,
+                        href: `https://www.stremio.com/warning#${encodeURIComponent(`https://www.imdb.com/title/${encodeURIComponent(url)}`)}`
+                    });
+                } else if (category === CONSTANTS.SHARE_LINK_CATEGORY) {
+                    linksGroups.set(category, {
+                        label: name,
+                        href: url
+                    });
+                } else {
+                    const { protocol, host, path, pathname } = UrlUtils.parse(url);
+                    if (protocol === 'stremio:') {
+                        if (pathname !== null && ALLOWED_LINK_REDIRECTS.some((regexp) => pathname.match(regexp))) {
                             if (!linksGroups.has(category)) {
                                 linksGroups.set(category, []);
                             }
                             linksGroups.get(category).push({
                                 label: name,
-                                href: `https://www.stremio.com/warning#${encodeURIComponent(url)}`
+                                href: `#${path}`
                             });
                         }
+                    } else if (typeof host === 'string' && host.length > 0) {
+                        if (!linksGroups.has(category)) {
+                            linksGroups.set(category, []);
+                        }
+                        linksGroups.get(category).push({
+                            label: name,
+                            href: `https://www.stremio.com/warning#${encodeURIComponent(url)}`
+                        });
                     }
+                }
 
-                    return linksGroups;
-                }, new Map())
-            :
-            [];
+                return linksGroups;
+            }, new Map());
     }, [links]);
     const trailerHref = React.useMemo(() => {
         if (typeof trailer !== 'object' || trailer === null) {

From 8159328320d500d5c530474ba7bc5eef4e969cd6 Mon Sep 17 00:00:00 2001
From: svetlagasheva <svetulka_24@mail.bg>
Date: Mon, 4 May 2020 13:52:22 +0300
Subject: [PATCH 25/36] unused deepLinks dropped from useMetaDetails hook

---
 src/routes/MetaDetails/useMetaDetails.js | 9 ---------
 1 file changed, 9 deletions(-)

diff --git a/src/routes/MetaDetails/useMetaDetails.js b/src/routes/MetaDetails/useMetaDetails.js
index 61f614201..a64f3d6ac 100644
--- a/src/routes/MetaDetails/useMetaDetails.js
+++ b/src/routes/MetaDetails/useMetaDetails.js
@@ -44,15 +44,6 @@ const mapMetaDetailsStateWithCtx = (meta_details, ctx) => {
                         metaExtensions: meta_resource.content.content.links.filter((link) => link.category === CONSTANTS.META_LINK_CATEGORY)
                     }
                 },
-                deepLinks: meta_details.selected !== null ?
-                    deepLinking.withMetaResource({
-                        metaResource: meta_resource,
-                        type: meta_details.selected.meta_resource_ref.type_name,
-                        id: meta_details.selected.meta_resource_ref.id,
-                        videoId: meta_details.selected.streams_resource_ref !== null ? meta_details.selected.streams_resource_ref.id : null
-                    })
-                    :
-                    null,
                 addon: ctx.profile.addons.reduce((result, addon) => {
                     if (addon.transportUrl === meta_resource.request.base) {
                         return addon;

From 6e26594392ebd7dba7b62f83817abf42bc7b9aea Mon Sep 17 00:00:00 2001
From: svetlagasheva <svetulka_24@mail.bg>
Date: Mon, 4 May 2020 14:52:20 +0300
Subject: [PATCH 26/36] unused withMetaResource func dropped from deepLinking

---
 src/common/deepLinking.js | 12 ------------
 1 file changed, 12 deletions(-)

diff --git a/src/common/deepLinking.js b/src/common/deepLinking.js
index 49885808c..beff1431a 100644
--- a/src/common/deepLinking.js
+++ b/src/common/deepLinking.js
@@ -23,17 +23,6 @@ const withMetaItem = ({ metaItem }) => {
     };
 };
 
-const withMetaResource = ({ metaResource, type, id, videoId }) => {
-    const queryParams = new URLSearchParams([['metaTransportUrl', metaResource.request.base]]);
-    return {
-        meta_details_videos: `#/metadetails/${encodeURIComponent(type)}/${encodeURIComponent(id)}?${queryParams.toString()}`,
-        meta_details_streams: typeof videoId === 'string' ?
-            `#/metadetails/${encodeURIComponent(type)}/${encodeURIComponent(id)}/${encodeURIComponent(videoId)}?${queryParams.toString()}`
-            :
-            null
-    };
-};
-
 const withLibItem = ({ libItem, streams = {} }) => {
     const [stream, streamTransportUrl, metaTransportUrl] = typeof libItem.state.video_id === 'string' && typeof streams[`${encodeURIComponent(libItem._id)}/${encodeURIComponent(libItem.state.video_id)}`] === 'object' ?
         streams[`${encodeURIComponent(libItem._id)}/${encodeURIComponent(libItem.state.video_id)}`]
@@ -95,7 +84,6 @@ const withCatalog = ({ request }) => {
 module.exports = {
     withCatalog,
     withMetaItem,
-    withMetaResource,
     withLibItem,
     withVideo,
     withStream,

From d759785958d524fc651f7be65a1567202c5781a8 Mon Sep 17 00:00:00 2001
From: svetlagasheva <svetulka_24@mail.bg>
Date: Mon, 4 May 2020 14:56:48 +0300
Subject: [PATCH 27/36] receiveMessage func dropped for now

---
 src/routes/MetaDetails/MetaDetails.js | 14 --------------
 1 file changed, 14 deletions(-)

diff --git a/src/routes/MetaDetails/MetaDetails.js b/src/routes/MetaDetails/MetaDetails.js
index bac0980c5..656a46779 100644
--- a/src/routes/MetaDetails/MetaDetails.js
+++ b/src/routes/MetaDetails/MetaDetails.js
@@ -2,7 +2,6 @@
 
 const React = require('react');
 const PropTypes = require('prop-types');
-const UrlUtils = require('url');
 const { VerticalNavBar, HorizontalNavBar, MetaPreview, ModalDialog, Image, useInLibrary } = require('stremio/common');
 const StreamsList = require('./StreamsList');
 const VideosList = require('./VideosList');
@@ -39,18 +38,6 @@ const MetaDetails = ({ urlParams }) => {
             :
             null;
     }, [selectedMetaResource, streamsResourceRef]);
-    const receiveMessage = React.useCallback((event) => {
-        const { protocol, path } = UrlUtils.parse(event.data);
-        if (event.data.startsWith(protocol)) {
-            window.location.replace(`#${path}`);
-        }
-    }, []);
-    React.useEffect(() => {
-        window.addEventListener('message', receiveMessage, false);
-        return () => {
-            window.removeEventListener('message', receiveMessage);
-        };
-    }, []);
     const [inLibrary, toggleInLibrary] = useInLibrary(selectedMetaResource !== null ? selectedMetaResource.content.content : null);
     return (
         <div className={styles['metadetails-container']}>
@@ -164,7 +151,6 @@ const MetaDetails = ({ urlParams }) => {
 
 MetaDetails.propTypes = {
     urlParams: PropTypes.shape({
-        path: PropTypes.string,
         type: PropTypes.string,
         id: PropTypes.string,
         videoId: PropTypes.string

From ca90487cd8f3e5d72da30b244c7a427b8ba9bbad Mon Sep 17 00:00:00 2001
From: svetlagasheva <svetulka_24@mail.bg>
Date: Mon, 4 May 2020 15:07:45 +0300
Subject: [PATCH 28/36] MetaDetails modal class names renamed

---
 src/routes/MetaDetails/MetaDetails.js | 4 ++--
 src/routes/MetaDetails/styles.less    | 4 ++--
 2 files changed, 4 insertions(+), 4 deletions(-)

diff --git a/src/routes/MetaDetails/MetaDetails.js b/src/routes/MetaDetails/MetaDetails.js
index 656a46779..783841206 100644
--- a/src/routes/MetaDetails/MetaDetails.js
+++ b/src/routes/MetaDetails/MetaDetails.js
@@ -133,11 +133,11 @@ const MetaDetails = ({ urlParams }) => {
             {
                 selected !== null ?
                     <ModalDialog
-                        className={styles['addon-modal-container']}
+                        className={styles['meta-extension-modal-container']}
                         title={selected.metaExtension.name}
                         onCloseRequest={clearSelected}>
                         <iframe
-                            className={styles['addon-modal-iframe']}
+                            className={styles['meta-extension-modal-iframe']}
                             sandbox={'allow-forms allow-scripts allow-same-origin'}
                             src={selected.metaExtension.url}
                         />
diff --git a/src/routes/MetaDetails/styles.less b/src/routes/MetaDetails/styles.less
index 941018b4f..4949c3eb5 100644
--- a/src/routes/MetaDetails/styles.less
+++ b/src/routes/MetaDetails/styles.less
@@ -111,7 +111,7 @@
     }
 }
 
-.addon-modal-container {
+.meta-extension-modal-container {
     .modal-dialog-container {
         width: 80%;
         height: 80%;
@@ -120,7 +120,7 @@
             max-height: 1.2em;
         }
 
-        .addon-modal-iframe {
+        .meta-extension-modal-iframe {
             width: 100%;
             height: 100%;
         }

From 2d069ec6a65558b2a414d50093fa4acaa0174e9e Mon Sep 17 00:00:00 2001
From: svetlagasheva <svetulka_24@mail.bg>
Date: Mon, 4 May 2020 15:28:50 +0300
Subject: [PATCH 29/36] useMetaExtensions tabs wrapped in memo

---
 src/routes/MetaDetails/useMetaExtensions.js | 34 +++++++++++----------
 1 file changed, 18 insertions(+), 16 deletions(-)

diff --git a/src/routes/MetaDetails/useMetaExtensions.js b/src/routes/MetaDetails/useMetaExtensions.js
index 50435a19c..cbf8831b1 100644
--- a/src/routes/MetaDetails/useMetaExtensions.js
+++ b/src/routes/MetaDetails/useMetaExtensions.js
@@ -3,22 +3,24 @@
 const React = require('react');
 
 const useMetaExtensions = (metaResources) => {
-    const tabs = metaResources.filter((metaResource) => metaResource.content.type === 'Ready' && metaResource.content.content.metaExtensions.length > 0 && metaResource.addon !== null)
-        .map((metaResource) => {
-            return metaResource.content.content.metaExtensions.map((metaExtension) => {
-                const tab = {
-                    id: metaExtension.url,
-                    label: metaResource.addon.manifest.name,
-                    logo: metaResource.addon.manifest.logo,
-                    icon: 'ic_addons',
-                    metaExtension: metaExtension,
-                    onClick: () => { setSelected(tab); }
-                };
-                return tab;
-            });
-        })
-        .flat(2)
-        .filter((tab, index, tabs) => tabs.findIndex((_tab) => _tab.id === tab.id) === index);
+    const tabs = React.useMemo(() => {
+        return metaResources.filter((metaResource) => metaResource.content.type === 'Ready' && metaResource.content.content.metaExtensions.length > 0 && metaResource.addon !== null)
+            .map((metaResource) => {
+                return metaResource.content.content.metaExtensions.map((metaExtension) => {
+                    const tab = {
+                        id: metaExtension.url,
+                        label: metaResource.addon.manifest.name,
+                        logo: metaResource.addon.manifest.logo,
+                        icon: 'ic_addons',
+                        metaExtension: metaExtension,
+                        onClick: () => { setSelected(tab); }
+                    };
+                    return tab;
+                });
+            })
+            .flat(2)
+            .filter((tab, index, tabs) => tabs.findIndex((_tab) => _tab.id === tab.id) === index);
+    }, [metaResources]);
     const [selected, setSelected] = React.useState(null);
     const clearSelected = React.useCallback(() => {
         setSelected(null);

From 1258b7e97765f6a6978cb2e0d3760ca3d6f7bd93 Mon Sep 17 00:00:00 2001
From: svetlagasheva <svetulka_24@mail.bg>
Date: Mon, 4 May 2020 16:33:22 +0300
Subject: [PATCH 30/36] useMetaExtensions selected is of type metaExtension/ is
 renamed to selectedMetaExtension

---
 src/routes/MetaDetails/MetaDetails.js       | 12 ++++++------
 src/routes/MetaDetails/useMetaExtensions.js | 20 +++++++++-----------
 2 files changed, 15 insertions(+), 17 deletions(-)

diff --git a/src/routes/MetaDetails/MetaDetails.js b/src/routes/MetaDetails/MetaDetails.js
index 783841206..c1a6e13db 100644
--- a/src/routes/MetaDetails/MetaDetails.js
+++ b/src/routes/MetaDetails/MetaDetails.js
@@ -11,7 +11,7 @@ const styles = require('./styles');
 
 const MetaDetails = ({ urlParams }) => {
     const metaDetails = useMetaDetails(urlParams);
-    const { tabs, selected, clearSelected } = useMetaExtensions(metaDetails.meta_resources);
+    const { tabs, selectedMetaExtension, clearSelectedMetaExtension } = useMetaExtensions(metaDetails.meta_resources);
     const metaResourceRef = React.useMemo(() => {
         return metaDetails.selected !== null ? metaDetails.selected.meta_resources_ref : null;
     }, [metaDetails.selected]);
@@ -52,7 +52,7 @@ const MetaDetails = ({ urlParams }) => {
                         <VerticalNavBar
                             className={styles['vertical-nav-bar']}
                             tabs={tabs}
-                            selected={selected !== null ? selected.metaExtension.url : null}
+                            selected={selectedMetaExtension !== null ? selectedMetaExtension.url : null}
                         />
                         :
                         null
@@ -131,15 +131,15 @@ const MetaDetails = ({ urlParams }) => {
                 }
             </div>
             {
-                selected !== null ?
+                selectedMetaExtension !== null ?
                     <ModalDialog
                         className={styles['meta-extension-modal-container']}
-                        title={selected.metaExtension.name}
-                        onCloseRequest={clearSelected}>
+                        title={selectedMetaExtension.name}
+                        onCloseRequest={clearSelectedMetaExtension}>
                         <iframe
                             className={styles['meta-extension-modal-iframe']}
                             sandbox={'allow-forms allow-scripts allow-same-origin'}
-                            src={selected.metaExtension.url}
+                            src={selectedMetaExtension.url}
                         />
                     </ModalDialog>
                     :
diff --git a/src/routes/MetaDetails/useMetaExtensions.js b/src/routes/MetaDetails/useMetaExtensions.js
index cbf8831b1..c2ccca389 100644
--- a/src/routes/MetaDetails/useMetaExtensions.js
+++ b/src/routes/MetaDetails/useMetaExtensions.js
@@ -6,26 +6,24 @@ const useMetaExtensions = (metaResources) => {
     const tabs = React.useMemo(() => {
         return metaResources.filter((metaResource) => metaResource.content.type === 'Ready' && metaResource.content.content.metaExtensions.length > 0 && metaResource.addon !== null)
             .map((metaResource) => {
-                return metaResource.content.content.metaExtensions.map((metaExtension) => {
-                    const tab = {
+                return metaResource.content.content.metaExtensions.map((metaExtension) => (
+                    {
                         id: metaExtension.url,
                         label: metaResource.addon.manifest.name,
                         logo: metaResource.addon.manifest.logo,
                         icon: 'ic_addons',
-                        metaExtension: metaExtension,
-                        onClick: () => { setSelected(tab); }
-                    };
-                    return tab;
-                });
+                        onClick: () => { setSelectedMetaExtension(metaExtension); }
+                    }
+                ));
             })
             .flat(2)
             .filter((tab, index, tabs) => tabs.findIndex((_tab) => _tab.id === tab.id) === index);
     }, [metaResources]);
-    const [selected, setSelected] = React.useState(null);
-    const clearSelected = React.useCallback(() => {
-        setSelected(null);
+    const [selectedMetaExtension, setSelectedMetaExtension] = React.useState(null);
+    const clearSelectedMetaExtension = React.useCallback(() => {
+        setSelectedMetaExtension(null);
     }, []);
-    return { tabs, selected, clearSelected };
+    return { tabs, selectedMetaExtension, clearSelectedMetaExtension };
 };
 
 module.exports = useMetaExtensions;

From 8c5c63a281964e9cc8fcd108c5bdc7f55787c75a Mon Sep 17 00:00:00 2001
From: svetlagasheva <svetulka_24@mail.bg>
Date: Mon, 4 May 2020 19:49:42 +0300
Subject: [PATCH 31/36] selected season in detail page depends on query param

---
 src/common/deepLinking.js                       |  8 ++++++++
 src/routes/MetaDetails/MetaDetails.js           |  4 +++-
 src/routes/MetaDetails/VideosList/VideosList.js | 16 ++++++++++++----
 3 files changed, 23 insertions(+), 5 deletions(-)

diff --git a/src/common/deepLinking.js b/src/common/deepLinking.js
index beff1431a..1ac1ef7e9 100644
--- a/src/common/deepLinking.js
+++ b/src/common/deepLinking.js
@@ -48,6 +48,13 @@ const withLibItem = ({ libItem, streams = {} }) => {
     };
 };
 
+const withSeason = ({ season, type, id }) => {
+    const queryParams = new URLSearchParams([['season', season]]);
+    return {
+        meta_details_videos_season: `#/metadetails/${encodeURIComponent(type)}/${encodeURIComponent(id)}?${queryParams.toString()}`
+    };
+};
+
 const withVideo = ({ video, metaTransportUrl, metaItem, streams = {} }) => {
     const [stream, streamTransportUrl] = typeof streams[`${encodeURIComponent(metaItem.id)}/${encodeURIComponent(video.id)}`] === 'object' ?
         streams[`${encodeURIComponent(metaItem.id)}/${encodeURIComponent(video.id)}`]
@@ -85,6 +92,7 @@ module.exports = {
     withCatalog,
     withMetaItem,
     withLibItem,
+    withSeason,
     withVideo,
     withStream,
     serializeStream,
diff --git a/src/routes/MetaDetails/MetaDetails.js b/src/routes/MetaDetails/MetaDetails.js
index c1a6e13db..01d6f1143 100644
--- a/src/routes/MetaDetails/MetaDetails.js
+++ b/src/routes/MetaDetails/MetaDetails.js
@@ -9,7 +9,7 @@ const useMetaDetails = require('./useMetaDetails');
 const useMetaExtensions = require('./useMetaExtensions');
 const styles = require('./styles');
 
-const MetaDetails = ({ urlParams }) => {
+const MetaDetails = ({ urlParams, queryParams }) => {
     const metaDetails = useMetaDetails(urlParams);
     const { tabs, selectedMetaExtension, clearSelectedMetaExtension } = useMetaExtensions(metaDetails.meta_resources);
     const metaResourceRef = React.useMemo(() => {
@@ -26,6 +26,7 @@ const MetaDetails = ({ urlParams }) => {
     }, [metaDetails]);
     const streamsResourceRef = metaDetails.selected !== null ? metaDetails.selected.streams_resource_ref : null;
     const streamsResources = metaDetails.streams_resources;
+    const selectedSeason = queryParams.get('season');
     const selectedVideo = React.useMemo(() => {
         return streamsResourceRef !== null && selectedMetaResource !== null ?
             selectedMetaResource.content.content.videos.reduce((result, video) => {
@@ -125,6 +126,7 @@ const MetaDetails = ({ urlParams }) => {
                             <VideosList
                                 className={styles['videos-list']}
                                 metaResource={selectedMetaResource}
+                                season={parseInt(selectedSeason, 10)}
                             />
                             :
                             null
diff --git a/src/routes/MetaDetails/VideosList/VideosList.js b/src/routes/MetaDetails/VideosList/VideosList.js
index 5ea7e8b5c..259704999 100644
--- a/src/routes/MetaDetails/VideosList/VideosList.js
+++ b/src/routes/MetaDetails/VideosList/VideosList.js
@@ -3,6 +3,7 @@
 const React = require('react');
 const PropTypes = require('prop-types');
 const classnames = require('classnames');
+const deepLinking = require('stremio/common/deepLinking');
 const Image = require('stremio/common/Image');
 const SearchBar = require('stremio/common/SearchBar');
 const SeasonsBar = require('./SeasonsBar');
@@ -10,7 +11,7 @@ const Video = require('./Video');
 const useSelectableSeasons = require('./useSelectableSeasons');
 const styles = require('./styles');
 
-const VideosList = ({ className, metaResource }) => {
+const VideosList = ({ className, metaResource, season }) => {
     const videos = React.useMemo(() => {
         return metaResource && metaResource.content.type === 'Ready' ?
             metaResource.content.content.videos
@@ -19,8 +20,14 @@ const VideosList = ({ className, metaResource }) => {
     }, [metaResource]);
     const [seasons, selectedSeason, videosForSeason, selectSeason] = useSelectableSeasons(videos);
     const seasonOnSelect = React.useCallback((event) => {
+        const seasonDeepLink = deepLinking.withSeason({
+            season: event.value,
+            type: metaResource.request.path.type_name,
+            id: metaResource.request.path.id
+        });
         selectSeason(event.value);
-    }, []);
+        window.location.replace(seasonDeepLink.meta_details_videos_season);
+    }, [metaResource]);
     const [search, setSearch] = React.useState('');
     const searchInputOnChange = React.useCallback((event) => {
         setSearch(event.currentTarget.value);
@@ -52,7 +59,7 @@ const VideosList = ({ className, metaResource }) => {
                                 seasons.length > 1 ?
                                     <SeasonsBar
                                         className={styles['seasons-bar']}
-                                        season={selectedSeason}
+                                        season={season !== null && !isNaN(season) && typeof season === 'number' && seasons.includes(season) ? season : selectedSeason}
                                         seasons={seasons}
                                         onSelect={seasonOnSelect}
                                     />
@@ -88,7 +95,8 @@ const VideosList = ({ className, metaResource }) => {
 
 VideosList.propTypes = {
     className: PropTypes.string,
-    metaResource: PropTypes.object
+    metaResource: PropTypes.object,
+    season: PropTypes.number
 };
 
 module.exports = VideosList;

From e170bdb335da96ce624f67751756fddbc0741e2b Mon Sep 17 00:00:00 2001
From: svetlagasheva <svetulka_24@mail.bg>
Date: Tue, 5 May 2020 14:32:49 +0300
Subject: [PATCH 32/36] callback func when season is changed added;
 useSelectableSeason hook not used anymore

---
 src/routes/MetaDetails/MetaDetails.js         | 13 ++++-
 .../MetaDetails/VideosList/VideosList.js      | 48 +++++++++++++------
 2 files changed, 44 insertions(+), 17 deletions(-)

diff --git a/src/routes/MetaDetails/MetaDetails.js b/src/routes/MetaDetails/MetaDetails.js
index 01d6f1143..f1acddcc6 100644
--- a/src/routes/MetaDetails/MetaDetails.js
+++ b/src/routes/MetaDetails/MetaDetails.js
@@ -26,7 +26,15 @@ const MetaDetails = ({ urlParams, queryParams }) => {
     }, [metaDetails]);
     const streamsResourceRef = metaDetails.selected !== null ? metaDetails.selected.streams_resource_ref : null;
     const streamsResources = metaDetails.streams_resources;
-    const selectedSeason = queryParams.get('season');
+    const seasonQueryParam = React.useMemo(() => {
+        return queryParams.has('season') && !isNaN(queryParams.get('season')) ?
+            parseInt(queryParams.get('season'))
+            :
+            null;
+    }, [queryParams]);
+    const onSeasonChanged = React.useCallback((season) => {
+        window.location.replace(`#/metadetails/${selectedMetaResource.request.path.type_name}/${selectedMetaResource.request.path.id}?season=${season.value}`);
+    }, [selectedMetaResource]);
     const selectedVideo = React.useMemo(() => {
         return streamsResourceRef !== null && selectedMetaResource !== null ?
             selectedMetaResource.content.content.videos.reduce((result, video) => {
@@ -126,7 +134,8 @@ const MetaDetails = ({ urlParams, queryParams }) => {
                             <VideosList
                                 className={styles['videos-list']}
                                 metaResource={selectedMetaResource}
-                                season={parseInt(selectedSeason, 10)}
+                                season={seasonQueryParam}
+                                seasonOnSelect={onSeasonChanged}
                             />
                             :
                             null
diff --git a/src/routes/MetaDetails/VideosList/VideosList.js b/src/routes/MetaDetails/VideosList/VideosList.js
index 259704999..a6a53ed35 100644
--- a/src/routes/MetaDetails/VideosList/VideosList.js
+++ b/src/routes/MetaDetails/VideosList/VideosList.js
@@ -3,31 +3,48 @@
 const React = require('react');
 const PropTypes = require('prop-types');
 const classnames = require('classnames');
-const deepLinking = require('stremio/common/deepLinking');
 const Image = require('stremio/common/Image');
 const SearchBar = require('stremio/common/SearchBar');
 const SeasonsBar = require('./SeasonsBar');
 const Video = require('./Video');
-const useSelectableSeasons = require('./useSelectableSeasons');
 const styles = require('./styles');
 
-const VideosList = ({ className, metaResource, season }) => {
+const VideosList = ({ className, metaResource, season, seasonOnSelect }) => {
     const videos = React.useMemo(() => {
         return metaResource && metaResource.content.type === 'Ready' ?
             metaResource.content.content.videos
             :
             [];
     }, [metaResource]);
-    const [seasons, selectedSeason, videosForSeason, selectSeason] = useSelectableSeasons(videos);
-    const seasonOnSelect = React.useCallback((event) => {
-        const seasonDeepLink = deepLinking.withSeason({
-            season: event.value,
-            type: metaResource.request.path.type_name,
-            id: metaResource.request.path.id
-        });
-        selectSeason(event.value);
-        window.location.replace(seasonDeepLink.meta_details_videos_season);
-    }, [metaResource]);
+    const seasons = React.useMemo(() => {
+        return videos
+            .map(({ season }) => season)
+            .filter((season, index, seasons) => {
+                return season !== null &&
+                    !isNaN(season) &&
+                    typeof season === 'number' &&
+                    seasons.indexOf(season) === index;
+            })
+            .sort((a, b) => a - b);
+    }, [videos]);
+    const selectedSeason = React.useMemo(() => {
+        return seasons.includes(season) ?
+            season
+            :
+            seasons.length > 0 ?
+                seasons[seasons.length - 1]
+                :
+                null;
+    }, [seasons, season]);
+    const videosForSeason = React.useMemo(() => {
+        return videos
+            .filter((video) => {
+                return selectedSeason === null || video.season === selectedSeason;
+            })
+            .sort((a, b) => {
+                return a.episode - b.episode;
+            });
+    }, [videos, selectedSeason]);
     const [search, setSearch] = React.useState('');
     const searchInputOnChange = React.useCallback((event) => {
         setSearch(event.currentTarget.value);
@@ -59,7 +76,7 @@ const VideosList = ({ className, metaResource, season }) => {
                                 seasons.length > 1 ?
                                     <SeasonsBar
                                         className={styles['seasons-bar']}
-                                        season={season !== null && !isNaN(season) && typeof season === 'number' && seasons.includes(season) ? season : selectedSeason}
+                                        season={selectedSeason}
                                         seasons={seasons}
                                         onSelect={seasonOnSelect}
                                     />
@@ -96,7 +113,8 @@ const VideosList = ({ className, metaResource, season }) => {
 VideosList.propTypes = {
     className: PropTypes.string,
     metaResource: PropTypes.object,
-    season: PropTypes.number
+    season: PropTypes.number,
+    seasonOnSelect: PropTypes.func
 };
 
 module.exports = VideosList;

From 80d340801c0f99a89cf7df55b9b994f6fe3dd8ed Mon Sep 17 00:00:00 2001
From: svetlagasheva <svetulka_24@mail.bg>
Date: Tue, 5 May 2020 14:34:03 +0300
Subject: [PATCH 33/36] unnecessary withSeason func removed

---
 src/common/deepLinking.js | 8 --------
 1 file changed, 8 deletions(-)

diff --git a/src/common/deepLinking.js b/src/common/deepLinking.js
index 1ac1ef7e9..beff1431a 100644
--- a/src/common/deepLinking.js
+++ b/src/common/deepLinking.js
@@ -48,13 +48,6 @@ const withLibItem = ({ libItem, streams = {} }) => {
     };
 };
 
-const withSeason = ({ season, type, id }) => {
-    const queryParams = new URLSearchParams([['season', season]]);
-    return {
-        meta_details_videos_season: `#/metadetails/${encodeURIComponent(type)}/${encodeURIComponent(id)}?${queryParams.toString()}`
-    };
-};
-
 const withVideo = ({ video, metaTransportUrl, metaItem, streams = {} }) => {
     const [stream, streamTransportUrl] = typeof streams[`${encodeURIComponent(metaItem.id)}/${encodeURIComponent(video.id)}`] === 'object' ?
         streams[`${encodeURIComponent(metaItem.id)}/${encodeURIComponent(video.id)}`]
@@ -92,7 +85,6 @@ module.exports = {
     withCatalog,
     withMetaItem,
     withLibItem,
-    withSeason,
     withVideo,
     withStream,
     serializeStream,

From c9812aa7b0fd7a9544c67d2cf1fdd66c9abfad00 Mon Sep 17 00:00:00 2001
From: svetlagasheva <svetulka_24@mail.bg>
Date: Tue, 5 May 2020 14:39:16 +0300
Subject: [PATCH 34/36] useSelectableSeasons hook and tests for it dropped;

---
 .../VideosList/useSelectableSeasons.js        | 91 -------------------
 tests/hooks.spec.js                           | 52 -----------
 2 files changed, 143 deletions(-)
 delete mode 100644 src/routes/MetaDetails/VideosList/useSelectableSeasons.js
 delete mode 100644 tests/hooks.spec.js

diff --git a/src/routes/MetaDetails/VideosList/useSelectableSeasons.js b/src/routes/MetaDetails/VideosList/useSelectableSeasons.js
deleted file mode 100644
index 980625ee1..000000000
--- a/src/routes/MetaDetails/VideosList/useSelectableSeasons.js
+++ /dev/null
@@ -1,91 +0,0 @@
-// Copyright (C) 2017-2020 Smart code 203358507
-
-const React = require('react');
-
-const reducer = (state, action) => {
-    switch (action.type) {
-        case 'videos-changed': {
-            const seasons = action.videos
-                .map(({ season }) => season)
-                .filter((season, index, seasons) => {
-                    return season !== null &&
-                        !isNaN(season) &&
-                        typeof season === 'number' &&
-                        seasons.indexOf(season) === index;
-                })
-                .sort((a, b) => a - b);
-            const selectedSeason = seasons.includes(state.selectedSeason) ?
-                state.selectedSeason
-                :
-                seasons.length > 0 ?
-                    seasons[seasons.length - 1]
-                    :
-                    null;
-            return {
-                ...state,
-                videos: action.videos,
-                seasons,
-                selectedSeason
-            };
-        }
-        case 'season-changed': {
-            const selectedSeason = state.seasons.includes(action.season) ?
-                action.season
-                :
-                state.season;
-            return {
-                ...state,
-                selectedSeason
-            };
-        }
-        default: {
-            return state;
-        }
-    }
-};
-
-const initializer = (videos) => {
-    const initialState = {
-        videos: [],
-        seasons: [],
-        selectedSeason: null
-    };
-    const initAction = {
-        type: 'videos-changed',
-        videos
-    };
-
-    return reducer(initialState, initAction);
-};
-
-const useSelectableSeasons = (videos) => {
-    const [state, dispatch] = React.useReducer(
-        reducer,
-        videos,
-        initializer
-    );
-    const selectSeason = React.useCallback((season) => {
-        dispatch({
-            type: 'season-changed',
-            season
-        });
-    }, []);
-    const videosForSeason = React.useMemo(() => {
-        return state.videos
-            .filter((video) => {
-                return state.selectedSeason === null || video.season === state.selectedSeason;
-            })
-            .sort((a, b) => {
-                return a.episode - b.episode;
-            });
-    }, [state.videos, state.selectedSeason]);
-    React.useEffect(() => {
-        dispatch({
-            type: 'videos-changed',
-            videos
-        });
-    }, [videos]);
-    return [state.seasons, state.selectedSeason, videosForSeason, selectSeason];
-};
-
-module.exports = useSelectableSeasons;
diff --git a/tests/hooks.spec.js b/tests/hooks.spec.js
deleted file mode 100644
index 7a68de98e..000000000
--- a/tests/hooks.spec.js
+++ /dev/null
@@ -1,52 +0,0 @@
-// Copyright (C) 2017-2020 Smart code 203358507
-
-const { renderHook, act } = require('@testing-library/react-hooks');
-const useSelectableSeasons = require('../src/routes/MetaDetails/VideosList/useSelectableSeasons');
-
-const videos = [{ 'season': 4 }, { 'season': 5 }, { 'season': 4 }, { 'season': 7 }];
-
-describe('hooks tests', () => {
-    describe('useSelectableSeasons hook', () => {
-        it('match 7', async () => {
-            const { result } = renderHook(() => useSelectableSeasons(videos));
-            const [, selectedSeason] = result.current;
-            expect(selectedSeason).toBe(7);
-        });
-
-        it('match 5', async () => {
-            const { result } = renderHook(() => useSelectableSeasons(videos));
-
-            act(() => {
-                const [, , , selectSeason] = result.current;
-                selectSeason(5);
-            });
-
-            const [, selectedSeason] = result.current;
-            expect(selectedSeason).toBe(5);
-        });
-
-        it('not match 6', async () => {
-            const { result } = renderHook(() => useSelectableSeasons(videos));
-
-            act(() => {
-                const [, , , selectSeason] = result.current;
-                selectSeason(6);
-            });
-
-            const [, selectedSeason] = result.current;
-            expect(selectedSeason).toBe(undefined);
-        });
-
-        it('not match $', async () => {
-            const { result } = renderHook(() => useSelectableSeasons(videos));
-
-            act(() => {
-                const [, , , selectSeason] = result.current;
-                selectSeason('$');
-            });
-
-            const [, selectedSeason] = result.current;
-            expect(selectedSeason).toBe(undefined);
-        });
-    });
-});

From 015693db9dee6cf59c0dbaad028b839957c470b9 Mon Sep 17 00:00:00 2001
From: svetlagasheva <svetulka_24@mail.bg>
Date: Tue, 5 May 2020 15:29:48 +0300
Subject: [PATCH 35/36] onSeasonsChanged season renamed to event

---
 src/routes/MetaDetails/MetaDetails.js | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/src/routes/MetaDetails/MetaDetails.js b/src/routes/MetaDetails/MetaDetails.js
index f1acddcc6..50aa87bb6 100644
--- a/src/routes/MetaDetails/MetaDetails.js
+++ b/src/routes/MetaDetails/MetaDetails.js
@@ -32,8 +32,8 @@ const MetaDetails = ({ urlParams, queryParams }) => {
             :
             null;
     }, [queryParams]);
-    const onSeasonChanged = React.useCallback((season) => {
-        window.location.replace(`#/metadetails/${selectedMetaResource.request.path.type_name}/${selectedMetaResource.request.path.id}?season=${season.value}`);
+    const onSeasonChanged = React.useCallback((event) => {
+        window.location.replace(`#/metadetails/${selectedMetaResource.request.path.type_name}/${selectedMetaResource.request.path.id}?season=${event.value}`);
     }, [selectedMetaResource]);
     const selectedVideo = React.useMemo(() => {
         return streamsResourceRef !== null && selectedMetaResource !== null ?

From 05fdbd13b27d6ee5729ff6a8b6b95eadddd2a972 Mon Sep 17 00:00:00 2001
From: svetlagasheva <svetulka_24@mail.bg>
Date: Tue, 5 May 2020 15:31:16 +0300
Subject: [PATCH 36/36] onSeasonChanged func renamed to seasonOnSelect

---
 src/routes/MetaDetails/MetaDetails.js | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/src/routes/MetaDetails/MetaDetails.js b/src/routes/MetaDetails/MetaDetails.js
index 50aa87bb6..ecda0105a 100644
--- a/src/routes/MetaDetails/MetaDetails.js
+++ b/src/routes/MetaDetails/MetaDetails.js
@@ -32,7 +32,7 @@ const MetaDetails = ({ urlParams, queryParams }) => {
             :
             null;
     }, [queryParams]);
-    const onSeasonChanged = React.useCallback((event) => {
+    const seasonOnSelect = React.useCallback((event) => {
         window.location.replace(`#/metadetails/${selectedMetaResource.request.path.type_name}/${selectedMetaResource.request.path.id}?season=${event.value}`);
     }, [selectedMetaResource]);
     const selectedVideo = React.useMemo(() => {
@@ -135,7 +135,7 @@ const MetaDetails = ({ urlParams, queryParams }) => {
                                 className={styles['videos-list']}
                                 metaResource={selectedMetaResource}
                                 season={seasonQueryParam}
-                                seasonOnSelect={onSeasonChanged}
+                                seasonOnSelect={seasonOnSelect}
                             />
                             :
                             null