link fe: more informative "empty list" display
Displays "Loading..." if the links haven't loaded yet. If there are no
links, tells the user they can save one.
@@ -57,7 +57,20 @@ export class Links extends Component {
? Number(props.links.totalPages)
: 1;
- let LinkList = Object.keys(links)
+ let LinkList = (<LoadingScreen/>);
+ if (props.links && props.links.totalItems === 0) {
+ //TODO the below re-used from landing screen. refactor into MessageScreen?
+ LinkList = (
+ <div className="h-100 w-100 overflow-x-hidden bg-white bg-gray0-d dn db-ns">
+ <div className="pl3 pr3 pt2 dt pb3 w-100 h-100">
+ <p className="f8 pt3 gray2 w-100 h-100 dtc v-mid tc">
+ Start by posting a link to this collection.
+ </p>
+ </div>
+ </div>
+ );
+ } else if (Object.keys(links).length > 0) {
+ LinkList = Object.keys(links)
.map((linkIndex) => {
let linksObj = props.links[linkPage];
let { title, url, time, ship } = linksObj[linkIndex];
@@ -88,7 +101,8 @@ export class Links extends Component {
popout={props.popout}
/>
)
- })
+ });
+ }
return (
<div
