mirror
/
photoview
mirror of https://github.com/photoview/photoview.git
1
Fork 0
Code

Fix UI tests

This commit is contained in:
viktorstrate 2021-09-25 14:47:54 +02:00
parent e7dbe0868d
commit 2c0baa6bdf
No known key found for this signature in database
GPG Key ID: 3F855605109C1E8A
4 changed files with 192 additions and 112 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
ui/src/components/photoGallery/PhotoGallery.tsx
View File

@ -30,7 +30,7 @@ const Gallery = styled.div`
} }
` `
const PhotoFiller = styled.div` export const PhotoFiller = styled.div`
height: 200px; height: 200px;
flex-grow: 999999; flex-grow: 999999;
` `

5
ui/src/components/timelineGallery/TimelineGroupAlbum.tsx
View File

@ -1,6 +1,7 @@
import React from 'react' import React from 'react'
import { Link } from 'react-router-dom' import { Link } from 'react-router-dom'
import { MediaThumbnail } from '../photoGallery/MediaThumbnail' import { MediaThumbnail } from '../photoGallery/MediaThumbnail'
import { PhotoFiller } from '../photoGallery/PhotoGallery'
import { import {
toggleFavoriteAction, toggleFavoriteAction,
useMarkFavoriteMutation, useMarkFavoriteMutation,
@ -72,9 +73,9 @@ const TimelineGroupAlbum = ({
<Link to={`/album/${albumID}`} className="hover:underline"> <Link to={`/album/${albumID}`} className="hover:underline">
{albumTitle} {albumTitle}
</Link> </Link>
<div className="flex flex-wrap items-center h-[210px] relative -mx-1 pr-4 overflow-hidden"> <div className="flex flex-wrap items-center relative -mx-1 pr-4 overflow-hidden">
{mediaElms} {mediaElms}
{/* {itemsBubble} */} <PhotoFiller />
</div> </div>
</div> </div>
) )

287
ui/src/components/timelineGallery/timelineGalleryReducer.test.ts
View File

@ -144,102 +144,171 @@ describe('timeline gallery reducer', () => {
media: -1, media: -1,
}, },
timelineGroups: [ timelineGroups: [
// { {
// date: '2020-12-13T00:00:00Z', date: '2020-12-13T00:00:00Z',
// albums: [ albums: [
// { {
// id: '522', id: '522',
// title: 'random', media: [
// media: [ {
// { __typename: 'Media',
// __typename: 'Media', album: {
// id: '1058', __typename: 'Album',
// title: '122A2876.jpg', id: '522',
// type: MediaType.Photo, title: 'random',
// thumbnail: { },
// __typename: 'MediaURL', date: '2020-12-13T18:03:40Z',
// url: 'http://localhost:4001/photo/thumbnail_122A2876_jpg_Kp1U80vD.jpg', favorite: false,
// width: 1024, highRes: {
// height: 682, __typename: 'MediaURL',
// }, height: 4480,
// highRes: { url: 'http://localhost:4001/photo/122A2876_5cSPMiKL.jpg',
// __typename: 'MediaURL', width: 6720,
// url: 'http://localhost:4001/photo/122A2876_5cSPMiKL.jpg', },
// width: 6720, id: '1058',
// height: 4480, thumbnail: {
// }, __typename: 'MediaURL',
// videoWeb: null, height: 682,
// favorite: false, url: 'http://localhost:4001/photo/thumbnail_122A2876_jpg_Kp1U80vD.jpg',
// album: { __typename: 'Album', id: '522', title: 'random' }, width: 1024,
// date: '2020-12-13T18:03:40Z', },
// }, title: '122A2876.jpg',
// ], type: 'Photo',
// }, videoWeb: null,
// ], },
// }, ],
// { title: 'random',
// date: '2020-11-25T00:00:00Z', },
// albums: [ ],
// { },
// id: '523', {
// title: 'another_album', date: '2020-11-25T00:00:00Z',
// media: [ albums: [
// { {
// __typename: 'Media', id: '523',
// id: '1059', title: 'another_album',
// title: '122A2630-Edit.jpg', media: [
// type: MediaType.Photo, {
// thumbnail: { __typename: 'Media',
// __typename: 'MediaURL', album: {
// url: 'http://localhost:4001/photo/thumbnail_122A2630-Edit_jpg_pwjtMkpy.jpg', __typename: 'Album',
// width: 1024, id: '523',
// height: 682, title: 'another_album',
// }, },
// highRes: { date: '2020-11-25T16:14:33Z',
// __typename: 'MediaURL', favorite: false,
// url: 'http://localhost:4001/photo/122A2630-Edit_ySQWFAgE.jpg', highRes: {
// width: 6177, __typename: 'MediaURL',
// height: 4118, height: 4118,
// }, url: 'http://localhost:4001/photo/122A2630-Edit_ySQWFAgE.jpg',
// videoWeb: null, width: 6177,
// favorite: false, },
// album: { id: '1059',
// __typename: 'Album', thumbnail: {
// id: '523', __typename: 'MediaURL',
// title: 'another_album', height: 682,
// }, url: 'http://localhost:4001/photo/thumbnail_122A2630-Edit_jpg_pwjtMkpy.jpg',
// date: '2020-11-25T16:14:33Z', width: 1024,
// }, },
// { title: '122A2630-Edit.jpg',
// __typename: 'Media', type: 'Photo',
// id: '1060', videoWeb: null,
// title: '122A2785-2.jpg', },
// type: MediaType.Photo, {
// thumbnail: { __typename: 'Media',
// __typename: 'MediaURL', album: {
// url: 'http://localhost:4001/photo/thumbnail_122A2785-2_jpg_CevmxEXf.jpg', __typename: 'Album',
// width: 1024, id: '523',
// height: 1024, title: 'another_album',
// }, },
// highRes: { date: '2020-11-25T16:43:59Z',
// __typename: 'MediaURL', favorite: false,
// url: 'http://localhost:4001/photo/122A2785-2_mCnWjLdb.jpg', highRes: {
// width: 884, __typename: 'MediaURL',
// height: 884, height: 884,
// }, url: 'http://localhost:4001/photo/122A2785-2_mCnWjLdb.jpg',
// videoWeb: null, width: 884,
// favorite: false, },
// album: { id: '1060',
// __typename: 'Album', thumbnail: {
// id: '523', __typename: 'MediaURL',
// title: 'another_album', height: 1024,
// }, url: 'http://localhost:4001/photo/thumbnail_122A2785-2_jpg_CevmxEXf.jpg',
// date: '2020-11-25T16:43:59Z', width: 1024,
// }, },
// ], title: '122A2785-2.jpg',
// }, type: 'Photo',
// ], videoWeb: null,
// }, },
],
},
{
id: '522',
title: 'random',
media: [
{
__typename: 'Media',
album: {
__typename: 'Album',
id: '522',
title: 'random',
},
date: '2020-11-25T16:14:33Z',
favorite: false,
highRes: {
__typename: 'MediaURL',
height: 4118,
url: 'http://localhost:4001/photo/122A2630-Edit_em9g89qg.jpg',
width: 6177,
},
id: '1056',
thumbnail: {
__typename: 'MediaURL',
height: 682,
url: 'http://localhost:4001/photo/thumbnail_122A2630-Edit_jpg_aJPCSDDl.jpg',
width: 1024,
},
title: '122A2630-Edit.jpg',
type: 'Photo',
videoWeb: null,
},
],
},
],
},
{
date: '2020-11-09T00:00:00Z',
albums: [
{
id: '522',
title: 'random',
media: [
{
__typename: 'Media',
id: '1054',
title: '122A2559.jpg',
type: MediaType.Photo,
thumbnail: {
__typename: 'MediaURL',
url: 'http://localhost:4001/photo/thumbnail_122A2559_jpg_MsOJtPi8.jpg',
width: 1024,
height: 712,
},
highRes: {
__typename: 'MediaURL',
url: 'http://localhost:4001/photo/122A2559_FDsQHuBN.jpg',
width: 6246,
height: 4346,
},
videoWeb: null,
favorite: false,
album: { __typename: 'Album', id: '522', title: 'random' },
date: '2020-11-09T15:38:09Z',
},
],
},
],
},
], ],
}) })
}) })
@ -291,20 +360,20 @@ describe('timeline gallery reducer', () => {
media: 0, media: 0,
}, },
out: { out: {
date: 0, date: 1,
album: 0, album: 0,
media: 1, media: 0,
}, },
}, },
{ {
name: 'next album', name: 'next album',
in: { in: {
date: 0, date: 1,
album: 0, album: 0,
media: 1, media: 1,
}, },
out: { out: {
date: 0, date: 1,
album: 1, album: 1,
media: 0, media: 0,
}, },
@ -312,12 +381,12 @@ describe('timeline gallery reducer', () => {
{ {
name: 'next date', name: 'next date',
in: { in: {
date: 0, date: 1,
album: 1, album: 1,
media: 1, media: 0,
}, },
out: { out: {
date: 1, date: 2,
album: 0, album: 0,
media: 0, media: 0,
}, },
@ -325,12 +394,12 @@ describe('timeline gallery reducer', () => {
{ {
name: 'reached end', name: 'reached end',
in: { in: {
date: 1, date: 2,
album: 0, album: 0,
media: 0, media: 0,
}, },
out: { out: {
date: 1, date: 2,
album: 0, album: 0,
media: 0, media: 0,
}, },
@ -390,12 +459,12 @@ describe('timeline gallery reducer', () => {
{ {
name: 'previous album', name: 'previous album',
in: { in: {
date: 0, date: 1,
album: 1, album: 1,
media: 0, media: 0,
}, },
out: { out: {
date: 0, date: 1,
album: 0, album: 0,
media: 1, media: 1,
}, },
@ -403,12 +472,12 @@ describe('timeline gallery reducer', () => {
{ {
name: 'previous date', name: 'previous date',
in: { in: {
date: 1, date: 2,
album: 0, album: 0,
media: 0, media: 0,
}, },
out: { out: {
date: 0, date: 1,
album: 1, album: 1,
media: 0, media: 0,
}, },

10
ui/src/components/timelineGallery/timelineGalleryReducer.tsx
View File

@ -2,6 +2,7 @@ import React from 'react'
import { myTimeline_myTimeline } from './__generated__/myTimeline' import { myTimeline_myTimeline } from './__generated__/myTimeline'
import { TimelineGroup, TimelineGroupAlbum } from './TimelineGallery' import { TimelineGroup, TimelineGroupAlbum } from './TimelineGallery'
import { GalleryAction } from '../photoGallery/photoGalleryReducer' import { GalleryAction } from '../photoGallery/photoGalleryReducer'
import { isNil } from '../../helpers/utils'
export interface TimelineMediaIndex { export interface TimelineMediaIndex {
date: number date: number
@ -245,6 +246,15 @@ function convertMediaToTimelineGroups(
nextAlbum.media.push(media) nextAlbum.media.push(media)
} }
if (!isNil(nextAlbum)) {
albums.push(nextAlbum)
timelineGroups.push({
date: albums[0].media[0].date.replace(/\d{2}:\d{2}:\d{2}/, '00:00:00'),
albums: albums,
})
}
return timelineGroups return timelineGroups
} }