renamed varaiable and refactoring
This commit is contained in:
parent
a9d6419607
commit
d7d8b3d3aa
|
@ -9,7 +9,7 @@ import { IconWithMessage } from './SelectedFileOptions';
|
||||||
|
|
||||||
interface Props {
|
interface Props {
|
||||||
setCollectionSortBy: (sortBy: COLLECTION_SORT_BY) => void;
|
setCollectionSortBy: (sortBy: COLLECTION_SORT_BY) => void;
|
||||||
collectionSortBy: COLLECTION_SORT_BY;
|
activeSortBy: COLLECTION_SORT_BY;
|
||||||
}
|
}
|
||||||
export default function CollectionSort(props: Props) {
|
export default function CollectionSort(props: Props) {
|
||||||
const collectionSortOptions = CollectionSortOptions(props);
|
const collectionSortOptions = CollectionSortOptions(props);
|
||||||
|
|
|
@ -7,8 +7,8 @@ import styled from 'styled-components';
|
||||||
import constants from 'utils/strings/constants';
|
import constants from 'utils/strings/constants';
|
||||||
import { MenuItem, MenuLink } from './CollectionOptions';
|
import { MenuItem, MenuLink } from './CollectionOptions';
|
||||||
|
|
||||||
interface Props {
|
interface OptionProps {
|
||||||
collectionSortBy: COLLECTION_SORT_BY;
|
activeSortBy: COLLECTION_SORT_BY;
|
||||||
setCollectionSortBy: (sortBy: COLLECTION_SORT_BY) => void;
|
setCollectionSortBy: (sortBy: COLLECTION_SORT_BY) => void;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@ -17,12 +17,10 @@ const TickWrapper = styled.span`
|
||||||
margin-left: 5px;
|
margin-left: 5px;
|
||||||
`;
|
`;
|
||||||
|
|
||||||
const CollectionSortOptions = (props: Props) => {
|
const SortByOptionCreator =
|
||||||
const { setCollectionSortBy, collectionSortBy: activeSortBy } = props;
|
({ setCollectionSortBy, activeSortBy }: OptionProps) =>
|
||||||
const SortByOption = (props: {
|
(props: { sortBy: COLLECTION_SORT_BY; children: any }) =>
|
||||||
sortBy: COLLECTION_SORT_BY;
|
(
|
||||||
children: any;
|
|
||||||
}) => (
|
|
||||||
<MenuItem>
|
<MenuItem>
|
||||||
<Row>
|
<Row>
|
||||||
<Label width="20px">
|
<Label width="20px">
|
||||||
|
@ -35,13 +33,19 @@ const CollectionSortOptions = (props: Props) => {
|
||||||
<Value width="165px">
|
<Value width="165px">
|
||||||
<MenuLink
|
<MenuLink
|
||||||
onClick={() => setCollectionSortBy(props.sortBy)}
|
onClick={() => setCollectionSortBy(props.sortBy)}
|
||||||
variant={activeSortBy === props.sortBy && 'success'}>
|
variant={
|
||||||
|
activeSortBy === props.sortBy && 'success'
|
||||||
|
}>
|
||||||
{props.children}
|
{props.children}
|
||||||
</MenuLink>
|
</MenuLink>
|
||||||
</Value>
|
</Value>
|
||||||
</Row>
|
</Row>
|
||||||
</MenuItem>
|
</MenuItem>
|
||||||
);
|
);
|
||||||
|
|
||||||
|
const CollectionSortOptions = (props: OptionProps) => {
|
||||||
|
const SortByOption = SortByOptionCreator(props);
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<Popover id="collection-sort-options" style={{ borderRadius: '10px' }}>
|
<Popover id="collection-sort-options" style={{ borderRadius: '10px' }}>
|
||||||
<Popover.Content
|
<Popover.Content
|
||||||
|
|
|
@ -269,7 +269,7 @@ export default function Collections(props: CollectionProps) {
|
||||||
</CollectionContainer>
|
</CollectionContainer>
|
||||||
<CollectionSort
|
<CollectionSort
|
||||||
setCollectionSortBy={setCollectionSortBy}
|
setCollectionSortBy={setCollectionSortBy}
|
||||||
collectionSortBy={collectionSortBy}
|
activeSortBy={collectionSortBy}
|
||||||
/>
|
/>
|
||||||
</CollectionBar>
|
</CollectionBar>
|
||||||
</>
|
</>
|
||||||
|
|
Loading…
Reference in a new issue