From 18797da16c49a76d74efc598514b7ddcc11d6a0b Mon Sep 17 00:00:00 2001
From: john <johnbarlas39@gmail.com>
Date: Mon, 17 Apr 2017 22:01:44 +0300
Subject: [PATCH] handle empty book list
---
app/components/Dashboard/BookList.jsx | 11 ++++++++++-
app/components/Dashboard/dashboard.local.scss | 4 ++++
2 files changed, 14 insertions(+), 1 deletion(-)
diff --git a/app/components/Dashboard/BookList.jsx b/app/components/Dashboard/BookList.jsx
index 7bacc75..9183f31 100644
--- a/app/components/Dashboard/BookList.jsx
+++ b/app/components/Dashboard/BookList.jsx
@@ -1,13 +1,22 @@
-import { map, reverse, sortBy } from 'lodash'
+import { isEmpty, map, reverse, sortBy } from 'lodash'
import React from 'react'
import Book from './Book'
+import styles from './dashboard.local.scss'
class BookList extends React.Component {
renderBookList () {
const { books, container, remove } = this.props
if (!books) return 'Fetching...'
+ if (isEmpty(books)) {
+ return (
+ <div className={styles['booklist-empty']}>
+ There are no books to display.
+ </div>
+ )
+ }
+
const items = reverse(sortBy(books, 'created'))
const bookComponents = map(items, book => {
diff --git a/app/components/Dashboard/dashboard.local.scss b/app/components/Dashboard/dashboard.local.scss
index 53a46c1..cf09e56 100644
--- a/app/components/Dashboard/dashboard.local.scss
+++ b/app/components/Dashboard/dashboard.local.scss
@@ -88,4 +88,8 @@ $medium-grey: #838587;
text-decoration: none;
}
}
+
+ .booklist-empty {
+ padding-top: 15px;
+ }
}
--
GitLab