diff --git a/ui/package-lock.json b/ui/package-lock.json
index 9067f6a6..7873d16d 100644
--- a/ui/package-lock.json
+++ b/ui/package-lock.json
@@ -1,5 +1,5 @@
{
- "name": "grand-stack-starter-ui",
+ "name": "photoview-ui",
"version": "0.0.1",
"lockfileVersion": 1,
"requires": true,
diff --git a/ui/src/Pages/AllAlbumsPage/AlbumBox.js b/ui/src/Pages/AllAlbumsPage/AlbumBox.js
index ee4b5fbe..d6438e60 100644
--- a/ui/src/Pages/AllAlbumsPage/AlbumBox.js
+++ b/ui/src/Pages/AllAlbumsPage/AlbumBox.js
@@ -46,15 +46,20 @@ export const AlbumBox = ({ album, ...props }) => {
)
}
+ let thumbnail =
+ album.photos[0] &&
+ album.photos[0].thumbnail &&
+ album.photos[0].thumbnail.url
+
+ thumbnail =
+ thumbnail ||
+ (album.subAlbums[0] &&
+ album.subAlbums[0].photos[0] &&
+ album.subAlbums[0].photos[0].thumbnail.url)
+
return (
-
+
{album.title}
)
diff --git a/ui/src/Pages/AllAlbumsPage/AlbumsPage.js b/ui/src/Pages/AllAlbumsPage/AlbumsPage.js
index 6b24a023..f6eba39c 100644
--- a/ui/src/Pages/AllAlbumsPage/AlbumsPage.js
+++ b/ui/src/Pages/AllAlbumsPage/AlbumsPage.js
@@ -9,11 +9,18 @@ const getAlbumsQuery = gql`
myAlbums(filter: { parentAlbum: null }, orderBy: title_asc) {
id
title
- photos {
+ photos(first: 1) {
thumbnail {
url
}
}
+ subAlbums(first: 1) {
+ photos(first: 1) {
+ thumbnail {
+ url
+ }
+ }
+ }
}
}
`
diff --git a/ui/src/Pages/PhotosPage/PhotosPage.js b/ui/src/Pages/PhotosPage/PhotosPage.js
index 5983bbed..d02d3417 100644
--- a/ui/src/Pages/PhotosPage/PhotosPage.js
+++ b/ui/src/Pages/PhotosPage/PhotosPage.js
@@ -2,6 +2,7 @@ import React, { Component } from 'react'
import Layout from '../../Layout'
import gql from 'graphql-tag'
import { Query } from 'react-apollo'
+import { Link } from 'react-router-dom'
import PhotoGallery from '../../components/photoGallery/PhotoGallery'
import PhotoSidebar from '../../components/sidebar/PhotoSidebar'
@@ -95,7 +96,9 @@ class PhotosPage extends Component {
if (data.myAlbums) {
galleryGroups = data.myAlbums.map((album, index) => (
-
{album.title}
+
+
{album.title}
+
{
this.setActiveImage(index, photoIndex)
diff --git a/ui/src/components/photoGallery/PhotoGallery.js b/ui/src/components/photoGallery/PhotoGallery.js
index 289d9296..8ce81d60 100644
--- a/ui/src/components/photoGallery/PhotoGallery.js
+++ b/ui/src/components/photoGallery/PhotoGallery.js
@@ -93,6 +93,8 @@ class PhotoGallery extends React.Component {
let photoElements = null
if (photos) {
+ photos.filter(photo => photo.thumbnail)
+
photoElements = photos.map((photo, index) => {
const active = activeIndex == index