From da274e02cf063725661b59b1d59d49ec8196d9ed Mon Sep 17 00:00:00 2001
From: nklhrstv <me@nikolahristov.com>
Date: Wed, 6 Jan 2021 18:25:47 +0200
Subject: [PATCH] adapt images with the new build system

---
 src/common/NavBar/HorizontalNavBar/HorizontalNavBar.js | 2 +-
 src/common/NavBar/HorizontalNavBar/NavMenu/NavMenu.js  | 4 ++--
 src/routes/Discover/Discover.js                        | 4 ++--
 src/routes/Intro/Intro.js                              | 2 +-
 src/routes/Library/Library.js                          | 6 +++---
 src/routes/MetaDetails/MetaDetails.js                  | 6 +++---
 src/routes/MetaDetails/StreamsList/StreamsList.js      | 4 ++--
 src/routes/MetaDetails/VideosList/VideosList.js        | 2 +-
 src/routes/NotFound/NotFound.js                        | 2 +-
 src/routes/Player/BufferingLoader/BufferingLoader.js   | 2 +-
 src/routes/Search/Search.js                            | 2 +-
 src/routes/Settings/Settings.js                        | 4 ++--
 12 files changed, 20 insertions(+), 20 deletions(-)

diff --git a/src/common/NavBar/HorizontalNavBar/HorizontalNavBar.js b/src/common/NavBar/HorizontalNavBar/HorizontalNavBar.js
index 097d331ee..d5f2ed5f9 100644
--- a/src/common/NavBar/HorizontalNavBar/HorizontalNavBar.js
+++ b/src/common/NavBar/HorizontalNavBar/HorizontalNavBar.js
@@ -33,7 +33,7 @@ const HorizontalNavBar = React.memo(({ className, route, query, title, backButto
                     <div className={styles['logo-container']}>
                         <Image
                             className={styles['logo']}
-                            src={'/images/stremio_symbol.png'}
+                            src={require('/images/stremio_symbol.png')}
                             alt={' '}
                         />
                     </div>
diff --git a/src/common/NavBar/HorizontalNavBar/NavMenu/NavMenu.js b/src/common/NavBar/HorizontalNavBar/NavMenu/NavMenu.js
index 66118f3c9..f1a84f5fb 100644
--- a/src/common/NavBar/HorizontalNavBar/NavMenu/NavMenu.js
+++ b/src/common/NavBar/HorizontalNavBar/NavMenu/NavMenu.js
@@ -50,9 +50,9 @@ const NavMenu = (props) => {
                     className={styles['avatar-container']}
                     style={{
                         backgroundImage: profile.auth === null ?
-                            'url(\'/images/anonymous.png\')'
+                            `url('${require('/images/anonymous.png')}')`
                             :
-                            `url('${profile.auth.user.avatar}'), url('/images/default_avatar.png')`
+                            `url('${profile.auth.user.avatar}'), url('${require('/images/default_avatar.png')}')`
                     }}
                 />
                 <div className={styles['email-container']}>
diff --git a/src/routes/Discover/Discover.js b/src/routes/Discover/Discover.js
index 992d6a5c3..56ea7401d 100644
--- a/src/routes/Discover/Discover.js
+++ b/src/routes/Discover/Discover.js
@@ -113,13 +113,13 @@ const Discover = ({ urlParams, queryParams }) => {
                     {
                         discover.catalog === null ?
                             <div className={styles['message-container']}>
-                                <Image className={styles['image']} src={'/images/empty.png'} alt={' '} />
+                                <Image className={styles['image']} src={require('/images/empty.png')} alt={' '} />
                                 <div className={styles['message-label']}>No catalog selected!</div>
                             </div>
                             :
                             discover.catalog.content.type === 'Err' ?
                                 <div className={styles['message-container']}>
-                                    <Image className={styles['image']} src={'/images/empty.png'} alt={' '} />
+                                    <Image className={styles['image']} src={require('/images/empty.png')} alt={' '} />
                                     <div className={styles['message-label']}>{discover.catalog.content.content}</div>
                                 </div>
                                 :
diff --git a/src/routes/Intro/Intro.js b/src/routes/Intro/Intro.js
index 49eeaa39b..b7cf2e5d7 100644
--- a/src/routes/Intro/Intro.js
+++ b/src/routes/Intro/Intro.js
@@ -282,7 +282,7 @@ const Intro = ({ queryParams }) => {
         <div className={styles['intro-container']}>
             <div className={styles['form-container']}>
                 <div className={styles['logo-container']}>
-                    <Image className={styles['logo']} src={'/images/stremio_symbol.png'} alt={' '} />
+                    <Image className={styles['logo']} src={require('/images/stremio_symbol.png')} alt={' '} />
                     <Icon className={styles['name']} icon={'ic_stremio'} />
                 </div>
                 <Button className={classnames(styles['form-button'], styles['facebook-button'])} onClick={loginWithFacebook}>
diff --git a/src/routes/Library/Library.js b/src/routes/Library/Library.js
index 268ba7c7d..72091f270 100644
--- a/src/routes/Library/Library.js
+++ b/src/routes/Library/Library.js
@@ -37,7 +37,7 @@ const Library = ({ model, urlParams, queryParams }) => {
                         <div className={classnames(styles['message-container'], styles['no-user-message-container'])}>
                             <Image
                                 className={styles['image']}
-                                src={'/images/anonymous.png'}
+                                src={require('/images/anonymous.png')}
                                 alt={' '}
                             />
                             <Button className={styles['login-button-container']} href={'#/intro'}>
@@ -50,7 +50,7 @@ const Library = ({ model, urlParams, queryParams }) => {
                             <div className={styles['message-container']}>
                                 <Image
                                     className={styles['image']}
-                                    src={'/images/empty.png'}
+                                    src={require('/images/empty.png')}
                                     alt={' '}
                                 />
                                 <div className={styles['message-label']}>{model === 'library' ? 'Library' : 'Continue Watching'} not loaded!</div>
@@ -60,7 +60,7 @@ const Library = ({ model, urlParams, queryParams }) => {
                                 <div className={styles['message-container']}>
                                     <Image
                                         className={styles['image']}
-                                        src={'/images/empty.png'}
+                                        src={require('/images/empty.png')}
                                         alt={' '}
                                     />
                                     <div className={styles['message-label']}>Empty {model === 'library' ? 'Library' : 'Continue Watching'}</div>
diff --git a/src/routes/MetaDetails/MetaDetails.js b/src/routes/MetaDetails/MetaDetails.js
index 3f1d20f2f..1f9c94f10 100644
--- a/src/routes/MetaDetails/MetaDetails.js
+++ b/src/routes/MetaDetails/MetaDetails.js
@@ -84,19 +84,19 @@ const MetaDetails = ({ urlParams, queryParams }) => {
                 {
                     metaPath === null ?
                         <div className={styles['meta-message-container']}>
-                            <Image className={styles['image']} src={'/images/empty.png'} alt={' '} />
+                            <Image className={styles['image']} src={require('/images/empty.png')} alt={' '} />
                             <div className={styles['message-label']}>No meta was selected!</div>
                         </div>
                         :
                         metaDetails.metaItem === null ?
                             <div className={styles['meta-message-container']}>
-                                <Image className={styles['image']} src={'/images/empty.png'} alt={' '} />
+                                <Image className={styles['image']} src={require('/images/empty.png')} alt={' '} />
                                 <div className={styles['message-label']}>No addons ware requested for this meta!</div>
                             </div>
                             :
                             metaDetails.metaItem.content.type === 'Err' ?
                                 <div className={styles['meta-message-container']}>
-                                    <Image className={styles['image']} src={'/images/empty.png'} alt={' '} />
+                                    <Image className={styles['image']} src={require('/images/empty.png')} alt={' '} />
                                     <div className={styles['message-label']}>No metadata was found!</div>
                                 </div>
                                 :
diff --git a/src/routes/MetaDetails/StreamsList/StreamsList.js b/src/routes/MetaDetails/StreamsList/StreamsList.js
index 2942ce85d..36c7cf6ae 100644
--- a/src/routes/MetaDetails/StreamsList/StreamsList.js
+++ b/src/routes/MetaDetails/StreamsList/StreamsList.js
@@ -25,13 +25,13 @@ const StreamsList = ({ className, ...props }) => {
             {
                 props.streams.length === 0 ?
                     <div className={styles['message-container']}>
-                        <Image className={styles['image']} src={'/images/empty.png'} alt={' '} />
+                        <Image className={styles['image']} src={require('/images/empty.png')} alt={' '} />
                         <div className={styles['label']}>No addons were requested for streams!</div>
                     </div>
                     :
                     props.streams.every((streams) => streams.content.type === 'Err') ?
                         <div className={styles['message-container']}>
-                            <Image className={styles['image']} src={'/images/empty.png'} alt={' '} />
+                            <Image className={styles['image']} src={require('/images/empty.png')} alt={' '} />
                             <div className={styles['label']}>No streams were found!</div>
                         </div>
                         :
diff --git a/src/routes/MetaDetails/VideosList/VideosList.js b/src/routes/MetaDetails/VideosList/VideosList.js
index 07753e10e..b240b8a16 100644
--- a/src/routes/MetaDetails/VideosList/VideosList.js
+++ b/src/routes/MetaDetails/VideosList/VideosList.js
@@ -67,7 +67,7 @@ const VideosList = ({ className, metaItem, season, seasonOnSelect }) => {
                     :
                     metaItem.content.type === 'Err' || videosForSeason.length === 0 ?
                         <div className={styles['message-container']}>
-                            <Image className={styles['image']} src={'/images/empty.png'} alt={' '} />
+                            <Image className={styles['image']} src={require('/images/empty.png')} alt={' '} />
                             <div className={styles['label']}>No videos found for this meta!</div>
                         </div>
                         :
diff --git a/src/routes/NotFound/NotFound.js b/src/routes/NotFound/NotFound.js
index a85ded2d9..0b4617286 100644
--- a/src/routes/NotFound/NotFound.js
+++ b/src/routes/NotFound/NotFound.js
@@ -17,7 +17,7 @@ const NotFound = () => {
             <div className={styles['not-found-content']}>
                 <Image
                     className={styles['not-found-image']}
-                    src={'/images/empty.png'}
+                    src={require('/images/empty.png')}
                     alt={' '}
                 />
                 <div className={styles['not-found-label']}>Page not found!</div>
diff --git a/src/routes/Player/BufferingLoader/BufferingLoader.js b/src/routes/Player/BufferingLoader/BufferingLoader.js
index cda6bacfb..ecd08f2e6 100644
--- a/src/routes/Player/BufferingLoader/BufferingLoader.js
+++ b/src/routes/Player/BufferingLoader/BufferingLoader.js
@@ -13,7 +13,7 @@ const BufferingLoader = ({ className, logo }) => {
                 className={styles['buffering-loader']}
                 src={logo}
                 alt={' '}
-                fallbackSrc={'/images/stremio_symbol.png'}
+                fallbackSrc={require('/images/stremio_symbol.png')}
             />
         </div>
     );
diff --git a/src/routes/Search/Search.js b/src/routes/Search/Search.js
index d1bdc2378..94066ab90 100644
--- a/src/routes/Search/Search.js
+++ b/src/routes/Search/Search.js
@@ -42,7 +42,7 @@ const Search = ({ queryParams }) => {
                             <div className={styles['message-container']}>
                                 <Image
                                     className={styles['image']}
-                                    src={'/images/empty.png'}
+                                    src={require('/images/empty.png')}
                                     alt={' '}
                                 />
                                 <div className={styles['message-label']}>No addons were requested for catalogs!</div>
diff --git a/src/routes/Settings/Settings.js b/src/routes/Settings/Settings.js
index 306e8a5b5..546912994 100644
--- a/src/routes/Settings/Settings.js
+++ b/src/routes/Settings/Settings.js
@@ -158,9 +158,9 @@ const Settings = () => {
                                 className={styles['avatar-container']}
                                 style={{
                                     backgroundImage: profile.auth === null ?
-                                        'url(\'/images/anonymous.png\')'
+                                        `url('${require('/images/anonymous.png')}')`
                                         :
-                                        `url('${profile.auth.user.avatar}'), url('/images/default_avatar.png')`
+                                        `url('${profile.auth.user.avatar}'), url('${require('/images/default_avatar.png')}')`
                                 }}
                             />
                             <div className={styles['email-logout-container']}>