Browser: Update UI with new components and elements (#5671)

This commit is contained in:
Rushan
2018-03-21 23:39:23 +05:30
committed by Harshavardhana
parent 384b4fdf28
commit 1459c4be1e
199 changed files with 10549 additions and 4702 deletions

View File

@@ -23,61 +23,57 @@ export const ObjectsHeader = ({
sortNameOrder,
sortSizeOrder,
sortLastModifiedOrder,
sortObjects
sortObjects,
}) => (
<div className="feb-container">
<header className="fesl-row" data-type="folder">
<div className="fesl-item fesl-item-icon" />
<div
className="fesl-item fesl-item-name"
id="sort-by-name"
onClick={() => sortObjects("name")}
data-sort="name"
>
Name
<i
className={classNames({
"fesli-sort": true,
fa: true,
"fa-sort-alpha-desc": sortNameOrder,
"fa-sort-alpha-asc": !sortNameOrder
})}
/>
</div>
<div
className="fesl-item fesl-item-size"
id="sort-by-size"
onClick={() => sortObjects("size")}
data-sort="size"
>
Size
<i
className={classNames({
"fesli-sort": true,
fa: true,
"fa-sort-amount-desc": sortSizeOrder,
"fa-sort-amount-asc": !sortSizeOrder
})}
/>
</div>
<div
className="fesl-item fesl-item-modified"
id="sort-by-last-modified"
onClick={() => sortObjects("last-modified")}
data-sort="last-modified"
>
Last Modified
<i
className={classNames({
"fesli-sort": true,
fa: true,
"fa-sort-numeric-desc": sortLastModifiedOrder,
"fa-sort-numeric-asc": !sortLastModifiedOrder
})}
/>
</div>
<div className="fesl-item fesl-item-actions" />
</header>
<div className="objects__row objects__header hidden-xs">
<div
className="objects__column objects__column--name"
id="sort-by-name"
onClick={() => sortObjects("name")}
data-sort="name"
>
Name
<i
className={classNames({
objects__sort: true,
zmdi: true,
"zmdi-sort-desc": sortNameOrder,
"zmdi-sort-asc": !sortNameOrder,
})}
/>
</div>
<div
className="objects__column objects__column--size"
id="sort-by-size"
onClick={() => sortObjects("size")}
data-sort="size"
>
Size
<i
className={classNames({
objects__sort: true,
zmdi: true,
"zmdi-sort-amount-desc": sortSizeOrder,
"zmdi-sort-amount-asc": !sortSizeOrder,
})}
/>
</div>
<div
className="objects__column objects__column--date"
id="sort-by-last-modified"
onClick={() => sortObjects("last-modified")}
data-sort="last-modified"
>
Last Modified
<i
className={classNames({
objects__sort: true,
zmdi: true,
"zmdi-sort-amount-desc": sortLastModifiedOrder,
"zmdi-sort-amount-asc": !sortLastModifiedOrder,
})}
/>
</div>
</div>
)
@@ -86,13 +82,13 @@ const mapStateToProps = state => {
sortNameOrder: state.objects.sortBy == "name" && state.objects.sortOrder,
sortSizeOrder: state.objects.sortBy == "size" && state.objects.sortOrder,
sortLastModifiedOrder:
state.objects.sortBy == "last-modified" && state.objects.sortOrder
state.objects.sortBy == "last-modified" && state.objects.sortOrder,
}
}
const mapDispatchToProps = dispatch => {
return {
sortObjects: sortBy => dispatch(actionsObjects.sortObjects(sortBy))
sortObjects: sortBy => dispatch(actionsObjects.sortObjects(sortBy)),
}
}