@@ -54,7 +58,7 @@ export const ObjectItem = ({
href="#"
onClick={e => {
e.preventDefault()
- onClick()
+ checked ? uncheckObject(name) : checkObject(name)
}}
>
{name}
diff --git a/browser/app/js/objects/ObjectsBulkActions.js b/browser/app/js/objects/ObjectsBulkActions.js
index fc63fc5b9..ef06f7b47 100644
--- a/browser/app/js/objects/ObjectsBulkActions.js
+++ b/browser/app/js/objects/ObjectsBulkActions.js
@@ -28,6 +28,15 @@ export class ObjectsBulkActions extends React.Component {
showDeleteConfirmation: false
}
}
+ handleDownload() {
+ const { checkedObjects, resetCheckedList, downloadChecked, downloadObject } = this.props
+ if (checkedObjects.length === 1) {
+ downloadObject(checkedObjects[0])
+ resetCheckedList()
+ } else {
+ downloadChecked()
+ }
+ }
deleteChecked() {
const { deleteChecked } = this.props
deleteChecked()
@@ -39,24 +48,28 @@ export class ObjectsBulkActions extends React.Component {
})
}
render() {
- const { checkedObjectsCount, downloadChecked, clearChecked } = this.props
+ const { checkedObjects, clearChecked } = this.props
return (
0
+ " list-actions-toggled": checkedObjects.length > 0
})
}
>
- {checkedObjectsCount} Objects
+ {checkedObjects.length}
+ {checkedObjects.length === 1 ? " Object " : " Objects "}
selected
-
@@ -86,13 +99,15 @@ export class ObjectsBulkActions extends React.Component {
const mapStateToProps = state => {
return {
- checkedObjectsCount: getCheckedList(state).length
+ checkedObjects: getCheckedList(state)
}
}
const mapDispatchToProps = dispatch => {
return {
downloadChecked: () => dispatch(actions.downloadCheckedObjects()),
+ downloadObject: object => dispatch(actions.downloadObject(object)),
+ resetCheckedList: () => dispatch(actions.resetCheckedList()),
clearChecked: () => dispatch(actions.resetCheckedList()),
deleteChecked: () => dispatch(actions.deleteCheckedObjects())
}
diff --git a/browser/app/js/objects/__tests__/ObjectItem.test.js b/browser/app/js/objects/__tests__/ObjectItem.test.js
index 5a692b254..b2f3ca04e 100644
--- a/browser/app/js/objects/__tests__/ObjectItem.test.js
+++ b/browser/app/js/objects/__tests__/ObjectItem.test.js
@@ -28,33 +28,22 @@ describe("ObjectItem", () => {
expect(wrapper.prop("data-type")).toBe("image")
})
- it("should call onClick when the object isclicked", () => {
- const onClick = jest.fn()
- const wrapper = shallow()
- wrapper.find("a").simulate("click", { preventDefault: jest.fn() })
- expect(onClick).toHaveBeenCalled()
- })
-
- it("should call checkObject when the object/prefix is checked", () => {
+ it("should call checkObject when the object is selected", () => {
const checkObject = jest.fn()
- const wrapper = shallow(
-
- )
- wrapper.find("input[type='checkbox']").simulate("change")
+ const wrapper = shallow()
+ wrapper.find("a").simulate("click", { preventDefault: jest.fn() })
expect(checkObject).toHaveBeenCalledWith("test")
})
- it("should render checked checkbox", () => {
+ it("should render highlighted row when object is selected", () => {
const wrapper = shallow()
- expect(wrapper.find("input[type='checkbox']").prop("checked")).toBeTruthy()
+ expect(wrapper.find(".fesl-row").hasClass("fesl-row-selected")).toBeTruthy()
})
- it("should call uncheckObject when the object/prefix is unchecked", () => {
+ it("should call uncheckObject when the object is deselected", () => {
const uncheckObject = jest.fn()
- const wrapper = shallow(
-
- )
- wrapper.find("input[type='checkbox']").simulate("change")
+ const wrapper = shallow()
+ wrapper.find("a").simulate("click", { preventDefault: jest.fn() })
expect(uncheckObject).toHaveBeenCalledWith("test")
})
})
diff --git a/browser/app/js/objects/__tests__/ObjectsBulkActions.test.js b/browser/app/js/objects/__tests__/ObjectsBulkActions.test.js
index 9948bc1f2..f7cd51e87 100644
--- a/browser/app/js/objects/__tests__/ObjectsBulkActions.test.js
+++ b/browser/app/js/objects/__tests__/ObjectsBulkActions.test.js
@@ -20,19 +20,33 @@ import { ObjectsBulkActions } from "../ObjectsBulkActions"
describe("ObjectsBulkActions", () => {
it("should render without crashing", () => {
- shallow()
+ shallow()
})
it("should show actions when checkObjectsCount is more than 0", () => {
- const wrapper = shallow()
+ const wrapper = shallow()
expect(wrapper.hasClass("list-actions-toggled")).toBeTruthy()
})
- it("should call downloadChecked when download button is clicked", () => {
+ it("should call downloadObject for single object when download button is clicked", () => {
+ const downloadObject = jest.fn()
+ const resetCheckedList = jest.fn()
+ const wrapper = shallow(
+
+ )
+ wrapper.find("#download-checked").simulate("click")
+ expect(downloadObject).toHaveBeenCalled()
+ })
+
+ it("should call downloadChecked for multiple objects when download button is clicked", () => {
const downloadChecked = jest.fn()
const wrapper = shallow(
)
@@ -43,14 +57,14 @@ describe("ObjectsBulkActions", () => {
it("should call clearChecked when close button is clicked", () => {
const clearChecked = jest.fn()
const wrapper = shallow(
-
+
)
wrapper.find("#close-bulk-actions").simulate("click")
expect(clearChecked).toHaveBeenCalled()
})
it("shoud show DeleteObjectConfirmModal when delete-checked button is clicked", () => {
- const wrapper = shallow()
+ const wrapper = shallow()
wrapper.find("#delete-checked").simulate("click")
wrapper.update()
expect(wrapper.find("DeleteObjectConfirmModal").length).toBe(1)
@@ -60,7 +74,7 @@ describe("ObjectsBulkActions", () => {
const deleteChecked = jest.fn()
const wrapper = shallow(
)
diff --git a/browser/app/less/inc/list.less b/browser/app/less/inc/list.less
index 88860bf99..40391357f 100644
--- a/browser/app/less/inc/list.less
+++ b/browser/app/less/inc/list.less
@@ -74,7 +74,7 @@ div.fesl-row {
border-bottom: 1px solid transparent;
cursor: default;
.transition(background-color);
- .transition-duration(500ms);
+ .transition-duration(300ms);
@media (max-width: (@screen-xs-max - 100px)) {
padding: 5px 20px;
@@ -87,16 +87,8 @@ div.fesl-row {
}
&:hover {
- .fis-icon {
- &:before {
- .opacity(0)
- }
- }
-
- .fis-helper {
- &:before {
- .opacity(1);
- }
+ &:not(.fesl-row-selected) {
+ background: lighten(@text-muted-color, 22%);
}
}
@@ -137,6 +129,14 @@ div.fesl-row {
.fesl-row-selected {
background-color: @list-row-selected-bg;
+ &:nth-child(even) {
+ background-color: @list-row-selected-even-bg;
+ }
+
+ &:hover {
+ background: @list-row-selected-hover;
+ }
+
&, .fesl-item a {
color: darken(@text-color, 10%);
}
@@ -161,27 +161,6 @@ div.fesl-row {
height: 35px;
z-index: 8;
opacity: 0;
- cursor: pointer;
-
- &:checked {
- & ~ .fis-icon {
- background-color: #32393F;
-
- &:before {
- opacity: 0;
- }
- }
-
- & ~ .fis-helper {
- &:before {
- .scale(0);
- }
-
- &:after {
- .scale(1);
- }
- }
- }
}
}
@@ -210,38 +189,6 @@ div.fesl-row {
}
}
-.fis-helper {
- &:before,
- &:after {
- position: absolute;
- .transition(all);
- .transition-duration(250ms);
- }
-
- &:before {
- content: '';
- width: 15px;
- height: 15px;
- border: 2px solid @white;
- z-index: 7;
- border-radius: 2px;
- top: 10px;
- left: 10px;
- opacity: 0;
- }
-
- &:after {
- font-family: @font-family-icon;
- content: '\f00c';
- top: 8px;
- left: 9px;
- color: @white;
- font-size: 14px;
- .scale(0);
- }
-}
-
-
/*--------------------------
Files and Folders
----------------------------*/
diff --git a/browser/app/less/inc/variables.less b/browser/app/less/inc/variables.less
index a89008007..3c00a01cc 100644
--- a/browser/app/less/inc/variables.less
+++ b/browser/app/less/inc/variables.less
@@ -97,5 +97,7 @@
/*-------------------------
List
--------------------------*/
-@list-row-selected-bg: #fbf2bf;
+@list-row-selected-bg: #fffad6;
+@list-row-selected-even-bg: #faf5d1;
+@list-row-selected-hover: #f5f0cc;
@list-row-even-bg: #fafafa;
\ No newline at end of file
diff --git a/browser/ui-assets.go b/browser/ui-assets.go
index 92665f18b..fda602725 100644
--- a/browser/ui-assets.go
+++ b/browser/ui-assets.go
@@ -4,7 +4,7 @@
// production/favicon.ico
// production/firefox.png
// production/index.html
-// production/index_bundle-2018-06-06T21-58-06Z.js
+// production/index_bundle-2018-06-07T17-00-32Z.js
// production/loader.css
// production/logo.svg
// production/safari.png
@@ -65,7 +65,7 @@ func productionChromePng() (*asset, error) {
return nil, err
}
- info := bindataFileInfo{name: "production/chrome.png", size: 3726, mode: os.FileMode(436), modTime: time.Unix(1528322314, 0)}
+ info := bindataFileInfo{name: "production/chrome.png", size: 3726, mode: os.FileMode(420), modTime: time.Unix(1528390855, 0)}
a := &asset{bytes: bytes, info: info}
return a, nil
}
@@ -82,7 +82,7 @@ func productionFaviconIco() (*asset, error) {
return nil, err
}
- info := bindataFileInfo{name: "production/favicon.ico", size: 501, mode: os.FileMode(436), modTime: time.Unix(1528322314, 0)}
+ info := bindataFileInfo{name: "production/favicon.ico", size: 501, mode: os.FileMode(420), modTime: time.Unix(1528390855, 0)}
a := &asset{bytes: bytes, info: info}
return a, nil
}
@@ -99,7 +99,7 @@ func productionFirefoxPng() (*asset, error) {
return nil, err
}
- info := bindataFileInfo{name: "production/firefox.png", size: 4795, mode: os.FileMode(436), modTime: time.Unix(1528322314, 0)}
+ info := bindataFileInfo{name: "production/firefox.png", size: 4795, mode: os.FileMode(420), modTime: time.Unix(1528390855, 0)}
a := &asset{bytes: bytes, info: info}
return a, nil
}
@@ -156,8 +156,8 @@ var _productionIndexHTML = []byte(`
-
-
+
+