From 42e8d7ddcd9d4e1b81a8a2db85eb8021d6ebc07a Mon Sep 17 00:00:00 2001
From: svetlagasheva <svetulka_24@mail.bg>
Date: Tue, 26 Nov 2019 10:59:12 +0200
Subject: [PATCH] handle all state cases in library

---
 src/routes/Library/Library.js | 44 +++++++++++++++++++++--------------
 1 file changed, 27 insertions(+), 17 deletions(-)

diff --git a/src/routes/Library/Library.js b/src/routes/Library/Library.js
index abbb0b136..f27f84f66 100644
--- a/src/routes/Library/Library.js
+++ b/src/routes/Library/Library.js
@@ -9,7 +9,7 @@ const styles = require('./styles');
 
 const Library = ({ urlParams, queryParams }) => {
     const user = useUser();
-    const [selectedType, typeNames, libItems] = useLibrary(urlParams);
+    const [libraryState, selectedType, typeNames, libItems] = useLibrary(urlParams);
     const [selectSortInput, sortFunction] = useSort(urlParams, queryParams);
     const loginButtonOnClick = React.useCallback(() => {
         window.location.replace('#/intro');
@@ -51,26 +51,36 @@ const Library = ({ urlParams, queryParams }) => {
                                 </Button>
                             </div>
                             :
-                            selectedType !== null ?
-                                libItems.length > 0 ?
-                                    <div className={styles['meta-items-container']}>
-                                        {libItems
-                                            .sort(sortFunction)
-                                            .map(({ removed, temp, ...libItem }, index) => (
-                                                <MetaItem
-                                                    {...libItem}
-                                                    key={index}
-                                                />
-                                            ))}
-                                    </div>
+                            libraryState != 'Ready' ?
+                                <div className={styles['message-container']}>
+                                    Loading
+                                </div>
+                                :
+                                typeNames.length > 0 ?
+                                    selectedType !== null ?
+                                        libItems.length > 0 ?
+                                            <div className={styles['meta-items-container']}>
+                                                {libItems
+                                                    .sort(sortFunction)
+                                                    .map(({ removed, temp, ...libItem }, index) => (
+                                                        <MetaItem
+                                                            {...libItem}
+                                                            key={index}
+                                                        />
+                                                    ))}
+                                            </div>
+                                            :
+                                            <div className={styles['message-container']}>
+                                                Empty library
+                                            </div>
+                                        :
+                                        <div className={styles['message-container']}>
+                                            Select a type, please
+                                        </div>
                                     :
                                     <div className={styles['message-container']}>
                                         Empty library
                                     </div>
-                                :
-                                <div className={styles['message-container']}>
-                                    Loading
-                                </div>
                     }
                 </div>
             </div>