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,
};