diff --git a/ui/app/components/List/tests/index.test.jsx b/ui/app/components/List/tests/index.test.jsx index 94814bc48..522e00158 100755 --- a/ui/app/components/List/tests/index.test.jsx +++ b/ui/app/components/List/tests/index.test.jsx @@ -15,7 +15,7 @@ describe('', () => { test('should pass all items props to rendered component', () => { const items = [{ id: 1, name: 'Hello' }, { id: 2, name: 'World' }]; - const component = ({ item, key }) =>
  • {item.name}
  • ; + const component = ({ item }) =>
  • {item.name}
  • ; const { container, getByText } = render( , diff --git a/ui/app/containers/Walk/ListFolders.jsx b/ui/app/containers/Walk/ListFile.jsx similarity index 88% rename from ui/app/containers/Walk/ListFolders.jsx rename to ui/app/containers/Walk/ListFile.jsx index d2c335289..c32a0b5d1 100644 --- a/ui/app/containers/Walk/ListFolders.jsx +++ b/ui/app/containers/Walk/ListFile.jsx @@ -7,7 +7,7 @@ import walkUtils from './util'; const { isImage } = walkUtils; -function Contents({ item: file }) { +function ListFile({ item: file }) { if (isImage(file)) { return null; } @@ -27,4 +27,4 @@ function Contents({ item: file }) { ); } -export default Contents; +export default ListFile; diff --git a/ui/app/containers/Walk/index.jsx b/ui/app/containers/Walk/index.jsx index 803bcbcc6..5df3bf27c 100644 --- a/ui/app/containers/Walk/index.jsx +++ b/ui/app/containers/Walk/index.jsx @@ -13,16 +13,15 @@ import { useInjectReducer } from '../../utils/injectReducer'; import walkUtils from './util'; import GenericList from '../../components/GenericList'; -import ListFolders from './ListFolders'; +import ListFile from './ListFile'; import Menu from './Menu'; import OrganizePreviews from '../../components/OrganizePreviews'; -const { isImage } = walkUtils; - -function parseQueryString(find, from) { - if (!find || !from) return ''; - return RegExp(`[?&]${find}(=([^&#]*)|&|#|$)`).exec(from)[2]; -} +const { + addUpFolderPath, + isImage, + parseQueryString, +} = walkUtils; function Walk({ doListDirectory, @@ -46,6 +45,8 @@ function Walk({ content: file.filename, ...file, })); + addUpFolderPath(itemFiles, path); + const itemImages = itemFiles.filter((file) => isImage(file)); const hasImages = !loading && itemImages.length > 0; @@ -62,7 +63,7 @@ function Walk({ />, ', () => { + test('should render a folder', () => { + const path = 'testPath'; + const { container } = render(); + expect(container.querySelector('a').href).toEqual(`http://localhost/?path=${path}`); + }); + + test('should avoid an image', () => { + const { container } = render(); + expect(container.querySelector('li')).toEqual(null); + }); +}); diff --git a/ui/app/containers/Walk/tests/util.test.js b/ui/app/containers/Walk/tests/util.test.js new file mode 100644 index 000000000..7016fe010 --- /dev/null +++ b/ui/app/containers/Walk/tests/util.test.js @@ -0,0 +1,56 @@ +/* global beforeEach, describe, expect, test */ +import util from '../util'; + +const { + addUpFolderPath, + isImage, +} = util; + +describe('Walk - util', () => { + describe('isImage', () => { + test('detect JPG', () => { + expect(isImage({ mediumType: 'image', ext: 'JPEG' })).toEqual(true); + expect(isImage({ mediumType: 'image', ext: 'jpeg' })).toEqual(true); + expect(isImage({ mediumType: 'image', ext: 'JPG' })).toEqual(true); + expect(isImage({ mediumType: 'image', ext: 'jpg' })).toEqual(true); + }); + + test('ignore RAW', () => { + expect(isImage({ mediumType: 'image', ext: 'RAW' })).toEqual(false); + expect(isImage({ mediumType: 'image', ext: 'ARW' })).toEqual(false); + }); + }); + + describe('addUpFolderPath', () => { + const file = { + filename: '..', + mediumType: 'folder', + }; + let dummyFile; + + beforeEach(() => { + dummyFile = { id: 'testid.js', ext: 'js' }; + }); + + test('hide when at root folder', () => { + expect(addUpFolderPath([dummyFile], null)).toEqual([dummyFile]); + expect(addUpFolderPath([dummyFile])).toEqual([dummyFile]); + expect(addUpFolderPath([dummyFile], '')).toEqual([dummyFile]); + }); + + test('one level deep', () => { + const expectedFile = { ...file, path: '' }; + expect(addUpFolderPath([dummyFile], 'galleries')).toEqual([expectedFile, dummyFile]); + }); + + test('two levels deep', () => { + const expectedFile = { ...file, path: 'galleries' }; + expect(addUpFolderPath([dummyFile], 'galleries/gallery-demo')).toEqual([expectedFile, dummyFile]); + }); + + test('three levels deep', () => { + const expectedFile = { ...file, path: 'galleries/gallery-demo' }; + expect(addUpFolderPath([dummyFile], 'galleries/gallery-demo/thumbs')).toEqual([expectedFile, dummyFile]); + }); + }); +}); diff --git a/ui/app/containers/Walk/util.js b/ui/app/containers/Walk/util.js index c3f15eb4e..fb746a83c 100644 --- a/ui/app/containers/Walk/util.js +++ b/ui/app/containers/Walk/util.js @@ -4,6 +4,38 @@ function isImage(file) { return (file.mediumType === 'image' && config.supportedFileTypes.photo.includes(file.ext.toLowerCase())); } +function parseQueryString(find, from) { + if (!find || !from) return ''; + return RegExp(`[?&]${find}(=([^&#]*)|&|#|$)`).exec(from)[2]; +} + +function addUpFolderPath(itemFiles, path) { + const file = { + filename: '..', + mediumType: 'folder', + }; + + if (path) { + if (path.lastIndexOf('/') > -1) { + const splitPath = path.split('/'); + splitPath.pop(); + itemFiles.unshift({ + path: splitPath.join('/'), + ...file, + }); + } else { + itemFiles.unshift({ + path: '', + ...file, + }); + } + } + + return itemFiles; +} + export default { + addUpFolderPath, isImage, + parseQueryString, };